requirebin sketch

index.js

var v = document.createElement('video');
v.id = 'myVideo';
document.body.appendChild(v);

var getUserMedia = require('getusermedia');
var attachMediaStream = require('attachmediastream');

// get user media
getUserMedia(function (err, stream) {
    // if the browser doesn't support user media
    // or the user says "no" the error gets passed
    // as the first argument.
    if (err) {
      console.log('failed');
    } else {
      console.log('got a stream', stream);  

      // attaches a stream to an element (it returns the element)
      var videoEl = attachMediaStream(stream, document.getElementById('myVideo'));

      // if you don't pass an element it will create a video tag
      var generatedVideoEl = attachMediaStream(stream);

      // you can also pass options
      var videoEl = attachMediaStream(stream, someEl, {
        // this will set the autoplay attribute on the video tag
        // this is true by default but you can turn it off with this option.
        autoplay: true, 

        // let's you mirror the video. It's false by default, but it's common 
        // to mirror video when showing a user their own video feed.
        // This makes that easy.
        mirror: true,

        // muted is false, by default
        // this will mute the video. Again, this is a good idea when showing
        // a user their own video. Or there will be feedback issues.
        muted: true
      });

    }
});

minified.js

require=function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);throw new Error("Cannot find module '"+o+"'")}var f=n[o]={exports:{}};t[o][0].call(f.exports,function(e){var n=t[o][1][e];return s(n?n:e)},f,f.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({w3S0NG:[function(require,module,exports){var func=window.navigator.getUserMedia||window.navigator.webkitGetUserMedia||window.navigator.mozGetUserMedia||window.navigator.msGetUserMedia;module.exports=function(constraints,cb){var options;var haveOpts=arguments.length===2;var defaultOpts={video:true,audio:true};var error;var denied="PERMISSION_DENIED";var notSatified="CONSTRAINT_NOT_SATISFIED";if(!haveOpts){cb=constraints;constraints=defaultOpts}if(!func){error=new Error("NavigatorUserMediaError");error.name="NOT_SUPPORTED_ERROR";return cb(error)}func.call(window.navigator,constraints,function(stream){cb(null,stream)},function(err){var error;if(typeof err==="string"){error=new Error("NavigatorUserMediaError");if(err===denied){error.name=denied}else{error.name=notSatified}}else{error=err;if(!error.name){if(error[denied]){err.name=denied}else{err.name=notSatified}}}cb(error)})}},{}],getusermedia:[function(require,module,exports){module.exports=require("w3S0NG")},{}]},{},[]);require=function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);throw new Error("Cannot find module '"+o+"'")}var f=n[o]={exports:{}};t[o][0].call(f.exports,function(e){var n=t[o][1][e];return s(n?n:e)},f,f.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({"5mWiHR":[function(require,module,exports){module.exports=function(stream,el,options){var URL=window.URL;var opts={autoplay:true,mirror:false,muted:false};var element=el||document.createElement("video");var item;if(options){for(item in options){opts[item]=options[item]}}if(opts.autoplay)element.autoplay="autoplay";if(opts.muted)element.muted=true;if(opts.mirror){["","moz","webkit","o","ms"].forEach(function(prefix){var styleName=prefix?prefix+"Transform":"transform";element.style[styleName]="scaleX(-1)"})}if(URL&&URL.createObjectURL){element.src=URL.createObjectURL(stream)}else if(element.srcObject){element.srcObject=stream}else if(element.mozSrcObject){element.mozSrcObject=stream}else{return false}return element}},{}],attachmediastream:[function(require,module,exports){module.exports=require("5mWiHR")},{}]},{},[]);var v=document.createElement("video");v.id="myVideo";document.body.appendChild(v);var getUserMedia=require("getusermedia");var attachMediaStream=require("attachmediastream");getUserMedia(function(err,stream){if(err){console.log("failed")}else{console.log("got a stream",stream);var videoEl=attachMediaStream(stream,document.getElementById("myVideo"));var generatedVideoEl=attachMediaStream(stream);var videoEl=attachMediaStream(stream,someEl,{autoplay:true,mirror:true,muted:true})}});

package.json

{
  "name": "requirebin-sketch",
  "version": "1.0.0",
  "dependencies": {
    "getusermedia": "0.2.2",
    "attachmediastream": "1.0.1"
  }
}

page-head.html

<style type='text/css'>html, body { margin: 0; padding: 0; border: 0; }
body, html { height: 100%; width: 100%; }</style>

requirebin.md

made with requirebin