From 7c6f3ddda3315b652652d551eb58e7ffdd7dcd51 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Dennis=20M=C3=A5rtensson?= Date: Thu, 21 Feb 2013 19:12:50 +0100 Subject: [PATCH] new demo added and link to the demo page is now correct --- README.md | 2 +- site/fullscrean.png | Bin 0 -> 5192 bytes site/index.html | 40 +++++ site/script.js | 203 +++++++++++++++++++++++ site/server.js | 66 ++++++++ site/style.css | 103 ++++++++++++ site/webrtc.io.js | 392 ++++++++++++++++++++++++++++++++++++++++++++ 7 files changed, 805 insertions(+), 1 deletion(-) create mode 100644 site/fullscrean.png create mode 100644 site/index.html create mode 100644 site/script.js create mode 100644 site/server.js create mode 100644 site/style.css create mode 100644 site/webrtc.io.js diff --git a/README.md b/README.md index cb4ffd4..5938120 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ #webrtc.io-demo ============== -You can have a look at the [demo](http://bit.ly/webrtcio) +You can have a look at the [demo](http://webrtc.dennis.is/) ##Instructions on how to setup the demo: diff --git a/site/fullscrean.png b/site/fullscrean.png new file mode 100644 index 0000000000000000000000000000000000000000..22890d1541f066c6372da4b77de6f1dd5a761153 GIT binary patch literal 5192 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 literal 0 HcmV?d00001 diff --git a/site/index.html b/site/index.html new file mode 100644 index 0000000..41f481b --- /dev/null +++ b/site/index.html @@ -0,0 +1,40 @@ + + + Example webrtc.io + + + + + +
+ Fork me on GitHub + +
+
+
+
+ +
+ +
+
Enter Full Screen
+
Create A New Room
+
+ + + + + diff --git a/site/script.js b/site/script.js new file mode 100644 index 0000000..b5a9420 --- /dev/null +++ b/site/script.js @@ -0,0 +1,203 @@ +var videos = []; +var rooms = [1, 2, 3, 4, 5]; +var PeerConnection = window.PeerConnection || window.webkitPeerConnection00 || window.webkitRTCPeerConnection; + +function getNumPerRow() { + var len = videos.length; + var biggest; + + // Ensure length is even for better division. + if(len % 2 === 1) { + len++; + } + + biggest = Math.ceil(Math.sqrt(len)); + while(len % biggest !== 0) { + biggest++; + } + return biggest; +} + +function subdivideVideos() { + var perRow = getNumPerRow(); + var numInRow = 0; + for(var i = 0, len = videos.length; i < len; i++) { + var video = videos[i]; + setWH(video, i); + numInRow = (numInRow + 1) % perRow; + } +} + +function setWH(video, i) { + var perRow = getNumPerRow(); + var perColumn = Math.ceil(videos.length / perRow); + var width = Math.floor((window.innerWidth) / perRow); + var height = Math.floor((window.innerHeight - 190) / perColumn); + video.width = width; + video.height = height; + video.style.position = "absolute"; + video.style.left = (i % perRow) * width + "px"; + video.style.top = Math.floor(i / perRow) * height + "px"; +} + +function cloneVideo(domId, socketId) { + var video = document.getElementById(domId); + var clone = video.cloneNode(false); + clone.id = "remote" + socketId; + document.getElementById('videos').appendChild(clone); + videos.push(clone); + return clone; +} + +function removeVideo(socketId) { + var video = document.getElementById('remote' + socketId); + if(video) { + videos.splice(videos.indexOf(video), 1); + video.parentNode.removeChild(video); + } +} + +function addToChat(msg, color) { + var messages = document.getElementById('messages'); + msg = sanitize(msg); + if(color) { + msg = '' + msg + ''; + } else { + msg = '' + msg + ''; + } + messages.innerHTML = messages.innerHTML + msg + '
'; + messages.scrollTop = 10000; +} + +function sanitize(msg) { + return msg.replace(/