johannilsson/webrtcgetusermediademo.html

## webrtcgetusermediademo.html
<!doctype html>
<!--
To run this demo you need to have seriously and the nightvision effect.

wget https://raw.github.com/brianchirls/Seriously.js/master/seriously.js
mkdir effects
cd effects
wget https://raw.github.com/brianchirls/Seriously.js/aacdc75665d98a52c8a0c2e0e0cbbf85b136a151/effects/seriously.nightvision.js
-->
<html>
  <head>
    <title>WebRTC getUserMedia Demo</title>
  </head>
  <style>
    #source {
      display: none;
    }
    #target {
      width: 220px;
      height: 165px;
    }
  </style>
  <body>
    <p id="errorMessage"></p>
    <p>
      <video id="source" autoplay></video>
      <canvas id="target"></canvas>
    </p>

    <script src="seriously.js"></script>
    <script src="effects/seriously.nightvision.js"></script>
    <script>
    var video = document.getElementById('source');
    var canvas = document.getElementById('target');
    if (navigator.getUserMedia) {
      navigator.getUserMedia({audio: true, video: true}, gotStream, noStream);
    } else {
      navigator.webkitGetUserMedia({audio: true, video: true}, gotStream, noStream);
    }

    function gotStream(stream) {
      if (navigator.getUserMedia) {
        video.src = stream;
      } else {
        video.src = webkitURL.createObjectURL(stream);
      }

      var seriously, source, target;
      seriously = new Seriously();
      source = seriously.source('#source');
      target = seriously.target('#target');
      target.source = source;
      var nightvision = seriously.effect('nightvision');
      nightvision.source = source;
      target.source = nightvision;

      seriously.go();
    }

    function noStream() {
      document.getElementById('errorMessage').textContent =
        'No camera available.';
    }
    </script>
  </body>
</html>
	<!doctype html>
	<!--
	To run this demo you need to have seriously and the nightvision effect.

	wget https://raw.github.com/brianchirls/Seriously.js/master/seriously.js
	mkdir effects
	cd effects
	wget https://raw.github.com/brianchirls/Seriously.js/aacdc75665d98a52c8a0c2e0e0cbbf85b136a151/effects/seriously.nightvision.js
	-->
	<html>
	<head>
	<title>WebRTC getUserMedia Demo</title>
	</head>
	<style>
	#source {
	display: none;
	}
	#target {
	width: 220px;
	height: 165px;
	}
	</style>
	<body>
	<p id="errorMessage"></p>
	<p>
	<video id="source" autoplay></video>
	<canvas id="target"></canvas>
	</p>

	<script src="seriously.js"></script>
	<script src="effects/seriously.nightvision.js"></script>
	<script>
	var video = document.getElementById('source');
	var canvas = document.getElementById('target');
	if (navigator.getUserMedia) {
	navigator.getUserMedia({audio: true, video: true}, gotStream, noStream);
	} else {
	navigator.webkitGetUserMedia({audio: true, video: true}, gotStream, noStream);
	}

	function gotStream(stream) {
	if (navigator.getUserMedia) {
	video.src = stream;
	} else {
	video.src = webkitURL.createObjectURL(stream);
	}

	var seriously, source, target;
	seriously = new Seriously();
	source = seriously.source('#source');
	target = seriously.target('#target');
	target.source = source;
	var nightvision = seriously.effect('nightvision');
	nightvision.source = source;
	target.source = nightvision;

	seriously.go();
	}

	function noStream() {
	document.getElementById('errorMessage').textContent =
	'No camera available.';
	}
	</script>
	</body>
	</html>