github.com/fanux/shipyard@v0.0.0-20161009071005-6515ce223235/controller/static/semantic/src/definitions/modules/rating.js (about) 1 /*! 2 * # Semantic UI - Rating 3 * http://github.com/semantic-org/semantic-ui/ 4 * 5 * 6 * Copyright 2014 Contributors 7 * Released under the MIT license 8 * http://opensource.org/licenses/MIT 9 * 10 */ 11 12 ;(function ($, window, document, undefined) { 13 14 "use strict"; 15 16 $.fn.rating = function(parameters) { 17 var 18 $allModules = $(this), 19 moduleSelector = $allModules.selector || '', 20 21 time = new Date().getTime(), 22 performance = [], 23 24 query = arguments[0], 25 methodInvoked = (typeof query == 'string'), 26 queryArguments = [].slice.call(arguments, 1), 27 returnedValue 28 ; 29 $allModules 30 .each(function() { 31 var 32 settings = ( $.isPlainObject(parameters) ) 33 ? $.extend(true, {}, $.fn.rating.settings, parameters) 34 : $.extend({}, $.fn.rating.settings), 35 36 namespace = settings.namespace, 37 className = settings.className, 38 metadata = settings.metadata, 39 selector = settings.selector, 40 error = settings.error, 41 42 eventNamespace = '.' + namespace, 43 moduleNamespace = 'module-' + namespace, 44 45 element = this, 46 instance = $(this).data(moduleNamespace), 47 48 $module = $(this), 49 $icon = $module.find(selector.icon), 50 51 module 52 ; 53 54 module = { 55 56 initialize: function() { 57 module.verbose('Initializing rating module', settings); 58 59 if($icon.length === 0) { 60 module.setup.layout(); 61 } 62 63 if(settings.interactive) { 64 module.enable(); 65 } 66 else { 67 module.disable(); 68 } 69 if(settings.initialRating) { 70 module.debug('Setting initial rating'); 71 module.setRating(settings.initialRating); 72 } 73 if( $module.data(metadata.rating) ) { 74 module.debug('Rating found in metadata'); 75 module.setRating( $module.data(metadata.rating) ); 76 } 77 module.instantiate(); 78 }, 79 80 instantiate: function() { 81 module.verbose('Instantiating module', settings); 82 instance = module; 83 $module 84 .data(moduleNamespace, module) 85 ; 86 }, 87 88 destroy: function() { 89 module.verbose('Destroying previous instance', instance); 90 $module 91 .removeData(moduleNamespace) 92 ; 93 $icon 94 .off(eventNamespace) 95 ; 96 }, 97 98 refresh: function() { 99 $icon = $module.find(selector.icon); 100 }, 101 102 setup: { 103 layout: function() { 104 var 105 maxRating = $module.data(metadata.maxRating) || settings.maxRating 106 ; 107 module.debug('Generating icon html dynamically'); 108 $module 109 .html($.fn.rating.settings.templates.icon(maxRating)) 110 ; 111 module.refresh(); 112 } 113 }, 114 115 event: { 116 mouseenter: function() { 117 var 118 $activeIcon = $(this) 119 ; 120 $activeIcon 121 .nextAll() 122 .removeClass(className.selected) 123 ; 124 $module 125 .addClass(className.selected) 126 ; 127 $activeIcon 128 .addClass(className.selected) 129 .prevAll() 130 .addClass(className.selected) 131 ; 132 }, 133 mouseleave: function() { 134 $module 135 .removeClass(className.selected) 136 ; 137 $icon 138 .removeClass(className.selected) 139 ; 140 }, 141 click: function() { 142 var 143 $activeIcon = $(this), 144 currentRating = module.getRating(), 145 rating = $icon.index($activeIcon) + 1, 146 canClear = (settings.clearable == 'auto') 147 ? ($icon.length === 1) 148 : settings.clearable 149 ; 150 if(canClear && currentRating == rating) { 151 module.clearRating(); 152 } 153 else { 154 module.setRating( rating ); 155 } 156 } 157 }, 158 159 clearRating: function() { 160 module.debug('Clearing current rating'); 161 module.setRating(0); 162 }, 163 164 getRating: function() { 165 var 166 currentRating = $icon.filter('.' + className.active).length 167 ; 168 module.verbose('Current rating retrieved', currentRating); 169 return currentRating; 170 }, 171 172 enable: function() { 173 module.debug('Setting rating to interactive mode'); 174 $icon 175 .on('mouseenter' + eventNamespace, module.event.mouseenter) 176 .on('mouseleave' + eventNamespace, module.event.mouseleave) 177 .on('click' + eventNamespace, module.event.click) 178 ; 179 $module 180 .removeClass(className.disabled) 181 ; 182 }, 183 184 disable: function() { 185 module.debug('Setting rating to read-only mode'); 186 $icon 187 .off(eventNamespace) 188 ; 189 $module 190 .addClass(className.disabled) 191 ; 192 }, 193 194 setRating: function(rating) { 195 var 196 ratingIndex = (rating - 1 >= 0) 197 ? (rating - 1) 198 : 0, 199 $activeIcon = $icon.eq(ratingIndex) 200 ; 201 $module 202 .removeClass(className.selected) 203 ; 204 $icon 205 .removeClass(className.selected) 206 .removeClass(className.active) 207 ; 208 if(rating > 0) { 209 module.verbose('Setting current rating to', rating); 210 $activeIcon 211 .prevAll() 212 .andSelf() 213 .addClass(className.active) 214 ; 215 } 216 settings.onRate.call(element, rating); 217 }, 218 219 setting: function(name, value) { 220 module.debug('Changing setting', name, value); 221 if( $.isPlainObject(name) ) { 222 $.extend(true, settings, name); 223 } 224 else if(value !== undefined) { 225 settings[name] = value; 226 } 227 else { 228 return settings[name]; 229 } 230 }, 231 internal: function(name, value) { 232 if( $.isPlainObject(name) ) { 233 $.extend(true, module, name); 234 } 235 else if(value !== undefined) { 236 module[name] = value; 237 } 238 else { 239 return module[name]; 240 } 241 }, 242 debug: function() { 243 if(settings.debug) { 244 if(settings.performance) { 245 module.performance.log(arguments); 246 } 247 else { 248 module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':'); 249 module.debug.apply(console, arguments); 250 } 251 } 252 }, 253 verbose: function() { 254 if(settings.verbose && settings.debug) { 255 if(settings.performance) { 256 module.performance.log(arguments); 257 } 258 else { 259 module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':'); 260 module.verbose.apply(console, arguments); 261 } 262 } 263 }, 264 error: function() { 265 module.error = Function.prototype.bind.call(console.error, console, settings.name + ':'); 266 module.error.apply(console, arguments); 267 }, 268 performance: { 269 log: function(message) { 270 var 271 currentTime, 272 executionTime, 273 previousTime 274 ; 275 if(settings.performance) { 276 currentTime = new Date().getTime(); 277 previousTime = time || currentTime; 278 executionTime = currentTime - previousTime; 279 time = currentTime; 280 performance.push({ 281 'Name' : message[0], 282 'Arguments' : [].slice.call(message, 1) || '', 283 'Element' : element, 284 'Execution Time' : executionTime 285 }); 286 } 287 clearTimeout(module.performance.timer); 288 module.performance.timer = setTimeout(module.performance.display, 100); 289 }, 290 display: function() { 291 var 292 title = settings.name + ':', 293 totalTime = 0 294 ; 295 time = false; 296 clearTimeout(module.performance.timer); 297 $.each(performance, function(index, data) { 298 totalTime += data['Execution Time']; 299 }); 300 title += ' ' + totalTime + 'ms'; 301 if(moduleSelector) { 302 title += ' \'' + moduleSelector + '\''; 303 } 304 if($allModules.length > 1) { 305 title += ' ' + '(' + $allModules.length + ')'; 306 } 307 if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { 308 console.groupCollapsed(title); 309 if(console.table) { 310 console.table(performance); 311 } 312 else { 313 $.each(performance, function(index, data) { 314 console.log(data['Name'] + ': ' + data['Execution Time']+'ms'); 315 }); 316 } 317 console.groupEnd(); 318 } 319 performance = []; 320 } 321 }, 322 invoke: function(query, passedArguments, context) { 323 var 324 object = instance, 325 maxDepth, 326 found, 327 response 328 ; 329 passedArguments = passedArguments || queryArguments; 330 context = element || context; 331 if(typeof query == 'string' && object !== undefined) { 332 query = query.split(/[\. ]/); 333 maxDepth = query.length - 1; 334 $.each(query, function(depth, value) { 335 var camelCaseValue = (depth != maxDepth) 336 ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1) 337 : query 338 ; 339 if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) { 340 object = object[camelCaseValue]; 341 } 342 else if( object[camelCaseValue] !== undefined ) { 343 found = object[camelCaseValue]; 344 return false; 345 } 346 else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) { 347 object = object[value]; 348 } 349 else if( object[value] !== undefined ) { 350 found = object[value]; 351 return false; 352 } 353 else { 354 return false; 355 } 356 }); 357 } 358 if ( $.isFunction( found ) ) { 359 response = found.apply(context, passedArguments); 360 } 361 else if(found !== undefined) { 362 response = found; 363 } 364 if($.isArray(returnedValue)) { 365 returnedValue.push(response); 366 } 367 else if(returnedValue !== undefined) { 368 returnedValue = [returnedValue, response]; 369 } 370 else if(response !== undefined) { 371 returnedValue = response; 372 } 373 return found; 374 } 375 }; 376 if(methodInvoked) { 377 if(instance === undefined) { 378 module.initialize(); 379 } 380 module.invoke(query); 381 } 382 else { 383 if(instance !== undefined) { 384 instance.invoke('destroy'); 385 } 386 module.initialize(); 387 } 388 }) 389 ; 390 391 return (returnedValue !== undefined) 392 ? returnedValue 393 : this 394 ; 395 }; 396 397 $.fn.rating.settings = { 398 399 name : 'Rating', 400 namespace : 'rating', 401 402 debug : false, 403 verbose : true, 404 performance : true, 405 406 initialRating : 0, 407 interactive : true, 408 maxRating : 4, 409 clearable : 'auto', 410 411 onRate : function(rating){}, 412 413 error : { 414 method : 'The method you called is not defined', 415 noMaximum : 'No maximum rating specified. Cannot generate HTML automatically' 416 }, 417 418 419 metadata: { 420 rating : 'rating', 421 maxRating : 'maxRating' 422 }, 423 424 className : { 425 active : 'active', 426 disabled : 'disabled', 427 selected : 'selected', 428 loading : 'loading' 429 }, 430 431 selector : { 432 icon : '.icon' 433 }, 434 435 templates: { 436 icon: function(maxRating) { 437 var 438 icon = 1, 439 html = '' 440 ; 441 while(icon <= maxRating) { 442 html += '<i class="icon"></i>'; 443 icon++; 444 } 445 return html; 446 } 447 } 448 449 }; 450 451 })( jQuery, window , document );