|
1 IriSP.Widgets.Mediafragment = function(player, config) { |
|
2 IriSP.Widgets.Widget.call(this, player, config); |
|
3 this.last_hash_key = ""; |
|
4 this.last_hash_value = ""; |
|
5 window.onhashchange = this.functionWrapper("goToHash"); |
|
6 if (typeof window.addEventListener !== "undefined") { |
|
7 var _this = this; |
|
8 window.addEventListener('message', function(_msg) { |
|
9 if (/^#/.test(_msg.data)) { |
|
10 _this.setWindowHash(_msg.data); |
|
11 } |
|
12 }); |
|
13 }; |
|
14 this.onMdpEvent("Mediafragment.setHashToAnnotation","setHashToAnnotation"); |
|
15 this.blocked = false; |
|
16 }; |
|
17 |
|
18 IriSP.Widgets.Mediafragment.prototype = new IriSP.Widgets.Widget(); |
|
19 |
|
20 IriSP.Widgets.Mediafragment.prototype.draw = function() { |
|
21 this.onMediaEvent("setpause","setHashToTime"); |
|
22 var _this = this; |
|
23 this.getWidgetAnnotations().forEach(function(_annotation) { |
|
24 _annotation.on("click", function() { |
|
25 _this.setHashToAnnotation(_annotation.id); |
|
26 }); |
|
27 }); |
|
28 if (this.media.loadedMetadata) { |
|
29 this.goToHash(); |
|
30 } else { |
|
31 this.onMediaEvent("loadedmetadata","goToHash"); |
|
32 } |
|
33 }; |
|
34 |
|
35 IriSP.Widgets.Mediafragment.prototype.setWindowHash = function(_hash) { |
|
36 if (typeof window.history !== "undefined" && typeof window.history.replaceState !== "undefined") { |
|
37 window.history.replaceState({}, "", _hash); |
|
38 } else { |
|
39 document.location.hash = _hash; |
|
40 } |
|
41 }; |
|
42 |
|
43 IriSP.Widgets.Mediafragment.prototype.getLastHash = function() { |
|
44 var _tab = document.location.hash.replace(/^#/,'').split('&'); |
|
45 _tab = IriSP._(_tab).filter(function(_el) { |
|
46 return _el && !/^(id|t)=/.test(_el); |
|
47 }); |
|
48 if (this.last_hash_key) { |
|
49 _tab.push(this.last_hash_key + '=' + this.last_hash_value); |
|
50 } |
|
51 return '#' + _tab.join('&'); |
|
52 }; |
|
53 |
|
54 IriSP.Widgets.Mediafragment.prototype.goToHash = function() { |
|
55 if (document.location.hash !== this.getLastHash()) { |
|
56 var _tab = document.location.hash.replace(/^#/,'').split('&'); |
|
57 for (var _i = 0; _i < _tab.length; _i++) { |
|
58 var _subtab = _tab[_i].split("="); |
|
59 if (_subtab[0] == "id" || _subtab[0] == "t") { |
|
60 this.last_hash_key = _subtab[0]; |
|
61 this.last_hash_value = _subtab[1]; |
|
62 if (this.last_hash_key == "id") { |
|
63 var _annotation = this.source.getElement(this.last_hash_value); |
|
64 if (typeof _annotation !== "undefined") { |
|
65 this.media.setCurrentTime(_annotation.begin); |
|
66 } |
|
67 } |
|
68 if (this.last_hash_key == "t") { |
|
69 this.media.setCurrentTime(1000*this.last_hash_value); |
|
70 } |
|
71 break; |
|
72 } |
|
73 } |
|
74 } |
|
75 }; |
|
76 |
|
77 IriSP.Widgets.Mediafragment.prototype.setHashToAnnotation = function(_annotationId) { |
|
78 this.setHash( 'id', _annotationId ); |
|
79 }; |
|
80 |
|
81 IriSP.Widgets.Mediafragment.prototype.setHashToTime = function() { |
|
82 this.setHash( 't', this.media.getCurrentTime().getSeconds() ); |
|
83 }; |
|
84 |
|
85 IriSP.Widgets.Mediafragment.prototype.setHash = function(_key, _value) { |
|
86 if (!this.blocked && (this.last_hash_key !== _key || this.last_hash_value !== _value)) { |
|
87 this.last_hash_key = _key; |
|
88 this.last_hash_value = _value; |
|
89 var _hash = this.getLastHash(); |
|
90 this.setWindowHash(_hash); |
|
91 if (window.parent !== window) { |
|
92 window.parent.postMessage(_hash,"*"); |
|
93 } |
|
94 this.block(); |
|
95 } |
|
96 }; |
|
97 |
|
98 IriSP.Widgets.Mediafragment.prototype.unblock = function() { |
|
99 if (typeof this.blockTimeout !== "undefined") { |
|
100 window.clearTimeout(this.blockTimeout); |
|
101 } |
|
102 this.blockTimeout = undefined; |
|
103 this.blocked = false; |
|
104 }; |
|
105 |
|
106 IriSP.Widgets.Mediafragment.prototype.block = function() { |
|
107 if (typeof this.blockTimeout !== "undefined") { |
|
108 window.clearTimeout(this.blockTimeout); |
|
109 } |
|
110 this.blocked = true; |
|
111 this.blockTimeout = window.setTimeout(this.functionWrapper("unblock"), 1500); |
|
112 }; |