1 /** 2 * @fileOverview a scoreboard 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.scoreboard 14 * @namespace Scoreboard widget 15 */ 16 $.ui.scoreboard = function(){}; 17 18 $.widget('ui.scoreboard', 19 /** @lends $.ui.scoreboard.prototype */ 20 { 21 /** Gets the current score 22 * @returns {Number} current score 23 */ 24 getScore : function(){ 25 return this._getData('score'); 26 }, 27 /** Sets the current score 28 * @param {Number} newScore new score 29 */ 30 setScore : function(newScore){ 31 this._setData('score', parseInt(newScore)); 32 this._refresh(); 33 }, 34 /** Gets the current total 35 * @returns {Number} current total 36 */ 37 getTotal : function(){ 38 return this._getData('total'); 39 }, 40 /** Sets the current total 41 * @param {Number} newTotal new score 42 */ 43 setTotal : function(newTotal){ 44 this._setData('total', parseInt(newTotal)); 45 this._refresh(); 46 }, 47 /** 48 * Restarts the scoreboard and triggers the "scoreboardRestart" event 49 */ 50 restart : function(){ 51 this.element.trigger('scoreboardRestart'); 52 this._setData('score', this._getData('initialScore')); 53 this._setData('total', this._getData('initialTotal')); 54 this._refresh(); 55 }, 56 /** Increments the score by 1 or by the supplied numeric argument 57 * @param {Number} [val] increment value 58 */ 59 inc : function(val){ 60 var incVal = parseInt(val) || 1; 61 this._setData('score', this._getData('score') + incVal); 62 this._refresh(); 63 if(this._getData('winScore') === this._getData('score')){ 64 this.element.trigger('scoreboardWinGame'); 65 } 66 }, 67 /** Increments the total by 1 or by the supplied numeric argument 68 * @param {Number} [val] increment value 69 */ 70 incTotal : function(val){ 71 var incVal = parseInt(val) || 1; 72 this._setData('total', this._getData('total') + incVal); 73 this._refresh(); 74 }, 75 /** Decrements the score by 1 or by the supplied numeric argument 76 * @param {Number} [val] decrement value 77 */ 78 dec : function(val){ 79 var decVal = parseInt(val) || 1; 80 this._setData('score', this._getData('score') - decVal); 81 this._refresh(); 82 }, 83 /** Decrements the total by 1 or by the supplied numeric argument 84 * @param {Number} [val] decrement value 85 */ 86 decTotal : function(val){ 87 var decVal = parseInt(val) || 1; 88 this._setData('total', this._getData('total') - decVal); 89 this._refresh(); 90 }, 91 _ : function(val){ 92 var self = this; 93 var convertNumLocale = function(num){ 94 //48 is the base for western numerals 95 var convertDigit = function(digit){ 96 97 var numBase = 48; 98 var prefix = "u00"; 99 100 if (self._getData('locale') === "ne"){ 101 prefix = "u0"; 102 numBase = 2406; 103 } 104 105 return '\\' + prefix + 106 (numBase + parseInt(digit)).toString(16); 107 }; 108 109 var charArray = num.toString().split("").map(convertDigit); 110 return eval('"' + charArray.join('') + '"'); 111 }; 112 113 var convertStringLocale = function (str){ 114 if (self._getData('locale') === "ne"){ 115 switch(str){ 116 case "Score": 117 return "foo"; 118 case "Total": 119 return "bar"; 120 default: 121 return "string not translated"; 122 } 123 } 124 return "String really not translated"; 125 }; 126 127 128 129 if (typeof val === "number"){ 130 return convertNumLocale(val); 131 } 132 133 if (this._getData('locale') !== "en"){ 134 return convertStringLocale(val); 135 }else { 136 return val; 137 } 138 139 140 }, 141 _init : function(){ 142 143 var divDisplay = "inline"; 144 var score = this.options.score; 145 var total = this.options.total; 146 var layoutId = "h"; 147 var self = this; 148 149 var options = $.extend({}, $.ui.scoreboard.defaults, this.options); 150 151 this._setData('initialScore', parseInt(options.score)); 152 this._setData('initialTotal', parseInt(options.total)); 153 this._setData('score', parseInt(options.score)); 154 this._setData('total', parseInt(options.total)); 155 this._setData('winScore', parseInt(options.winningScore)); 156 this._setData('locale', options.locale); 157 158 if(this.options.layout === "vertical"){ 159 layoutId = "v"; 160 } 161 162 this.element.addClass('ui-scoreboard-container-' + layoutId + 163 ' ui-widget ui-widget-content ui-corner-all'); 164 165 var $parent = $('<div>') 166 .attr('id', 'uiScoreboard') 167 .addClass('ui-scoreboard-spacing-' + layoutId); 168 169 this._scoreText = $("<div><span>" + this._("Score") + "</span></div>") 170 .addClass('ui-scoreboard-spacing-'+ layoutId + 171 ' ui-corner-all ui-scoreboard-text') 172 .appendTo($parent); 173 174 this._score = $("<div><span>" + this._(score) + "</span></div>") 175 .addClass('ui-scoreboard-spacing-' + layoutId + 176 ' ui-scoreboard-text ui-scoreboard-number-' + layoutId) 177 .appendTo($parent) 178 .find('span:first'); 179 180 181 $("<div><span>Total</span></div>") 182 .addClass('ui-scoreboard-spacing-' + layoutId + 183 ' ui-corner-all ' + 184 'ui-scoreboard-text') 185 .appendTo($parent); 186 187 this._total = $("<div><span>" + this._(total) + "</span></div>") 188 .addClass('ui-scoreboard-spacing-' + layoutId + 189 ' ui-scoreboard-text ui-scoreboard-number-' + layoutId) 190 .appendTo($parent) 191 .find('span:first'); 192 193 194 var $templateBtn = $('<button></button>') 195 .addClass('ui-scoreboard-spacing-' + layoutId + 196 ' ui-scoreboard-button ' + 197 'ui-corner-all ui-state-default') 198 .append( 199 $('<span></span>') 200 .addClass('ui-icon ' 201 + 'ui-scoreboard-icon') 202 ) 203 .append( 204 $('<span>Restart</span>') 205 .addClass('centered') 206 ); 207 208 if(options.restartButton){ 209 var $restartBtn = $templateBtn.clone() 210 .find('span:first') 211 .addClass('ui-icon-arrowrefresh-1-w') 212 .end() 213 .find('span:last') 214 .text('Restart') 215 .end() 216 .click(function(){ self.restart();}) 217 .appendTo($parent); 218 } 219 220 221 if(options.pauseButton){ 222 223 var $pauseBtn = $templateBtn.clone() 224 .find('span:first') // 225 .removeClass('ui-icon-arrowrefresh-1-w') 226 .addClass('ui-icon-pause') 227 .end() 228 .find('span:last') 229 .text('Pause') 230 .end() 231 .click(function(){ 232 self.element.trigger('scoreboardPause'); 233 }) 234 .appendTo($parent); 235 } 236 237 if(options.startButton){ 238 var $startBtn = $templateBtn.clone() 239 .find('span:first') 240 //.removeClass('ui-icon-arrowrefresh-1-w') 241 .addClass('ui-icon-arrowreturnthick-1-s') 242 .end() 243 .find('span:last') 244 .text('Start') 245 .end() 246 .click(function(){ 247 self.element.trigger('scoreboardStart'); 248 }) 249 .appendTo($parent); 250 } 251 252 253 $parent.find('button').hover( 254 function(){ 255 $(this).addClass("ui-state-hover"); 256 }, 257 function(){ 258 $(this).removeClass("ui-state-hover"); 259 }); 260 261 this.element.append($parent); 262 263 }, 264 _refresh : function(){ 265 this._score.text(this._(this._getData('score'))); 266 this._total.text(this._(this._getData('total'))); 267 }, 268 /** Removes the scoreboard widget and all related data from the DOM */ 269 destroy : function(){ 270 this.element.remove(); 271 $.widget.prototype.destroy.apply(this, arguments); 272 } 273 274 275 }); 276 277 $.ui.scoreboard.getter = ['getScore', 'getTotal', '_convertNumLocale']; 278 279 /** Default settings for the scoreboard widget 280 * @namespace Default settings for the scoreboard widget 281 * @extends $.ui.scoreboard 282 */ 283 $.ui.scoreboard.defaults = { 284 /** Initial score 285 * @type Number 286 * @default 0 287 */ 288 score: 0, 289 /** Initial total 290 * @type Number 291 * @default 0 292 */ 293 total: 0, 294 /** Initial layout, valid options are "horizontal" and "vertical" 295 * @type String 296 * @default "horizontal" 297 */ 298 layout: "horizontal", 299 /** The score that will win the game 300 * @type Number 301 * @default 0 302 */ 303 winningScore: 0, 304 /** Default locale, valid options are "en" and "ne" 305 * @type String 306 * @default "en" 307 */ 308 locale: "en", 309 /** Display the Start Button 310 * @type boolean 311 * @default false 312 */ 313 startButton: false, 314 /** Display the Retart Button 315 * @type boolean 316 * @default true 317 */ 318 restartButton: true, 319 /** Display the Pause Button 320 * @type boolean 321 * @default false 322 */ 323 pauseButton: false 324 }; 325 326 })(jQuery);