1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
|
MX.Youtube = MX.Object3D.extend({
init: function (ops) {
this.type = "Youtube"
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
ops.className && this.el.classList.add(ops.className)
this.backface && this.el.classList.add("backface-visible")
this.el.classList.add("video")
this.load()
},
load: function (ops) {
var base = this
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.defer(uid)
},
defer: function (uid){
if (! YT || ! YT.loaded) {
setTimeout(function(){
console.log("hwat")
this.defer(uid)
}.bind(this), 300)
}
else {
this.build(uid)
}
},
build: function(uid){
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),
onStateChange: $.proxy(this.statechange, this),
},
playerVars: {
autohide: 1,
autoplay: 0,
disablekb: 1,
controls: 0,
enablejsapi: 1,
fs: 0,
modestbranding: 1,
iv_load_policy: 3, // no annotations
loop: 0,
showinfo: 0,
rel: 0,
wmode: 'opaque',
},
})
},
ready: function(){
console.log("youtube ready")
},
error: function(err){
console.log("youtube error", err)
},
statechange: function(e){
switch (e.data) {
case -1: // unstarted
break
case 0: // finished
this.finished()
break
case 1: // play
break
case 2: // pause
break
case 3: // buffering
break
case 5: // cued
break
}
},
play: function(){
this.player.playVideo()
},
pause: function(){
this.player.pauseVideo()
},
seek: function(n, allowSeekAhead){
allowSeekAhead = typeof allowSeekAhead == "boolean" ? allowSeekAhead : true
this.player.seekTo(n, true) // set to false if seeking manually
},
duration: function(){
return this.player.getDuration()
},
finished: function(){
console.log("youtube finished")
}
})
window.onYouTubePlayerAPIReady = function(){
console.log("youtube ready")
}
|
