28 // update the time display for the first time. |
28 // update the time display for the first time. |
29 this._Popcorn.listen("loadedmetadata", IriSP.wrap(this, this.timeDisplayUpdater)); |
29 this._Popcorn.listen("loadedmetadata", IriSP.wrap(this, this.timeDisplayUpdater)); |
30 |
30 |
31 this._Popcorn.listen("IriSP.search.matchFound", IriSP.wrap(this, this.searchMatch)); |
31 this._Popcorn.listen("IriSP.search.matchFound", IriSP.wrap(this, this.searchMatch)); |
32 this._Popcorn.listen("IriSP.search.noMatchFound", IriSP.wrap(this, this.searchNoMatch)); |
32 this._Popcorn.listen("IriSP.search.noMatchFound", IriSP.wrap(this, this.searchNoMatch)); |
|
33 this._Popcorn.listen("IriSP.search.triggeredSearch", IriSP.wrap(this, this.triggeredSearch)); |
33 |
34 |
34 |
35 |
35 this.selector.find(".Ldt-CtrlPlay").click(function() { self.playHandler.call(self); }); |
36 this.selector.find(".Ldt-CtrlPlay").click(function() { self.playHandler.call(self); }); |
36 this.selector.find(".Ldt-CtrlAnnotate").click(function() |
37 this.selector.find(".Ldt-CtrlAnnotate").click(function() |
37 { self._Popcorn.trigger("IriSP.PlayerWidget.AnnotateButton.clicked"); }); |
38 { self._Popcorn.trigger("IriSP.PlayerWidget.AnnotateButton.clicked"); }); |
144 } |
145 } |
145 |
146 |
146 return; |
147 return; |
147 }; |
148 }; |
148 |
149 |
149 |
150 IriSP.PlayerWidget.prototype.showSearchBlock = function() { |
|
151 var self = this; |
|
152 |
|
153 if (this._searchBlockOpen == false) { |
|
154 this.selector.find(".LdtSearch").show("blind", { direction: "horizontal"}, 100); |
|
155 this.selector.find(".LdtSearchInput").css('background-color','#fff'); |
|
156 |
|
157 this._searchBlockOpen = true; |
|
158 this.selector.find(".LdtSearchInput").bind('keyup', null, function() { self.searchHandler.call(self); } ); |
|
159 this.selector.find(".LdtSearchInput").focus(); |
|
160 |
|
161 // we need this variable because some widget can find a match in |
|
162 // their data while at the same time other's don't. As we want the |
|
163 // search field to become green when there's a match, we need a |
|
164 // variable to remember that we had one. |
|
165 this._positiveMatch = false; |
|
166 |
|
167 // tell the world the field is open |
|
168 this._Popcorn.trigger("IriSP.search.open"); |
|
169 } |
|
170 }; |
|
171 |
|
172 IriSP.PlayerWidget.prototype.hideSearchBlock = function() { |
|
173 if (this._searchBlockOpen == true) { |
|
174 this._searchLastValue = this.selector.find(".LdtSearchInput").attr('value'); |
|
175 this.selector.find(".LdtSearchInput").attr('value',''); |
|
176 this.selector.find(".LdtSearch").hide("blind", { direction: "horizontal"}, 75); |
|
177 |
|
178 // unbind the watcher event. |
|
179 this.selector.find(".LdtSearchInput").unbind('keypress set'); |
|
180 this._searchBlockOpen = false; |
|
181 |
|
182 this._positiveMatch = false; |
|
183 |
|
184 this._Popcorn.trigger("IriSP.search.closed"); |
|
185 } |
|
186 }; |
|
187 |
|
188 /** react to clicks on the search button */ |
150 IriSP.PlayerWidget.prototype.searchButtonHandler = function() { |
189 IriSP.PlayerWidget.prototype.searchButtonHandler = function() { |
151 var self = this; |
190 var self = this; |
152 |
191 |
153 /* show the search field if it is not shown */ |
192 /* show the search field if it is not shown */ |
154 if ( this._searchBlockOpen == false ) { |
193 if ( this._searchBlockOpen == false ) { |
155 this.selector.find(".LdtSearch").show("blind", { direction: "horizontal"}, 100); |
194 this.showSearchBlock(); |
156 |
195 this.selector.find(".LdtSearchInput").attr('value', this._searchLastValue); |
157 this.selector.find(".LdtSearchInput").css('background-color','#fff'); |
196 this._Popcorn.trigger("IriSP.search", this._searchLastValue); // trigger the search to make it more natural. |
158 this.selector.find(".LdtSearchInput").attr('value', this._searchLastValue); |
|
159 this._Popcorn.trigger("IriSP.search", this._searchLastValue); // trigger the search to make it more natural. |
|
160 |
|
161 this._searchBlockOpen = true; |
|
162 this.selector.find(".LdtSearchInput").bind('keyup', null, function() { self.searchHandler.call(self); } ); |
|
163 this.selector.find(".LdtSearchInput").focus(); |
|
164 |
|
165 // we need this variable because some widget can find a match in |
|
166 // their data while at the same time other's don't. As we want the |
|
167 // search field to become green when there's a match, we need a |
|
168 // variable to remember that we had one. |
|
169 this._positiveMatch = false; |
|
170 |
|
171 // tell the world the field is open |
|
172 this._Popcorn.trigger("IriSP.search.open"); |
|
173 |
|
174 } else { |
197 } else { |
175 this._searchLastValue = this.selector.find(".LdtSearchInput").attr('value'); |
198 this.hideSearchBlock(); |
176 this.selector.find(".LdtSearchInput").attr('value',''); |
|
177 this.selector.find(".LdtSearch").hide("blind", { direction: "horizontal"}, 75); |
|
178 |
|
179 // unbind the watcher event. |
|
180 this.selector.find(".LdtSearchInput").unbind('keypress set'); |
|
181 this._searchBlockOpen = false; |
|
182 |
|
183 this._positiveMatch = false; |
|
184 |
|
185 this._Popcorn.trigger("IriSP.search.closed"); |
|
186 } |
199 } |
187 }; |
200 }; |
188 |
201 |
189 /* this handler is called whenever the content of the search |
202 /** this handler is called whenever the content of the search |
190 field changes */ |
203 field changes */ |
191 IriSP.PlayerWidget.prototype.searchHandler = function() { |
204 IriSP.PlayerWidget.prototype.searchHandler = function() { |
192 this._searchLastValue = this.selector.find(".LdtSearchInput").attr('value'); |
205 this._searchLastValue = this.selector.find(".LdtSearchInput").attr('value'); |
193 this._positiveMatch = false; |
206 this._positiveMatch = false; |
194 |
207 |
199 } else { |
212 } else { |
200 this._Popcorn.trigger("IriSP.search", this._searchLastValue); |
213 this._Popcorn.trigger("IriSP.search", this._searchLastValue); |
201 } |
214 } |
202 }; |
215 }; |
203 |
216 |
204 /* |
217 /** |
205 handler for the IriSP.search.found message, which is sent by some views when they |
218 handler for the IriSP.search.found message, which is sent by some views when they |
206 highlight a match. |
219 highlight a match. |
207 */ |
220 */ |
208 IriSP.PlayerWidget.prototype.searchMatch = function() { |
221 IriSP.PlayerWidget.prototype.searchMatch = function() { |
209 this._positiveMatch = true; |
222 this._positiveMatch = true; |
210 this.selector.find(".LdtSearchInput").css('background-color','#e1ffe1'); |
223 this.selector.find(".LdtSearchInput").css('background-color','#e1ffe1'); |
211 } |
224 }; |
212 |
225 |
213 /* the same, except that no value could be found */ |
226 /** the same, except that no value could be found */ |
214 IriSP.PlayerWidget.prototype.searchNoMatch = function() { |
227 IriSP.PlayerWidget.prototype.searchNoMatch = function() { |
215 if (this._positiveMatch !== true) |
228 if (this._positiveMatch !== true) |
216 this.selector.find(".LdtSearchInput").css('background-color', "#d62e3a"); |
229 this.selector.find(".LdtSearchInput").css('background-color', "#d62e3a"); |
217 } |
230 }; |
218 |
231 |
|
232 /** react to an IriSP.Player.triggeredSearch - that is, when |
|
233 a widget ask the PlayerWidget to do a search on his behalf */ |
|
234 IriSP.PlayerWidget.prototype.triggeredSearch = function(searchString) { |
|
235 this.showSearchBlock(); |
|
236 this.selector.find(".LdtSearchInput").attr('value', searchString); |
|
237 this._Popcorn.trigger("IriSP.search", searchString); // trigger the search to make it more natural. |
|
238 }; |
|
239 |
|
240 |