|
1033
|
1 |
IriSP.Widgets.Highlighter = function(player, config) { |
|
|
2 |
var _this = this; |
|
|
3 |
IriSP.Widgets.Widget.call(this, player, config); |
|
|
4 |
this.throttledRefresh = IriSP._.throttle(function() { |
|
|
5 |
console.log("highlighter Refresh"); |
|
|
6 |
_this.update(); |
|
|
7 |
}, 800); |
|
|
8 |
}; |
|
|
9 |
|
|
|
10 |
/** |
|
|
11 |
* Highlighter widget |
|
|
12 |
* This widgets highlights the current annotations by setting the |
|
|
13 |
* .activeAnnotation class on appropriate .Ldt-Highlighter-Annotation |
|
|
14 |
* elements. These elements *must* have data-begin and data-end properties specifying their bounds (in ms) (and data-media specifying the media-id) |
|
|
15 |
*/ |
|
|
16 |
IriSP.Widgets.Highlighter.prototype = new IriSP.Widgets.Widget(); |
|
|
17 |
|
|
|
18 |
IriSP.Widgets.Highlighter.prototype.defaults = { |
|
|
19 |
} |
|
|
20 |
|
|
|
21 |
IriSP.Widgets.Highlighter.prototype.update = function() { |
|
|
22 |
var _this = this; |
|
|
23 |
var _currentTime = _this.media.getCurrentTime(); |
|
|
24 |
_this.$.find(".Ldt-Highlighter-Annotation", document).toggleClass("currentAnnotation", function () { |
|
|
25 |
return (this.dataset.media === _this.media.id && this.dataset.begin <= _currentTime && _currentTime < this.dataset.end); |
|
|
26 |
}); |
|
|
27 |
console.log(_this.$.find(".currentAnnotation")); |
|
|
28 |
return false; |
|
|
29 |
}; |
|
|
30 |
|
|
|
31 |
IriSP.Widgets.Highlighter.prototype.draw = function() { |
|
|
32 |
var _this = this; |
|
|
33 |
|
|
|
34 |
var _events = [ |
|
|
35 |
"timeupdate", |
|
|
36 |
"seeked", |
|
|
37 |
"loadedmetadata" |
|
|
38 |
]; |
|
|
39 |
for (var _i = 0; _i < _events.length; _i++) { |
|
|
40 |
_this.onMediaEvent(_events[_i], _this.throttledRefresh); |
|
|
41 |
} |
|
|
42 |
_this.throttledRefresh(); |
|
|
43 |
}; |