|
543
|
1 |
IriSP.createAnnotationWidget = function(Popcorn, config, Serializer) { |
|
|
2 |
IriSP.Widget.call(this, Popcorn, config, Serializer); |
|
|
3 |
this._hidden = true; |
|
547
|
4 |
this.keywords = IriSP.widgetsDefaults["createAnnotationWidget"].keywords; |
|
549
|
5 |
this.ids = {}; /* a dictionnary linking buttons ids to keywords */ |
|
543
|
6 |
}; |
|
|
7 |
|
|
|
8 |
|
|
|
9 |
IriSP.createAnnotationWidget.prototype = new IriSP.Widget(); |
|
|
10 |
|
|
|
11 |
IriSP.createAnnotationWidget.prototype.clear = function() { |
|
|
12 |
this.selector.find(".Ldt-SaTitle").text(""); |
|
|
13 |
this.selector.find(".Ldt-SaDescription").text(""); |
|
|
14 |
this.selector.find(".Ldt-SaKeywordText").text(""); |
|
|
15 |
}; |
|
|
16 |
|
|
|
17 |
IriSP.createAnnotationWidget.prototype.showWidget = function() { |
|
|
18 |
this.layoutManager.slice.after("ArrowWidget") |
|
|
19 |
.before("createAnnotationWidget") |
|
|
20 |
.jQuerySelector().hide(); |
|
|
21 |
this.selector.show(); |
|
|
22 |
}; |
|
|
23 |
|
|
|
24 |
IriSP.createAnnotationWidget.prototype.hideWidget = function() { |
|
|
25 |
this.selector.hide(); |
|
|
26 |
this.layoutManager.slice.after("ArrowWidget") |
|
|
27 |
.before("createAnnotationWidget") |
|
|
28 |
.jQuerySelector().show(); |
|
|
29 |
}; |
|
|
30 |
|
|
|
31 |
IriSP.createAnnotationWidget.prototype.draw = function() { |
|
|
32 |
var _this = this; |
|
|
33 |
|
|
548
|
34 |
var annotationMarkup = IriSP.templToHTML(IriSP.createAnnotationWidget_template); |
|
543
|
35 |
this.selector.append(annotationMarkup); |
|
548
|
36 |
|
|
543
|
37 |
this.selector.hide(); |
|
548
|
38 |
for (var i = 0; i < this.keywords.length; i++) { |
|
549
|
39 |
var keyword = this.keywords[i]; |
|
|
40 |
var id = IriSP.guid("button_"); |
|
|
41 |
var templ = IriSP.templToHTML("<button id={{id}} class='Ldt-createAnnotation-absent-keyword'>{{keyword}}</button>", |
|
|
42 |
{keyword: keyword, id: id}); |
|
548
|
43 |
|
|
549
|
44 |
this.ids[keyword] = id; // save it for the function that handle textarea changes. |
|
|
45 |
|
|
548
|
46 |
this.selector.find(".Ldt-createAnnotation-keywords").append(templ); |
|
549
|
47 |
this.selector.find("#" + id).click(function(keyword) { return function() { |
|
|
48 |
var contents = _this.selector.find(".Ldt-createAnnotation-Description").val(); |
|
|
49 |
if (contents.indexOf(keyword) != -1) { |
|
|
50 |
var newVal = contents.replace(keyword, ""); |
|
|
51 |
} else { |
|
|
52 |
var newVal = contents + keyword; |
|
|
53 |
} |
|
|
54 |
|
|
|
55 |
_this.selector.find(".Ldt-createAnnotation-Description").val(newVal); |
|
|
56 |
// also call our update function. |
|
|
57 |
_this.handleTextChanges(); |
|
|
58 |
} |
|
|
59 |
}(keyword)); |
|
548
|
60 |
} |
|
|
61 |
|
|
549
|
62 |
this.selector.find(".Ldt-createAnnotation-Description") |
|
|
63 |
.bind("propertychange keyup input paste", IriSP.wrap(this, this.handleTextChanges)); |
|
543
|
64 |
|
|
|
65 |
this._Popcorn.listen("IriSP.PlayerWidget.AnnotateButton.clicked", |
|
547
|
66 |
IriSP.wrap(this, this.handleAnnotateSignal)); |
|
543
|
67 |
}; |
|
|
68 |
|
|
|
69 |
IriSP.createAnnotationWidget.prototype.handleAnnotateSignal = function() { |
|
|
70 |
if (this._hidden == false) { |
|
|
71 |
this.selector.hide(); |
|
|
72 |
this._hidden = true; |
|
|
73 |
} else { |
|
|
74 |
this.selector.show(); |
|
|
75 |
this._hidden = false; |
|
|
76 |
} |
|
549
|
77 |
}; |
|
|
78 |
|
|
|
79 |
/** watch for changes in the textfield and change the buttons accordingly */ |
|
|
80 |
IriSP.createAnnotationWidget.prototype.handleTextChanges = function(event) { |
|
|
81 |
var contents = this.selector.find(".Ldt-createAnnotation-Description").val(); |
|
|
82 |
|
|
|
83 |
for(var keyword in this.ids) { |
|
|
84 |
|
|
|
85 |
var id = this.ids[keyword]; |
|
|
86 |
|
|
|
87 |
if (contents.indexOf(keyword) != -1) { |
|
|
88 |
/* the word is present in the textarea but the button is not toggled */ |
|
|
89 |
if (this.selector.find("#" + id).hasClass("Ldt-createAnnotation-absent-keyword")) |
|
|
90 |
this.selector.find("#" + id).removeClass("Ldt-createAnnotation-absent-keyword") |
|
|
91 |
.addClass("Ldt-createAnnotation-present-keyword"); |
|
|
92 |
} else { |
|
|
93 |
/* the word is absent from the textarea but the button is toggled */ |
|
|
94 |
if (this.selector.find("#" + id).hasClass("Ldt-createAnnotation-present-keyword")) { |
|
|
95 |
this.selector.find("#" + id).removeClass("Ldt-createAnnotation-present-keyword") |
|
|
96 |
.addClass("Ldt-createAnnotation-absent-keyword"); |
|
|
97 |
} |
|
|
98 |
} |
|
|
99 |
} |
|
543
|
100 |
}; |