summaryrefslogtreecommitdiff
path: root/public/assets/javascripts/mx/primitives/mx.video.js
blob: c5dd749492411d2b5fb69bf7bc3516344ef88038 (plain)
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
MX.Video = MX.Object3D.extend({

  init: function (ops) {
  
  	this.type = "Video"

		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.paused = true
		
		this.load()
  },

  load: function(ops){
  	this.paused = true

    this.player = document.createElement('video')
		this.player.addEventListener("loadedmetadata", this.ready.bind(this))
		this.player.addEventListener("error", this.error.bind(this))
		this.player.addEventListener("ended", this.finished.bind(this))
		this.player.width = this.width
		this.player.height = this.height
    this.player.src = this.media.url
    this.player.load()
    
    this.el.appendChild(this.player)
  },
  
  ready: function(){
		if (this.media.autoplay) {
			this.play()
		}
		else {
			this.player.currentTime = this.player.duration / 3
		}
  },
  
  error: function(err){
  	console.log("video error", err)
  },
  
  play: function(){
  	this.paused = false
  	this.player.play()
  },
  
  pause: function(){
  	this.paused = true
  	this.player.pause()
  },
  
	seek: function(n){
		if (n < 1) {
			n = n * this.duration()
		}
		this.player.currentTime = n
  },
  
  mute: function(){
  	this.player.muted = true
  },
  
  unmute: function(){
  	this.player.muted = false
  },
  
  duration: function(){
  	return this.player.duration
  },
  
  finished: function(){
  	console.log("video finished")
  	if (this.media.loop) {
  		this.seek(0)
  		this.play()
  	}
  	else if (this.bound) {
  		$(".playButton").removeClass('playing')
  	}
  },
  

})