--- a/src/widgets/Polemic.js Sun Nov 12 22:07:33 2017 +0100
+++ b/src/widgets/Polemic.js Wed Sep 04 17:32:50 2024 +0200
@@ -1,249 +1,269 @@
-IriSP.Widgets.Polemic = function(player, config) {
- IriSP.Widgets.Widget.call(this, player, config);
-};
+import Mustache from "mustache";
+import _ from "lodash";
+import jQuery from "jquery";
+import polemicStyles from "./Polemic.module.css";
-IriSP.Widgets.Polemic.prototype = new IriSP.Widgets.Widget();
-
-IriSP.Widgets.Polemic.prototype.messages = {
- fr: {
+const Polemic = function (ns) {
+ return class extends ns.Widgets.Widget {
+ static messages = {
+ fr: {
from_: "de ",
_to_: " à ",
- _annotations: " annotation(s)"
- },
- en: {
+ _annotations: " annotation(s)",
+ },
+ en: {
from_: "from ",
_to_: " to ",
- _annotations: " annotation(s)"
- }
-};
+ _annotations: " annotation(s)",
+ },
+ };
-IriSP.Widgets.Polemic.prototype.defaults = {
- element_width : 5,
- element_height : 5,
- max_elements: 20,
- annotation_type : "tweet",
- defaultcolor : "#585858",
- foundcolor : "#fc00ff",
- default_version : "1",
- polemics : {
- "1" : [
- {
- "name" : "OK",
- "keywords" : [ "++" ],
- "color" : "#1D973D"
- },
- {
- "name" : "KO",
- "keywords" : [ "--" ],
- "color" : "#CE0A15"
- },
- {
- "name" : "REF",
- "keywords" : [ "==", "http://" ],
- "color" : "#C5A62D"
- },
- {
- "name" : "Q",
- "keywords" : [ "?" ],
- "color" : "#036AAE"
- }
+ static defaults = {
+ element_width: 5,
+ element_height: 5,
+ max_elements: 20,
+ annotation_type: "tweet",
+ defaultcolor: "#585858",
+ foundcolor: "#fc00ff",
+ default_version: "1",
+ polemics: {
+ 1: [
+ {
+ name: "OK",
+ keywords: ["++"],
+ color: "#1D973D",
+ },
+ {
+ name: "KO",
+ keywords: ["--"],
+ color: "#CE0A15",
+ },
+ {
+ name: "REF",
+ keywords: ["==", "http://"],
+ color: "#C5A62D",
+ },
+ {
+ name: "Q",
+ keywords: ["?"],
+ color: "#036AAE",
+ },
],
- "2" : [
- {
- "name" : "OK",
- "keywords" : [ "++" ],
- "color" : "#1D973D"
- },
- {
- "name" : "KO",
- "keywords" : [ "!!" ],
- "color" : "#CE0A15"
- },
- {
- "name" : "REF",
- "keywords" : [ "==", "http://" ],
- "color" : "#C5A62D"
- },
- {
- "name" : "Q",
- "keywords" : [ "?" ],
- "color" : "#036AAE"
- }
- ]
+ 2: [
+ {
+ name: "OK",
+ keywords: ["++"],
+ color: "#1D973D",
+ },
+ {
+ name: "KO",
+ keywords: ["!!"],
+ color: "#CE0A15",
+ },
+ {
+ name: "REF",
+ keywords: ["==", "http://"],
+ color: "#C5A62D",
+ },
+ {
+ name: "Q",
+ keywords: ["?"],
+ color: "#036AAE",
+ },
+ ],
+ },
+ };
+
+ constructor(player, config) {
+ super(player, config);
}
-};
-IriSP.Widgets.Polemic.prototype.getPolemics = function(version) {
- if(typeof(version) === "undefined" || !version) {
+ getPolemics(version) {
+ if (typeof version === "undefined" || !version) {
version = this.default_version;
- }
- if(this.polemics.constructor === Array) {
+ }
+ if (this.polemics.constructor === Array) {
return this.polemics;
- } else {
+ } else {
return this.polemics[version];
+ }
}
-};
-
-IriSP.Widgets.Polemic.prototype.drawNoStackgraph = function(_max, _slices) {
- var _this = this;
- this.is_stackgraph = false;
- if (_max) {
-
+ drawNoStackgraph(_max, _slices) {
+ var _this = this;
+ this.is_stackgraph = false;
+ if (_max) {
this.height = (2 + _max) * this.element_height;
this.$zone.css({
- width: this.width + "px",
- height: this.height + "px",
- position: "relative"
+ width: this.width + "px",
+ height: this.height + "px",
+ position: "relative",
});
var _x = 0;
function displayAnnotation(_elx, _ely, _pol, _col, _annotation) {
- var _htmlAnnot = Mustache.to_html(
- '<div class="Ldt-Polemic-TweetDiv Ldt-TraceMe" trace-info="annotation-id:{{id}}, media-id:{{media_id}}, polemic:{{polemic}}, time:{{time}}" polemic-color="{{color}}"'
- + ' tweet-title="{{title}}" annotation-id="{{id}}" style="width: {{width}}px; height: {{height}}px; top: {{top}}px; left: {{left}}px; background: {{color}}"></div>',
+ var _htmlAnnot = Mustache.render(
+ '<div class="Ldt-Polemic-TweetDiv Ldt-TraceMe" trace-info="annotation-id:{{id}}, media-id:{{media_id}}, polemic:{{polemic}}, time:{{time}}" polemic-color="{{color}}"' +
+ ' tweet-title="{{title}}" annotation-id="{{id}}" style="width: {{width}}px; height: {{height}}px; top: {{top}}px; left: {{left}}px; background: {{color}}"></div>',
{
- id: _annotation.id,
- media_id: _this.source.currentMedia.id,
- polemic: _pol,
- left: _elx,
- top: _ely,
- color: _col,
- width: (_this.element_width-1),
- height: _this.element_height,
- title: _annotation.title,
- time: _annotation.begin.toString()
- });
- var _el = IriSP.jQuery(_htmlAnnot);
- _el.mouseover(function() {
- _annotation.trigger("select");
- }).mouseout(function() {
- _annotation.trigger("unselect");
- }).click(function() {
- _annotation.trigger("click");
- return false;
+ id: _annotation.id,
+ media_id: _this.source.currentMedia.id,
+ polemic: _pol,
+ left: _elx,
+ top: _ely,
+ color: _col,
+ width: _this.element_width - 1,
+ height: _this.element_height,
+ title: _annotation.title,
+ time: _annotation.begin.toString(),
+ }
+ );
+ var _el = jQuery(_htmlAnnot);
+ _el
+ .on("mouseover", function () {
+ _annotation.trigger("select");
+ })
+ .on("mouseout", function () {
+ _annotation.trigger("unselect");
+ })
+ .on("click", function () {
+ _annotation.trigger("click");
+ return false;
});
- IriSP.attachDndData(_el, {
- title: _annotation.title,
- description: _annotation.description,
- image: _annotation.thumbnail,
- uri: (typeof _annotation.url !== "undefined"
- ? _annotation.url
- : (document.location.href.replace(/#.*$/,'') + '#id=' + _annotation.id)),
- text: '[' + _annotation.begin.toString() + '] ' + _annotation.title
- });
- // test if annotation has several colors.
- var colAr = [];
- var _polemicVersion = (_annotation.content && _annotation.content.polemic_version) || _this.default_version,
- _polemics = _this.getPolemics(_polemicVersion) || [],
- _pol,
- _polKey,
- _polDef,
- _rgxp;
-
- for(var _j = 0; _j < _polemics.length; _j++) {
- _pol = _polemics[_j];
- _rgxp = IriSP.Model.regexpFromTextOrArray(_pol.keywords);
- if(_rgxp.test(_annotation.description)) {
- colAr.push(_pol.color);
- }
- }
+ ns.attachDndData(_el, {
+ title: _annotation.title,
+ description: _annotation.description,
+ image: _annotation.thumbnail,
+ uri:
+ typeof _annotation.url !== "undefined"
+ ? _annotation.url
+ : document.location.href.replace(/#.*$/, "") +
+ "#id=" +
+ _annotation.id,
+ text: "[" + _annotation.begin.toString() + "] " + _annotation.title,
+ });
+ // test if annotation has several colors.
+ var colAr = [];
+ var _polemicVersion =
+ (_annotation.content && _annotation.content.polemic_version) ||
+ _this.default_version,
+ _polemics = _this.getPolemics(_polemicVersion) || [],
+ _pol,
+ _polKey,
+ _polDef,
+ _rgxp;
- // display annotation
- _annotation.on("select", function() {
- if (_this.tooltip) {
- _this.tooltip.show(
- + Math.floor(_elx + (_this.element_width - 1) / 2),
- + _ely,
- _annotation.title,
- ( (colAr.length>1) ? colAr : _col )
- );
- }
- _this.$tweets.each(function() {
- var _e = IriSP.jQuery(this);
- _e.css(
- "opacity",
- ( _e.attr("annotation-id") == _annotation.id ? 1 : .3 )
- );
- });
- });
- _annotation.on("unselect", function() {
- if (_this.tooltip) {
- _this.tooltip.hide();
- }
- _this.$tweets.css("opacity",1);
+ for (var _j = 0; _j < _polemics.length; _j++) {
+ _pol = _polemics[_j];
+ _rgxp = ns.Model.regexpFromTextOrArray(_pol.keywords);
+ if (_rgxp.test(_annotation.description)) {
+ colAr.push(_pol.color);
+ }
+ }
+
+ // display annotation
+ _annotation.on("select", function () {
+ if (_this.tooltip) {
+ _this.tooltip.show(
+ +Math.floor(_elx + (_this.element_width - 1) / 2),
+ +_ely,
+ _annotation.title,
+ colAr.length > 1 ? colAr : _col
+ );
+ }
+ _this.$tweets.each(function () {
+ var _e = jQuery(this);
+ _e.css(
+ "opacity",
+ _e.attr("annotation-id") == _annotation.id ? 1 : 0.3
+ );
});
- _annotation.on("found", function() {
- _el.css({
- "background" : _this.foundcolor,
- "opacity" : 1
- });
+ });
+ _annotation.on("unselect", function () {
+ if (_this.tooltip) {
+ _this.tooltip.hide();
+ }
+ _this.$tweets.css("opacity", 1);
+ });
+ _annotation.on("found", function () {
+ _el.css({
+ background: _this.foundcolor,
+ opacity: 1,
});
- _annotation.on("not-found", function() {
- _el.css({
- "background" : _col,
- "opacity" : .3
- });
+ });
+ _annotation.on("not-found", function () {
+ _el.css({
+ background: _col,
+ opacity: 0.3,
});
- _this.$zone.append(_el);
- };
+ });
+ _this.$zone.append(_el);
+ }
- IriSP._(_slices).forEach(function(_slice) {
- var _y = _this.height;
- _slice.annotations.forEach(function(_annotation) {
- _y -= _this.element_height;
- displayAnnotation(_x, _y, "none", _this.defaultcolor, _annotation);
+ _(_slices).forEach(function (_slice) {
+ var _y = _this.height;
+ _slice.annotations.forEach(function (_annotation) {
+ _y -= _this.element_height;
+ displayAnnotation(_x, _y, "none", _this.defaultcolor, _annotation);
+ });
+ _(_slice.polemicStacks).forEach(function (_annotations) {
+ var _color = _annotations.polemicDef.color,
+ _polemic = _annotations.polemicDef.name;
+ _annotations.annotations.forEach(function (_annotation) {
+ _y -= _this.element_height;
+ displayAnnotation(_x, _y, _polemic, _color, _annotation);
});
- IriSP._(_slice.polemicStacks).forEach(function(_annotations) {
- var _color = _annotations.polemicDef.color,
- _polemic = _annotations.polemicDef.name;
- _annotations.annotations.forEach(function(_annotation) {
- _y -= _this.element_height;
- displayAnnotation(_x, _y, _polemic, _color, _annotation);
- });
- });
- _x += _this.element_width;
+ });
+ _x += _this.element_width;
});
this.$tweets = this.$.find(".Ldt-Polemic-TweetDiv");
- this.source.getAnnotations().on("search-cleared", function() {
- _this.$tweets.each(function() {
- var _el = IriSP.jQuery(this);
- _el.css({
- "background" : _el.attr("polemic-color"),
- "opacity" : 1
- });
+ this.source.getAnnotations().on("search-cleared", function () {
+ _this.$tweets.each(function () {
+ var _el = jQuery(this);
+ _el.css({
+ background: _el.attr("polemic-color"),
+ opacity: 1,
});
+ });
});
+ } else {
+ this.$zone.hide();
+ }
+ }
- } else {
- this.$zone.hide();
- }
-}
+ drawStackgraph(_max, _slices) {
+ this.is_stackgraph = true;
-IriSP.Widgets.Polemic.prototype.drawStackgraph = function(_max, _slices) {
- this.is_stackgraph = true;
+ var _this = this;
- var _this = this;
-
- this.height = (2 + this.max_elements) * this.element_height;
- this.$zone.css({
+ this.height = (2 + this.max_elements) * this.element_height;
+ this.$zone.css({
width: this.width + "px",
height: this.height + "px",
- position: "relative"
- });
+ position: "relative",
+ });
+
+ var _x = 0,
+ _html = "",
+ _scale = (this.max_elements * this.element_height) / _max;
- var _x = 0,
- _html = '',
- _scale = this.max_elements * this.element_height / _max;
-
- function displayStackElement(_x, _y, _h, _color, _nums, _begin, _end, _polemic) {
- _html += Mustache.to_html(
- '<div class="Ldt-Polemic-TweetDiv Ldt-TraceMe" trace-info="annotation-block, media-id={{media_id}}, polemic={{polemic}}, time:{{begin}}" pos-x="{{posx}}" pos-y="{{top}}" annotation-counts="{{nums}}" begin-time="{{begin}}" end-time="{{end}}"'
- + ' style="width: {{width}}px; height: {{height}}px; top: {{top}}px; left: {{left}}px; background: {{color}}"></div>',
- {
+ function displayStackElement(
+ _x,
+ _y,
+ _h,
+ _color,
+ _nums,
+ _begin,
+ _end,
+ _polemic
+ ) {
+ _html += Mustache.render(
+ '<div class="Ldt-Polemic-TweetDiv Ldt-TraceMe" trace-info="annotation-block, media-id={{media_id}}, polemic={{polemic}}, time:{{begin}}" pos-x="{{posx}}" pos-y="{{top}}" annotation-counts="{{nums}}" begin-time="{{begin}}" end-time="{{end}}"' +
+ ' style="width: {{width}}px; height: {{height}}px; top: {{top}}px; left: {{left}}px; background: {{color}}"></div>',
+ {
nums: _nums,
posx: Math.floor(_x + (_this.element_width - 1) / 2),
media_id: _this.source.currentMedia.id,
@@ -251,164 +271,218 @@
left: _x,
top: _y,
color: _color,
- width: (_this.element_width-1),
+ width: _this.element_width - 1,
height: _h,
begin: _begin,
- end: _end
+ end: _end,
+ }
+ );
+ }
+
+ _(_slices).forEach(function (_slice) {
+ var _y = _this.height,
+ _nums =
+ _slice.annotations.length +
+ "|" +
+ _this.defaultcolor +
+ "," +
+ _(_slice.polemicStacks)
+ .map(function (_annotations) {
+ return (
+ _annotations.annotations.length +
+ "|" +
+ _annotations.polemicDef.color
+ );
+ })
+ .join(",");
+ if (_slice.annotations.length) {
+ var _h = Math.ceil(_scale * _slice.annotations.length);
+ _y -= _h;
+ displayStackElement(
+ _x,
+ _y,
+ _h,
+ _this.defaultcolor,
+ _nums,
+ _slice.begin,
+ _slice.end,
+ "none"
+ );
+ }
+ _(_slice.polemicStacks).forEach(function (_annotations) {
+ if (_annotations.annotations.length) {
+ var _color = _annotations.polemicDef.color,
+ _polemic = _annotations.polemicDef.name,
+ _h = Math.ceil(_scale * _annotations.annotations.length);
+ _y -= _h;
+ displayStackElement(
+ _x,
+ _y,
+ _h,
+ _color,
+ _nums,
+ _slice.begin,
+ _slice.end,
+ _polemic
+ );
+ }
+ });
+ _x += _this.element_width;
+ });
+
+ this.$zone.append(_html);
+
+ this.$tweets = this.$.find(".Ldt-Polemic-TweetDiv");
+
+ this.$tweets
+ .mouseover(function () {
+ var _el = jQuery(this),
+ _nums = _el.attr("annotation-counts").split(","),
+ _html =
+ "<p>" +
+ _this.l10n.from_ +
+ _el.attr("begin-time") +
+ _this.l10n._to_ +
+ _el.attr("end-time") +
+ "</p>";
+ _html = _.reduce(
+ _nums,
+ function (_htmlStr, _countStr) {
+ var _components = _countStr.split("|");
+ _htmlStr +=
+ '<div class="Ldt-Tooltip-AltColor" style="background: ' +
+ _components[1] +
+ '"></div><p>' +
+ _components[0] +
+ _this.l10n._annotations +
+ "</p>";
+ return _htmlStr;
+ },
+ _html
+ );
+ if (_this.tooltip) {
+ _this.tooltip.show(+_el.attr("pos-x"), +_el.attr("pos-y"), _html);
+ }
+ })
+ .mouseout(function () {
+ if (_this.tooltip) {
+ _this.tooltip.hide();
+ }
});
}
- IriSP._(_slices).forEach(function(_slice) {
- var _y = _this.height,
- _nums = _slice.annotations.length + "|" + _this.defaultcolor + "," + IriSP._(_slice.polemicStacks).map(function(_annotations) {
- return _annotations.annotations.length + "|" + _annotations.polemicDef.color;
- }).join(",");
- if (_slice.annotations.length) {
- var _h = Math.ceil(_scale * _slice.annotations.length);
- _y -= _h;
- displayStackElement(_x, _y, _h, _this.defaultcolor, _nums, _slice.begin, _slice.end, "none");
- }
- IriSP._(_slice.polemicStacks).forEach(function(_annotations) {
- if (_annotations.annotations.length) {
- var _color = _annotations.polemicDef.color,
- _polemic = _annotations.polemicDef.name,
- _h = Math.ceil(_scale * _annotations.annotations.length);
- _y -= _h;
- displayStackElement(_x, _y, _h, _color, _nums, _slice.begin, _slice.end, _polemic);
- }
- });
- _x += _this.element_width;
- });
-
- this.$zone.append(_html);
-
- this.$tweets = this.$.find(".Ldt-Polemic-TweetDiv");
+ draw() {
+ this.onMediaEvent("timeupdate", "onTimeupdate");
+ this.$zone = jQuery("<div>");
+ this.$zone.addClass("Ldt-Polemic");
+ this.$.append(this.$zone);
- this.$tweets
- .mouseover(function() {
- var _el = IriSP.jQuery(this),
- _nums = _el.attr("annotation-counts").split(","),
- _html = '<p>' + _this.l10n.from_ + _el.attr("begin-time") + _this.l10n._to_ + _el.attr("end-time") + '</p>';
- _html = IriSP._.reduce(_nums, function(_htmlStr, _countStr) {
- var _components = _countStr.split("|");
- _htmlStr += '<div class="Ldt-Tooltip-AltColor" style="background: ' + _components[1] + '"></div><p>' + _components[0] + _this.l10n._annotations + '</p>';
- return _htmlStr;
- }, _html);
- if (_this.tooltip) {
- _this.tooltip.show(+ _el.attr("pos-x"), + _el.attr("pos-y"), _html);
- }
- })
- .mouseout(function() {
- if (_this.tooltip) {
- _this.tooltip.hide();
- }
- });
-}
-
+ this.$elapsed = jQuery("<div>").css({
+ background: "#cccccc",
+ position: "absolute",
+ top: 0,
+ left: 0,
+ width: 0,
+ height: "100%",
+ });
-IriSP.Widgets.Polemic.prototype.draw = function() {
-
- this.onMediaEvent("timeupdate", "onTimeupdate");
- this.$zone = IriSP.jQuery('<div>');
- this.$zone.addClass("Ldt-Polemic");
- this.$.append(this.$zone);
+ this.$zone.append(this.$elapsed);
- this.$elapsed = IriSP.jQuery('<div>')
- .css({
- background: '#cccccc',
- position: "absolute",
- top: 0,
- left: 0,
- width: 0,
- height: "100%"
- });
-
- this.$zone.append(this.$elapsed);
-
- // we don't filter with null duration anymore
- var _slices = [],
- _slice_count = Math.floor( this.width / this.element_width ),
+ // we don't filter with null duration anymore
+ var _slices = [],
+ _slice_count = Math.floor(this.width / this.element_width),
_duration = this.source.getDuration(),
_max = 0,
_list = this.getWidgetAnnotations(),
_this = this;
- for (var _i = 0; _i < _slice_count; _i++) {
- var _begin = new IriSP.Model.Time( _i * _duration / _slice_count ),
- _end = new IriSP.Model.Time( ( _i + 1 ) * _duration / _slice_count ),
- _count = 0,
- _res = {
- begin : _begin.toString(),
- end : _end.toString(),
- annotations : _list.filter(function(_annotation) {
- return _annotation.begin >= _begin && _annotation.begin < _end;
- }),
- polemicStacks : {}
- };
+ for (var _i = 0; _i < _slice_count; _i++) {
+ var _begin = new ns.Model.Time((_i * _duration) / _slice_count),
+ _end = new ns.Model.Time(((_i + 1) * _duration) / _slice_count),
+ _count = 0,
+ _res = {
+ begin: _begin.toString(),
+ end: _end.toString(),
+ annotations: _list.filter(function (_annotation) {
+ return _annotation.begin >= _begin && _annotation.begin < _end;
+ }),
+ polemicStacks: {},
+ };
- _res.annotations = _res.annotations.filter(function(_annotation) {
- var _polemicVersion = (_annotation.content && _annotation.content.polemic_version) || _this.default_version,
- _polemics = _this.getPolemics(_polemicVersion) || [],
- _pol,
- _polKey,
- _polDef,
- _rgxp,
- _notMatched = true;
+ _res.annotations = _res.annotations.filter(function (_annotation) {
+ var _polemicVersion =
+ (_annotation.content && _annotation.content.polemic_version) ||
+ _this.default_version,
+ _polemics = _this.getPolemics(_polemicVersion) || [],
+ _pol,
+ _polKey,
+ _polDef,
+ _rgxp,
+ _notMatched = true;
+
+ for (var _j = 0; _j < _polemics.length; _j++) {
+ _pol = _polemics[_j];
+ _rgxp = ns.Model.regexpFromTextOrArray(_pol.keywords);
- for(var _j = 0; _j < _polemics.length; _j++) {
- _pol = _polemics[_j];
- _rgxp = IriSP.Model.regexpFromTextOrArray(_pol.keywords);
-
- if(_rgxp.test(_annotation.description)) {
- _polKey = _polemicVersion + "_" + _pol.name;
- _polDef = _res.polemicStacks[_polKey] || (_res.polemicStacks[_polKey] = { 'polemicDef' : _pol, 'annotations': []});
- _polDef.annotations.push(_annotation);
- _notMatched = false;
- _count++;
- }
+ if (_rgxp.test(_annotation.description)) {
+ _polKey = _polemicVersion + "_" + _pol.name;
+ _polDef =
+ _res.polemicStacks[_polKey] ||
+ (_res.polemicStacks[_polKey] = {
+ polemicDef: _pol,
+ annotations: [],
+ });
+ _polDef.annotations.push(_annotation);
+ _notMatched = false;
+ _count++;
}
- return _notMatched;
+ }
+ return _notMatched;
});
_count += _res.annotations.length;
_max = Math.max(_max, _count);
_slices.push(_res);
- }
+ }
+
+ if (_max < this.max_elements) {
+ this.drawNoStackgraph(_max, _slices);
+ } else {
+ this.drawStackgraph(_max, _slices);
+ }
+
+ this.$position = jQuery("<div>").addClass("Ldt-Polemic-Position");
+
+ this.$zone.append(this.$position);
- if (_max < this.max_elements) {
- this.drawNoStackgraph(_max, _slices);
- } else {
- this.drawStackgraph(_max, _slices);
+ this.$zone.on("click", function (_e) {
+ var _x = _e.pageX - _this.$zone.offset().left;
+ _this.media.setCurrentTime((_this.media.duration * _x) / _this.width);
+ });
+
+ this.$.append('<div class="Ldt-Polemic-Tooltip"></div>');
+
+ this.insertSubwidget(
+ this.$.find(".Ldt-Polemic-Tooltip"),
+ {
+ type: "Tooltip",
+ min_x: 0,
+ max_x: this.width,
+ },
+ "tooltip"
+ );
}
- this.$position = IriSP.jQuery('<div>').addClass("Ldt-Polemic-Position");
-
- this.$zone.append(this.$position);
-
- this.$zone.click(function(_e) {
- var _x = _e.pageX - _this.$zone.offset().left;
- _this.media.setCurrentTime(_this.media.duration * _x / _this.width);
- });
-
- this.$.append('<div class="Ldt-Polemic-Tooltip"></div>');
-
- this.insertSubwidget(
- this.$.find(".Ldt-Polemic-Tooltip"),
- {
- type: "Tooltip",
- min_x: 0,
- max_x: this.width
- },
- "tooltip"
- );
+ onTimeupdate(_time) {
+ var _x = Math.floor((this.width * _time) / this.media.duration);
+ this.$elapsed.css({
+ width: _x + "px",
+ });
+ this.$position.css({
+ left: _x + "px",
+ });
+ }
+ };
};
-IriSP.Widgets.Polemic.prototype.onTimeupdate = function(_time) {
- var _x = Math.floor( this.width * _time / this.media.duration);
- this.$elapsed.css({
- width: _x + "px"
- });
- this.$position.css({
- left: _x + "px"
- });
-};
+export { Polemic, polemicStyles };