summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--public/css/css.css3
-rw-r--r--public/js/lib/bg.js29
-rw-r--r--public/js/lib/video.js91
-rw-r--r--public/js/vendor/mx/mx.js (renamed from public/js/mx/mx.js)0
-rw-r--r--public/js/vendor/mx/mx.soundcloud.js (renamed from public/js/mx/mx.soundcloud.js)0
-rw-r--r--public/js/vendor/mx/mx.video.js (renamed from public/js/mx/mx.video.js)0
-rw-r--r--public/js/vendor/mx/mx.vimeo.js (renamed from public/js/mx/mx.vimeo.js)0
-rw-r--r--public/js/vendor/mx/mx.youtube.js (renamed from public/js/mx/mx.youtube.js)0
-rw-r--r--public/js/vendor/oktween.js124
-rw-r--r--public/js/vendor/parser.js (renamed from public/js/lib/parser.js)0
-rw-r--r--public/js/vendor/view/formview.js (renamed from public/js/view/formview.js)0
-rw-r--r--public/js/vendor/view/router.js (renamed from public/js/view/router.js)0
-rw-r--r--public/js/vendor/view/view.js (renamed from public/js/view/view.js)0
-rw-r--r--views/pages/index.ejs2
-rw-r--r--views/pages/room.ejs1
-rw-r--r--views/partials/scripts.ejs19
16 files changed, 264 insertions, 5 deletions
diff --git a/public/css/css.css b/public/css/css.css
index 49f44ba..3b8cf24 100644
--- a/public/css/css.css
+++ b/public/css/css.css
@@ -1 +1,4 @@
html,body{width:100%;height:100%;margin:0;padding:0;}
+#bg{position:fixed;top:0;left:0;z-index:-1;background-color:black;}
+html{background:black;}
+body{background:transparent;}
diff --git a/public/js/lib/bg.js b/public/js/lib/bg.js
new file mode 100644
index 0000000..5a188f3
--- /dev/null
+++ b/public/js/lib/bg.js
@@ -0,0 +1,29 @@
+var bg = (function(){
+
+ var bg = {}
+ bg.el = document.getElementById("bg")
+
+ bg.change = function(url){
+ var img = new Image ()
+ img.src = url
+ oktween.add({
+ obj: bg.el.style,
+ from: { opacity: 1 },
+ to: { opacity: 0 },
+ easing: "circ_in",
+ duration: 500,
+ finished: function(){
+ bg.el.style.backgroundImage = "url(" + url + ")"
+ }
+ }).then({
+ delay: 500,
+ obj: bg.el.style,
+ from: { opacity: 0 },
+ to: { opacity: 1 },
+ easing: "circ_in",
+ duration: 500,
+ })
+
+ }
+
+})() \ No newline at end of file
diff --git a/public/js/lib/video.js b/public/js/lib/video.js
new file mode 100644
index 0000000..45e6043
--- /dev/null
+++ b/public/js/lib/video.js
@@ -0,0 +1,91 @@
+var video = (function(){
+ var video = {}
+ var mx
+
+ video.init = function(opt){
+ video.build()
+ }
+
+ video.build = function(media){
+ switch (media.type) {
+ case 'video':
+ mxType = MX.Video
+ break
+ case 'vimeo':
+ mxType = MX.Vimeo
+ break
+ case 'youtube':
+ mxType = MX.Youtube
+ break
+ }
+ if (app.muted) {
+ media.mute = true
+ }
+ mx = new mxType({
+ media: media,
+ backface: false,
+ })
+ video.el.innerHTML = ""
+ video.el.appendChild(mx.el)
+
+ mx.load()
+ }
+
+ video.play = function(){
+ mx.play()
+ }
+
+ video.pause = function(){
+ mx.pause()
+ }
+
+ video.toggle = function(shouldPause){
+ if (typeof shouldPause !== "boolean") {
+ shouldPause = ! mx.paused
+ }
+ shouldPause ? mx.pause() : mx.play()
+ return shouldPause
+ }
+
+ video.toggleMuted = function(shouldMute){
+ if (typeof shouldMute !== "boolean") {
+ shouldMute = ! mx.muted
+ }
+ shouldMute ? mx.mute() : mx.unmute()
+ return shouldMute
+ }
+
+ video.paused = function(){
+ return mx.paused
+ }
+
+ video.muted = function(){
+ return mx.muted
+ }
+
+ video.seek = function(n){
+ mx.seek(n)
+ }
+
+ video.setLoop = function(shouldLoop){
+ mx.setLoop(shouldLoop)
+ }
+
+ video.mute = function(muted){
+ if (muted) {
+ mx.mute()
+ }
+ else {
+ mx.unmute()
+ }
+ }
+
+ video.unmute = function(){
+ mx.unmute()
+ }
+
+ video.setVolume = function(n){
+ mx.setVolume(n)
+ }
+
+})()
diff --git a/public/js/mx/mx.js b/public/js/vendor/mx/mx.js
index 60651eb..60651eb 100644
--- a/public/js/mx/mx.js
+++ b/public/js/vendor/mx/mx.js
diff --git a/public/js/mx/mx.soundcloud.js b/public/js/vendor/mx/mx.soundcloud.js
index fecb2f4..fecb2f4 100644
--- a/public/js/mx/mx.soundcloud.js
+++ b/public/js/vendor/mx/mx.soundcloud.js
diff --git a/public/js/mx/mx.video.js b/public/js/vendor/mx/mx.video.js
index 53ccf2e..53ccf2e 100644
--- a/public/js/mx/mx.video.js
+++ b/public/js/vendor/mx/mx.video.js
diff --git a/public/js/mx/mx.vimeo.js b/public/js/vendor/mx/mx.vimeo.js
index af138ae..af138ae 100644
--- a/public/js/mx/mx.vimeo.js
+++ b/public/js/vendor/mx/mx.vimeo.js
diff --git a/public/js/mx/mx.youtube.js b/public/js/vendor/mx/mx.youtube.js
index 8cd9f59..8cd9f59 100644
--- a/public/js/mx/mx.youtube.js
+++ b/public/js/vendor/mx/mx.youtube.js
diff --git a/public/js/vendor/oktween.js b/public/js/vendor/oktween.js
new file mode 100644
index 0000000..d0d2b7c
--- /dev/null
+++ b/public/js/vendor/oktween.js
@@ -0,0 +1,124 @@
+/*
+ oktween.add({
+ obj: el.style,
+ units: "px",
+ from: { left: 0 },
+ to: { left: 100 },
+ duration: 1000,
+ easing: oktween.easing.circ_out,
+ finish: function(){
+ console.log("done")
+ }
+ })
+*/
+
+var oktween = (function(){
+ var oktween = {}
+ var tweens = oktween.tweens = []
+ var last_t = 0
+ var id = 0
+ oktween.speed = 1
+ oktween.then = oktween.add = function(tween){
+ tween.id = id++
+ tween.obj = tween.obj || {}
+ if (tween.easing) {
+ if (typeof tween.easing == "string") {
+ tween.easing = oktween.easing[tween.easing]
+ }
+ }
+ else {
+ tween.easing = oktween.easing.linear
+ }
+ if (! ('from' in tween) ) {
+ tween.from = {}
+ tween.keys = Object.keys(tween.to)
+ tween.keys.forEach(function(prop){
+ tween.from[prop] = parseFloat(tween.obj[prop])
+ })
+ }
+ else {
+ tween.keys = Object.keys(tween.from)
+ }
+ tween.delay = tween.delay || 0
+ tween.start = last_t + tween.delay
+ tween.done = false
+ tween.then = function(fn){ tween.after = [fn] }
+ tween.finish = function(){ tween.start = 0 }
+ tween.cancel = function(){
+ var idx = tweens.indexOf(tween)
+ if (~idx) { tweens.splice(idx, 1) }
+ }
+ tween.tick = 0
+ tween.skip = tween.skip || 1
+ tweens.push(tween)
+ return tween
+ }
+ oktween.update = function(t) {
+ requestAnimationFrame(oktween.update)
+ last_t = t * oktween.speed
+ if (tweens.length == 0) return
+ var done = false
+ tweens.forEach(function(tween, i){
+ var dt = Math.min(1.0, (t - tween.start) / tween.duration)
+ tween.tick++
+ if (dt < 0 || (dt < 1 && (tween.tick % tween.skip != 0))) return
+ var ddt = tween.dt = tween.easing(dt)
+ tween.keys.forEach(function(prop){
+ val = lerp( ddt, tween.from[prop], tween.to[prop] )
+ if (tween.round) val = Math.round(val)
+ if (tween.units) val = (Math.round(val)) + tween.units
+ tween.obj[prop] = val
+ })
+ tween.update && tween.update(tween.obj, dt)
+ if (dt == 1) {
+ tween.finished && tween.finished(tween)
+ tween.after && tween.after.forEach(function(twn){
+ if (typeof twn == "function") { return twn() }
+ if (! twn.obj) { twn.obj = tween.obj }
+ oktween.add(twn)
+ })
+ if (tween.loop) {
+ tween.start = t + tween.delay
+ }
+ else {
+ done = tween.done = true
+ }
+ }
+ })
+ if (done) {
+ tweens = tweens.filter(function(tween){ return ! tween.done })
+ }
+ }
+ function lerp(n,a,b){ return (b-a)*n+a }
+
+ requestAnimationFrame(oktween.update)
+
+ oktween.easing = {
+ linear: function(t){
+ return t
+ },
+ circ_out: function(t) {
+ return Math.sqrt(1 - (t = t - 1) * t)
+ },
+ circ_in: function(t){
+ return -(Math.sqrt(1 - (t * t)) - 1)
+ },
+ circ_in_out: function(t) {
+ return ((t*=2) < 1) ? -0.5 * (Math.sqrt(1 - t * t) - 1) : 0.5 * (Math.sqrt(1 - (t -= 2) * t) + 1)
+ },
+ quad_in: function(n){
+ return Math.pow(n, 2)
+ },
+ quad_out: function(n){
+ return n * (n - 2) * -1
+ },
+ quad_in_out: function(n){
+ n = n * 2
+ if(n < 1){ return Math.pow(n, 2) / 2 }
+ return -1 * ((--n) * (n - 2) - 1) / 2
+ },
+
+ }
+
+ return oktween
+})()
diff --git a/public/js/lib/parser.js b/public/js/vendor/parser.js
index 20c5306..20c5306 100644
--- a/public/js/lib/parser.js
+++ b/public/js/vendor/parser.js
diff --git a/public/js/view/formview.js b/public/js/vendor/view/formview.js
index f5845e7..f5845e7 100644
--- a/public/js/view/formview.js
+++ b/public/js/vendor/view/formview.js
diff --git a/public/js/view/router.js b/public/js/vendor/view/router.js
index 28905b2..28905b2 100644
--- a/public/js/view/router.js
+++ b/public/js/vendor/view/router.js
diff --git a/public/js/view/view.js b/public/js/vendor/view/view.js
index 87d6ee4..87d6ee4 100644
--- a/public/js/view/view.js
+++ b/public/js/vendor/view/view.js
diff --git a/views/pages/index.ejs b/views/pages/index.ejs
index 97d16d2..9a1a900 100644
--- a/views/pages/index.ejs
+++ b/views/pages/index.ejs
@@ -8,6 +8,8 @@
</head>
<body>
+<div id="bg"></div>
+
<input type="text" id="create-room" placeholder="enter a url to make a room">
</body>
diff --git a/views/pages/room.ejs b/views/pages/room.ejs
index 36e4140..fb14a6f 100644
--- a/views/pages/room.ejs
+++ b/views/pages/room.ejs
@@ -7,6 +7,7 @@
</head>
<body>
+<div id="bg"></div>
<div id="video"></div>
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index 0e3bc02..e347249 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -1,10 +1,19 @@
<script src="js/vendor/zepto.min.js"></script>
-<script src="js/lib/view/view.js"></script>
-<script src="js/lib/view/formview.js"></script>
-<script src="js/lib/view/router.js"></script>
-<script src="js/lib/parser.js"></script>
+<script src="js/vendor/mx/mx.js"></script>
+<script src="js/vendor/mx/mx.soundcloud.js"></script>
+<script src="js/vendor/mx/mx.video.js"></script>
+<script src="js/vendor/mx/mx.vimeo.js"></script>
+<script src="js/vendor/mx/mx.youtube.js"></script>
+<script src="js/vendor/oktween.js"></script>
+<script src="js/vendor/parser.js"></script>
+<script src="js/vendor/view/view.js"></script>
+<script src="js/vendor/view/formview.js"></script>
+<script src="js/vendor/view/router.js"></script>
+<script src="js/lib/bg.js"></script>
+<script src="js/lib/chat.js"></script>
+<script src="js/lib/socket.js"></script>
<script src="js/lib/user.js"></script>
-<script src="js/site/index.js"></script>
+<script src="js/lib/video.js"></script>
<script src="js/index.js"></script>
<script type="text/javascript" src="http://www.youtube.com/player_api"></script>