diff -r 96a188138c20 -r 8abffd2de54a src/js/widgets/createAnnotationWidget.js --- a/src/js/widgets/createAnnotationWidget.js Thu Dec 29 17:14:10 2011 +0100 +++ b/src/js/widgets/createAnnotationWidget.js Fri Dec 30 11:55:54 2011 +0100 @@ -2,6 +2,7 @@ IriSP.Widget.call(this, Popcorn, config, Serializer); this._hidden = true; this.keywords = IriSP.widgetsDefaults["createAnnotationWidget"].keywords; + this.ids = {}; /* a dictionnary linking buttons ids to keywords */ }; @@ -35,12 +36,31 @@ this.selector.hide(); for (var i = 0; i < this.keywords.length; i++) { - var templ = IriSP.templToHTML("{{keyword}}", - {keyword: this.keywords[i]}); + var keyword = this.keywords[i]; + var id = IriSP.guid("button_"); + var templ = IriSP.templToHTML("", + {keyword: keyword, id: id}); + this.ids[keyword] = id; // save it for the function that handle textarea changes. + this.selector.find(".Ldt-createAnnotation-keywords").append(templ); + this.selector.find("#" + id).click(function(keyword) { return function() { + var contents = _this.selector.find(".Ldt-createAnnotation-Description").val(); + if (contents.indexOf(keyword) != -1) { + var newVal = contents.replace(keyword, ""); + } else { + var newVal = contents + keyword; + } + + _this.selector.find(".Ldt-createAnnotation-Description").val(newVal); + // also call our update function. + _this.handleTextChanges(); + } + }(keyword)); } + this.selector.find(".Ldt-createAnnotation-Description") + .bind("propertychange keyup input paste", IriSP.wrap(this, this.handleTextChanges)); this._Popcorn.listen("IriSP.PlayerWidget.AnnotateButton.clicked", IriSP.wrap(this, this.handleAnnotateSignal)); @@ -54,4 +74,27 @@ this.selector.show(); this._hidden = false; } +}; + +/** watch for changes in the textfield and change the buttons accordingly */ +IriSP.createAnnotationWidget.prototype.handleTextChanges = function(event) { + var contents = this.selector.find(".Ldt-createAnnotation-Description").val(); + + for(var keyword in this.ids) { + + var id = this.ids[keyword]; + + if (contents.indexOf(keyword) != -1) { + /* the word is present in the textarea but the button is not toggled */ + if (this.selector.find("#" + id).hasClass("Ldt-createAnnotation-absent-keyword")) + this.selector.find("#" + id).removeClass("Ldt-createAnnotation-absent-keyword") + .addClass("Ldt-createAnnotation-present-keyword"); + } else { + /* the word is absent from the textarea but the button is toggled */ + if (this.selector.find("#" + id).hasClass("Ldt-createAnnotation-present-keyword")) { + this.selector.find("#" + id).removeClass("Ldt-createAnnotation-present-keyword") + .addClass("Ldt-createAnnotation-absent-keyword"); + } + } + } }; \ No newline at end of file