summaryrefslogtreecommitdiff
path: root/public
diff options
context:
space:
mode:
Diffstat (limited to 'public')
-rw-r--r--public/assets/javascripts/app.js2
-rw-r--r--public/assets/javascripts/mx/mx.js10
-rw-r--r--public/assets/javascripts/mx/primitives/mx.face.js41
-rw-r--r--public/assets/javascripts/mx/primitives/mx.image.js50
-rw-r--r--public/assets/javascripts/mx/primitives/mx.text.js2
-rw-r--r--public/assets/javascripts/mx/primitives/mx.video.js15
-rw-r--r--public/assets/javascripts/mx/primitives/mx.vimeo.js21
-rw-r--r--public/assets/javascripts/mx/primitives/mx.youtube.js96
8 files changed, 87 insertions, 150 deletions
diff --git a/public/assets/javascripts/app.js b/public/assets/javascripts/app.js
index 3d0d3c4..0b441c7 100644
--- a/public/assets/javascripts/app.js
+++ b/public/assets/javascripts/app.js
@@ -17,7 +17,7 @@ else {
var scene, cam, map;
-var viewHeight = window.viewHeight || 150
+var viewHeight = window.viewHeight || 186
var app = new function(){}
diff --git a/public/assets/javascripts/mx/mx.js b/public/assets/javascripts/mx/mx.js
index 496aec0..6b36392 100644
--- a/public/assets/javascripts/mx/mx.js
+++ b/public/assets/javascripts/mx/mx.js
@@ -452,6 +452,16 @@ var MX = MX || (function (undefined) {
return this
},
+ move: function(ops){
+ var layer = this
+ layer.ops = defaults(ops, layer.ops)
+ for (var i in ops) {
+ layer[i] = ops[i]
+ }
+ layer.dirty = true
+ layer.update()
+ },
+
onTransitionEnd: function (callback) {
this.cancelTransitionEnd()
var el = this.el
diff --git a/public/assets/javascripts/mx/primitives/mx.face.js b/public/assets/javascripts/mx/primitives/mx.face.js
deleted file mode 100644
index ac47ab4..0000000
--- a/public/assets/javascripts/mx/primitives/mx.face.js
+++ /dev/null
@@ -1,41 +0,0 @@
-MX.Face = MX.Object3D.extend({
-
- // this will be called within the contructor
- init: function (size, color, borderColor) {
-
- size = size || 100
- color = color || 'rgba(0, 255, 122, .1)'
- borderColor = borderColor || '#0f3'
-
- // an Object3D's associated DOM node is the "el" property
- this.el.classList.add('face')
-
- var angle = MX.rotationUnit === 'deg' ? 90 : (Math.PI / 2)
-
- var top = this.top = new MX.Object3D('.face')
- top.rotationX = angle
- top.y = size / 2
-
- // adding children, must also be instances of Object3D
- this.add(top)
-
- this.children.forEach(function (face) {
- face.width = size - 2
- face.height = size - 2
- face.el.style.backgroundColor = color
- face.el.style.border = '1px solid ' + borderColor
- })
-
- // this applies the updated CSS style
- // required for any change to take effect
- // when a parent object's update() is called
- // all its children will be updated as well
- this.update()
-
- // if this object's children won't move by themselves
- this.updateChildren = false
- }
-
- // other properties will be mixed into the prototype of the new constructor
-
-})
diff --git a/public/assets/javascripts/mx/primitives/mx.image.js b/public/assets/javascripts/mx/primitives/mx.image.js
index 6ddc5d8..278fa1e 100644
--- a/public/assets/javascripts/mx/primitives/mx.image.js
+++ b/public/assets/javascripts/mx/primitives/mx.image.js
@@ -2,32 +2,25 @@ MX.Image = MX.Object3D.extend({
init: function (ops) {
this.type = "Image"
-
- var layer = this
- layer.width = 0
- layer.height = 0
- layer.x = ops.x || 0
- layer.y = ops.y || 0
- layer.z = ops.z || 0
- layer.scale = ops.scale || 1
- layer.backface = ops.backface || false
- layer.media = ops.media
+ this.media = ops.media
+ this.width = 0
+ this.height = 0
+ this.x = ops.x || 0
+ this.y = ops.y || 0
+ this.z = ops.z || 0
+ this.scale = ops.scale || 1
+ this.backface = ops.backface || false
- if (layer.backface) {
- layer.el.classList.add("backface-visible")
- }
+ ops.className && this.el.classList.add(ops.className)
+ this.backface && this.el.classList.add("backface-visible")
+ this.el.classList.add("image")
- if (ops.src) {
- this.loadTexture(ops)
- }
+ this.el.style.backgroundRepeat = 'no-repeat'
- if (ops.className) {
- layer.el.classList.add(ops.className)
- }
- layer.el.style.backgroundRepeat = 'no-repeat'
+ this.load(ops)
},
- loadTexture: function(ops){
+ load: function(ops){
var layer = this
layer.ops = defaults(ops, layer.ops)
@@ -49,20 +42,5 @@ MX.Image = MX.Object3D.extend({
}
image.src = ops.src;
},
-
- move: function(ops){
- var layer = this
- layer.ops = defaults(ops, layer.ops)
- for (var i in ops) {
- layer[i] = ops[i]
- }
- layer.dirty = true
- layer.update()
- },
-
- toString: function(){
- var params = "id src width height depth x y z rotationX rotationY rotationZ scale".split(" ")
- return this.__toString(params)
- },
})
diff --git a/public/assets/javascripts/mx/primitives/mx.text.js b/public/assets/javascripts/mx/primitives/mx.text.js
index 0c278a9..9c7af5c 100644
--- a/public/assets/javascripts/mx/primitives/mx.text.js
+++ b/public/assets/javascripts/mx/primitives/mx.text.js
@@ -1,4 +1,5 @@
MX.Text = MX.Object3D.extend({
+
init: function (ops) {
this.type = "Text"
@@ -31,4 +32,5 @@ MX.Text = MX.Object3D.extend({
this.updateChildren = true
this.update()
}
+
})
diff --git a/public/assets/javascripts/mx/primitives/mx.video.js b/public/assets/javascripts/mx/primitives/mx.video.js
index b2727c0..1b17994 100644
--- a/public/assets/javascripts/mx/primitives/mx.video.js
+++ b/public/assets/javascripts/mx/primitives/mx.video.js
@@ -1,4 +1,5 @@
MX.Video = MX.Object3D.extend({
+
init: function (ops) {
this.type = "Video"
@@ -22,7 +23,7 @@ MX.Video = MX.Object3D.extend({
}
if (ops.src) {
- this.loadVideo(ops)
+ this.load(ops)
}
if (ops.className) {
@@ -31,7 +32,7 @@ MX.Video = MX.Object3D.extend({
layer.el.style.backgroundRepeat = 'no-repeat'
},
- loadVideo: function(ops){
+ load: function(ops){
var layer = this
var video = document.createElement('video')
@@ -50,15 +51,5 @@ MX.Video = MX.Object3D.extend({
this.el.appendChild(video)
},
-
- move: function(ops){
- var layer = this
- layer.ops = defaults(ops, layer.ops)
- for (var i in ops) {
- layer[i] = ops[i]
- }
- layer.dirty = true
- layer.update()
- }
})
diff --git a/public/assets/javascripts/mx/primitives/mx.vimeo.js b/public/assets/javascripts/mx/primitives/mx.vimeo.js
index b8efa17..344a450 100644
--- a/public/assets/javascripts/mx/primitives/mx.vimeo.js
+++ b/public/assets/javascripts/mx/primitives/mx.vimeo.js
@@ -34,25 +34,6 @@ MX.Vimeo = MX.Object3D.extend({
loadEmbed: function(ops){
var layer = this
- },
-
- move: function(ops){
- var layer = this
- layer.ops = defaults(ops, layer.ops)
- for (var i in ops) {
- layer[i] = ops[i]
- }
- layer.dirty = true
- layer.update()
- },
-
- toString: function(){
- var params = "id src width height depth x y z rotationX rotationY rotationZ scale".split(" ")
- return this.__toString(params)
- },
+ }
})
-
-window.onYouTubePlayerAPIReady = function(){
- console.log("youtube ready")
-}
diff --git a/public/assets/javascripts/mx/primitives/mx.youtube.js b/public/assets/javascripts/mx/primitives/mx.youtube.js
index 3756d80..b21184d 100644
--- a/public/assets/javascripts/mx/primitives/mx.youtube.js
+++ b/public/assets/javascripts/mx/primitives/mx.youtube.js
@@ -4,53 +4,69 @@ MX.Youtube = MX.Object3D.extend({
this.type = "Youtube"
- var layer = this
- layer.media = ops.media
- layer.width = ops.media.width
- layer.height = ops.media.height
- layer.x = ops.x || 0
- layer.y = ops.y || 0
- layer.z = ops.z || 0
- layer.rotationX = ops.rotationX || 0
- layer.rotationY = ops.rotationY || 0
- layer.rotationZ = ops.rotationZ || 0
- layer.scale = ops.scale || 1
- layer.backface = ops.backface || false
+ this.media = ops.media
+ this.width = ops.media.width
+ this.height = ops.media.height
+ this.x = ops.x || 0
+ this.y = ops.y || 0
+ this.z = ops.z || 0
+ this.rotationX = ops.rotationX || 0
+ this.rotationY = ops.rotationY || 0
+ this.rotationZ = ops.rotationZ || 0
+ this.scale = ops.scale || 1
+ this.backface = ops.backface || false
- if (layer.backface) {
- layer.el.classList.add("backface-visible")
- }
-
- if (ops.src) {
- this.loadEmbed(ops)
- }
+ ops.className && this.el.classList.add(ops.className)
+ this.backface && this.el.classList.add("backface-visible")
+ this.el.classList.add("video")
- if (ops.className) {
- layer.el.classList.add(ops.className)
- }
- layer.el.style.backgroundRepeat = 'no-repeat'
-
+ this.load()
},
- loadEmbed: function(ops){
- var layer = this
+ load: function (ops) {
+ var uid = 'player-' + Uid()
+ var preload = document.createElement("div")
+ preload.id = uid
+ preload.style.backgroundImage = "url(" + this.media.thumbnail + ")"
+ preload.style.width = this.media.width + "px"
+ preload.style.height = this.media.height + "px"
+ preload.style.pointerEvents = "none"
+ preload.className = "preload"
+ this.el.appendChild(preload)
+
+ this.player = new YT.Player(uid, {
+ videoId: this.media.token,
+ width: this.width,
+ height: this.height,
+ events: {
+ onReady: $.proxy(this.ready, this),
+ onError: $.proxy(this.error, this),
+ }
+ })
},
- move: function(ops){
- var layer = this
- layer.ops = defaults(ops, layer.ops)
- for (var i in ops) {
- layer[i] = ops[i]
- }
- layer.dirty = true
- layer.update()
+ ready: function(){
+ console.log("youtube ready")
},
-
- toString: function(){
- var params = "id src width height depth x y z rotationX rotationY rotationZ scale".split(" ")
- return this.__toString(params)
- },
-
+
+ error: function(err){
+ console.log("youtube error", err)
+ },
+
+ play: function(){
+ this.player.playVideo()
+ },
+
+ pause: function(){
+ this.player.pauseVideo()
+ },
+
+ seek: function(n){
+ },
+
+ duration: function(){
+ }
+
})
window.onYouTubePlayerAPIReady = function(){
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-10 23:39:30 +0000