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 );