1 /**
  2 * @fileOverview a footer widget 
  3 * @author Bryan Berry <bryan@olenepal.org> 
  4 *  uses MIT License
  5 */
  6 
  7 
  8 
  9 (function($){
 10 
 11      // This is a dummy function, just here as placeholder to
 12      // to make the jsdoc tool happy
 13      /** @name $.ui.kFooter
 14       * @namespace kFooter widget 
 15       * @example Emits the event kFooterWinGame when the maxScore is reached <br />
 16       * Emits the event kFooterRestart when game restarted <br />
 17       * Start button emits kFooterStart event when clicked <br />
 18       * Restart button emits kFooterRestart event when clicked <br />
 19       * Pause button emits the kFooterPause event when clicked <br />
 20       */
 21      $.ui.kFooter = function(){};
 22 
 23      $.widget('ui.kFooter',
 24 	      /** @lends $.ui.kFooter.prototype */
 25 	      {
 26 		  /** Gets the current score
 27 		   * @returns {Number} current score
 28 		   */
 29 		  getScore : function(){
 30 		      return this._getData('score');
 31 		  },
 32 		   /** Sets the current score
 33 		   * @param {Number} newScore new score
 34 		   */
 35 		  setScore : function(newScore){
 36 		      this._setData('score', parseInt(newScore));
 37 		      this._refresh();
 38 		  },
 39 		  /** Gets the current total
 40 		   * @returns {Number} current total
 41 		   */
 42 		  getTotal : function(){
 43 		      return this._getData('total');
 44 		  },
 45 		  /** Sets the current total
 46 		   * @param {Number} newTotal new total
 47 		   */
 48 		  setTotal : function(newTotal){
 49 		      this._setData('total', parseInt(newTotal));
 50 		      this._refresh();  
 51 		  },
 52 		  /**
 53 		   * Resets the score and total to initial values and triggers 
 54 		   * the "kFooterRestart" event
 55 		   */
 56 		  restart : function(){
 57 		      this.element.trigger('kFooterRestart');
 58 		      this._setData('score', this._getData('initialScore'));
 59 		      this._setData('total', this._getData('initialTotal'));
 60 		      this._refresh();
 61 		  },
 62 		  /** Increments the score by 1 or by the supplied numeric argument
 63 		   * @param {Number} [val] increment value
 64 		   */
 65 		  inc : function(val){
 66 		      var incVal = parseInt(val) || 1;
 67 		      this._setData('score',  this._getData('score') + incVal);
 68 		      this._refresh();
 69 		      if(this._getData('winScore') === this._getData('score')){
 70 			  this.element.trigger('kFooterWinGame');
 71 		      }
 72 		  },
 73 		   /** Increments the total by 1 or by the supplied numeric argument
 74 		   * @param {Number} [val] increment value
 75 		   */
 76 		  incTotal : function(val){
 77 		      var incVal = parseInt(val) || 1;
 78 		      this._setData('total',  this._getData('total') + incVal);
 79 		      this._refresh();
 80 		  },
 81 		   /** Decrements the score by 1 or by the supplied numeric argument
 82 		   * @param {Number} [val] decrement value
 83 		   */
 84 		  dec : function(val){
 85 		      var decVal = parseInt(val) || 1;
 86 		      this._setData('score',  this._getData('score') - decVal);
 87 		      this._refresh();
 88 		  },
 89 		   /** Decrements the total by 1 or by the supplied numeric argument
 90 		   * @param {Number} [val] decrement value
 91 		   */
 92 		  decTotal : function(val){
 93 		      var decVal = parseInt(val) || 1;
 94 		      this._setData('total',  this._getData('total') - decVal);
 95 		      this._refresh();
 96 		  },
 97 		  /** Start the timer, defaults to 0:00 if no arguments supplied
 98 		   * @param {Number} [minutes] value for minutes, default to 0
 99 		   * @param {Number} [seconds]  value for seconds, default to 0 
100 		   */ 
101 		  startTimer : function(minutes, seconds){
102 		      var timerRunning = this._getData('timerRunning')|| false;
103 
104 		      if (this._$timer && timerRunning === false){
105 			  var mins = minutes || 0;
106 			  var secs = seconds || 0;
107 			  var timerId = null;
108 			  var self = this;
109 		      
110 		      
111 			  this._setData('mins', mins);
112 			  this._setData('secs', secs);
113 
114 			  var addLeadingZero = function(num){
115 			      if(''.concat(num).length === 1){
116 				  return "0".concat(num);
117 			      } else {
118 				  return num;
119 			      }
120 			    
121 			  };
122 
123 			  var increaseTimer = function(){
124 			      if (self._getData('timerRunning') === false){
125 				  return;
126 			      }
127 
128 			      var s = self._getData('secs') + 1;
129 			      var m = null;
130 			      var timerId = null;
131 					  
132 			      if (s < 60) {
133 				  self._setData('secs', s);
134 				  self._$timerSecs.text(self._n(addLeadingZero(s)));
135 			      } else {
136 				  s = 0;
137 				  m = self._getData('mins') + 1;
138 				  self._$timerSecs.text(self._n(addLeadingZero(s)));
139 				  self._$timerMins.text(self._n(addLeadingZero(m)));
140 				  self._setData('secs', s);
141 				  self._setData('mins', m);
142 			      }
143 				      
144 			      timerId = setTimeout(increaseTimer, 1000);
145 			      self._setData('timerId', timerId);
146 
147 			  };
148 			  
149 			  timerId = setTimeout(increaseTimer , 1000);
150 
151 			  this._setData('timerRunning', true);
152 			  this._setData('timerId', timerId);
153 		      }
154 		  },
155 		  /** Stop the timer
156 		   */
157 		  stopTimer : function(){
158 		      this._setData('timerRunning', false);
159 		  },
160 		  _ : function(val, loc){
161 		      return $.i18n.call($.ui.kFooter, val, loc);
162 		  },
163 		  _n : function(val, loc){
164 		      return $._n(val, loc);
165 		  },
166 		  _init : function(){
167 
168 		      var divDisplay = "inline";
169 		      var score = this.options.score;
170 		      var total = this.options.total;
171 		      var self = this;
172 		      
173 		      var options = $.extend({}, $.ui.kFooter.defaults, this.options);
174 
175 		      this._setData('initialScore', parseInt(options.score));
176 		      this._setData('initialTotal', parseInt(options.total));
177 		      this._setData('score', parseInt(options.score));
178 		      this._setData('total', parseInt(options.total)); 
179 		      this._setData('winScore', parseInt(options.winningScore)); 
180 		      this._setData('locale', options.locale);
181 
182 		     
183 		      this.element.addClass('ui-widget ui-widget-content ' +
184 			      ' ui-kFooter');
185 		      
186 		      
187 		      var $kFooter = $("<ul></ul>");
188 		     
189 		      
190 		      if(options.scoreboard === true){
191 			  
192 			  var $scoreboard = $("<li class='left'>" + this._("Score") + 
193 			      "</li>" + "<li class='left'>" +
194 			      "<span id='kFooterScore' class='ui-corner-all number'>" + 
195 			      this._n(score) + "</span></li>" +
196 			      "<li class='left'>" + this._("Total") + "</li>" +
197 			      "<li class='left'><span id='kFooterTotal' " +
198 			      "class='ui-corner-all number'>" + 
199 			  this._n(total) + "</span></li>")
200 			      .appendTo($kFooter);
201 			 
202 			  this._score = $('#kFooterScore', $scoreboard);
203 			  this._total = $('#kFooterTotal', $scoreboard);
204 
205 		      }
206 
207 		      if(options.timer === true){
208 			  this._$timer = $("<li class='left'>" + this._("Timer") + 
209 			      "</li>" +
210 			      "<li class='left'><span id='kFooterMins'" + 
211 			      "class='ui-corner-all" +
212 			      " number timer'>" + this._n("00") + 
213 			      "</span></li>" +
214 			      "<li class='left'><span id='kFooterSecs'" + 
215 			      "class='ui-corner-all " +
216 			      "number timer'>"+ this._n("00") + 
217 			      "</span></li>")
218 			      .appendTo($kFooter);
219 
220 			  this._$timerMins = $('#kFooterMins', this._$timer);
221 			  this._$timerSecs = $('#kFooterSecs', this._$timer);		     
222 		      }
223 
224 		      //if options.checkAnswerBtn === true
225 			 
226 		      if (options.restartButton === true){
227 			  var $restartButton = $("<li class='right'><button " +
228 			      "class='ui-corner-all ui-state-default'>" +
229  			      "<span class='ui-icon ui-icon-arrowrefresh-1-w'>" +
230 			      "</span>" + 
231 			      "<span class='text left'>" + this._('Play Again') + 
232 			      "</span></button></li>")
233 			      .click(function(){ 
234 					 self.startTimer();
235 					 self.restart();
236 				     })
237 			      .appendTo($kFooter);
238 		      }
239 		      
240 		       if (options.pauseButton === true){
241 			  var $pauseButton = $("<li class='right'><button " +
242 			      "class='ui-corner-all ui-state-default'>" +
243  			      "<span class='ui-icon ui-icon-pause'>" +
244 			      "</span>" + 
245 			      "<span class='text left'>" + this._('Pause') + 
246 			      "</span></button></li>")
247 			      .click(function(){ 
248 					 self.stopTimer();
249 					 self.element.trigger('kFooterPause'); 
250 				     })
251 			      .appendTo($kFooter);
252 		      }
253 
254 		      if (options.startButton === true){
255 			  var $startButton = $("<li class='right'><button " +
256 			      "class='ui-corner-all ui-state-default'>" +
257  			      "<span class='ui-icon ui-icon-play'>" +
258 			      "</span>" + 
259 			      "<span class='text left'>" + this._('Start') + 
260 			      "</span></button></li>")
261 			      .click(function(){ 
262 				      self.startTimer();
263 				      self.element.trigger('kFooterStart'); 
264 				     })
265 			      .appendTo($kFooter);
266 		      }
267 		  
268 		      $('button', $kFooter).hover(
269 			      function(){ 
270 				  $(this).addClass("ui-state-hover"); 
271 			      },
272 			      function(){ 
273 				  $(this).removeClass("ui-state-hover"); 
274 			      });
275 		      
276 		      
277 		      // Check if any html w/in this.element, if so wrap it in <li> </li>
278 		      // and add to $kFooter later
279 		      var $userHtml = this.element
280 			  .children()
281 			  .appendTo($kFooter);
282 			  
283 
284 		      $userHtml.wrap('<li class="left"></li>');
285 
286 		      //get rid of userHtml
287 		      this.element.empty();
288 		      
289 		      this.element.append($kFooter);
290 		      
291 		  },
292 		  _refresh : function(){
293 		      this._score.text(this._n(this._getData('score')));
294 		      this._total.text(this._n(this._getData('total')));
295 		  },
296 		  /** Removes the kFooter widget and all related data from the DOM */
297 		  destroy : function(){
298 		      this.element.remove();
299 		      $.widget.prototype.destroy.apply(this, arguments);
300 		  }
301 
302 		  
303 	      });
304 
305 	      $.ui.kFooter.getter = ['getScore', 'getTotal', '_n', '_' ];
306 
307 	      $.ui.kFooter.i18n = {};
308 
309 		
310 		/** Default settings for the kFooter widget
311 		 * @namespace Default settings for the kFooter widget
312 		 * @extends $.ui.kFooter
313 		 */			   
314 	      $.ui.kFooter.defaults = {
315                   /** Initial score
316 		   * @type Number 
317 		   * @default 0
318 		   */
319 		  score: 0, 
320 		  /** Initial total
321 		   * @type Number
322 		   * @default 0
323 		   */
324 		  total: 0, 
325 		  /** The score that will win the game
326 		   * @type Number
327 		   * @default 0
328 		   */
329 		  winningScore: 0,
330 		  /** Default locale, valid options are "en" and "ne" 
331 		   * @type String
332 		   * @default "en"
333 		   */
334 		  locale: "ne",
335 		  /** Display the scoreboard
336 		   * @type boolean
337 		   * @default true
338 		   */
339 		  scoreboard: true,
340 		  /** Display the Start Button
341 		   * @type boolean
342 		   * @default false
343 		   */
344 		  startButton: false,
345 		  /** Display the Retart Button
346 		   * @type boolean
347 		   * @default true
348 		   */
349 		  restartButton: true,
350 		  /** Display the Pause Button
351 		   * @type boolean
352 		   * @default false
353 		   */
354 		  pauseButton: false,
355 		  /** Display the timer
356 		   * @type boolean
357 		   * @default false
358 		   */
359 		  timer: false
360 	      };
361 
362  })(jQuery);