All Downloads are FREE. Search and download functionalities are using the official Maven repository.

kweb.static.plugins.fomantic.components.range.js Maven / Gradle / Ivy

There is a newer version: 1.4.12
Show newest version
/*!
 * # Semantic UI 2.6.4 - Range
 * http://github.com/semantic-org/semantic-ui/
 *
 *
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */

;(function ( $, window, document, undefined ) {
  
  "use strict";
  
  $.fn.range = function(parameters) {
    
    var
      $allModules    = $(this),
      
      offset         = 10,
      
      query          = arguments[0],
      methodInvoked  = (typeof query == 'string'),
      queryArguments = [].slice.call(arguments, 1)
    ;
    
    $allModules
      .each(function() {
        
        var
          settings          = ( $.isPlainObject(parameters) )
            ? $.extend(true, {}, $.fn.range.settings, parameters)
            : $.extend({}, $.fn.range.settings),
          
          namespace       = settings.namespace,
          min             = settings.min,
          max             = settings.max,
          step            = settings.step,
          start           = settings.start,
          input           = settings.input,
          
          eventNamespace  = '.' + namespace,
          moduleNamespace = 'module-' + namespace,
          
          $module         = $(this),
          
          element         = this,
          instance        = $module.data(moduleNamespace),
          
          inner,
          thumb,
          trackLeft,
          precision,
          
          module
        ;
        
        module = {
          
          initialize: function() {
            module.instantiate();
            module.sanitize();
          },
          
          instantiate: function() {
            instance = module;
            $module
              .data(moduleNamespace, module)
            ;
            $(element).html("
"); inner = $(element).children('.inner')[0]; thumb = $(element).find('.thumb')[0]; trackLeft = $(element).find('.track-fill')[0]; // find precision of step, used in calculating the value module.determinePrecision(); // set start location module.setValuePosition(settings.start); // event listeners $(element).find('.track, .thumb, .inner').on('mousedown', function(event) { event.stopImmediatePropagation(); event.preventDefault(); $(this).closest(".range").trigger('mousedown', event); }); $(element).find('.track, .thumb, .inner').on('touchstart', function(event) { event.stopImmediatePropagation(); event.preventDefault(); $(this).closest(".range").trigger('touchstart', event); }); $(element).on('mousedown', function(event, originalEvent) { module.rangeMousedown(event, false, originalEvent); }); $(element).on('touchstart', function(event, originalEvent) { module.rangeMousedown(event, true, originalEvent); }); module.addVisibilityListener(element); }, sanitize: function() { if (typeof settings.min != 'number') { settings.min = parseInt(settings.min) || 0; } if (typeof settings.max != 'number') { settings.max = parseInt(settings.max) || false; } if (typeof settings.start != 'number') { settings.start = parseInt(settings.start) || 0; } }, determinePrecision: function() { var split = String(settings.step).split('.'); var decimalPlaces; if(split.length == 2) { decimalPlaces = split[1].length; } else { decimalPlaces = 0; } precision = Math.pow(10, decimalPlaces); }, determineValue: function(startPos, endPos, currentPos) { var ratio = (currentPos - startPos) / (endPos - startPos); var range = settings.max - settings.min; var difference = Math.round(ratio * range / step) * step; // Use precision to avoid ugly Javascript floating point rounding issues // (like 35 * .01 = 0.35000000000000003) difference = Math.round(difference * precision) / precision; return difference + settings.min; }, determinePosition: function(value) { var ratio = (value - settings.min) / (settings.max - settings.min); return Math.round(ratio * $(inner).width()) + $(trackLeft).position().left - offset; }, setValue: function(newValue, triggeredByUser) { if(typeof triggeredByUser === 'undefined') { triggeredByUser = true; } if(settings.input) { $(settings.input).val(newValue); } if(settings.onChange) { settings.onChange(newValue, {triggeredByUser: triggeredByUser}); } }, setPosition: function(value) { $(thumb).css({left: String(value) + 'px'}); $(trackLeft).css({width: String(value + offset) + 'px'}); }, rangeMousedown: function(mdEvent, isTouch, originalEvent) { if( !$(element).hasClass('disabled') ) { mdEvent.preventDefault(); var left = $(inner).offset().left; var right = left + $(inner).width(); var pageX; if(isTouch) { pageX = originalEvent.originalEvent.touches[0].pageX; } else { pageX = (typeof mdEvent.pageX != 'undefined') ? mdEvent.pageX : originalEvent.pageX; } var value = module.determineValue(left, right, pageX); if(pageX >= left && pageX <= right) { module.setPosition(pageX - left - offset); module.setValue(value); } var rangeMousemove = function(mmEvent) { mmEvent.preventDefault(); if(isTouch) { pageX = mmEvent.originalEvent.touches[0].pageX; } else { pageX = mmEvent.pageX; } value = module.determineValue(left, right, pageX); if(pageX >= left && pageX <= right) { if(value >= settings.min && value <= settings.max) { module.setPosition(pageX - left - offset); module.setValue(value); } } } var rangeMouseup = function(muEvent) { if(isTouch) { $(document).off('touchmove', rangeMousemove); $(document).off('touchend', rangeMouseup); } else { $(document).off('mousemove', rangeMousemove); $(document).off('mouseup', rangeMouseup); } } if(isTouch) { $(document).on('touchmove', rangeMousemove); $(document).on('touchend', rangeMouseup); } else { $(document).on('mousemove', rangeMousemove); $(document).on('mouseup', rangeMouseup); } } }, setValuePosition: function(val, triggeredByUser) { if(typeof triggeredByUser === 'undefined') { triggeredByUser = true; } var position = module.determinePosition(val); module.setPosition(position); module.setValue(val, triggeredByUser); }, invoke: function(query) { switch(query) { case 'set value': if(queryArguments.length > 0) { instance.setValuePosition(queryArguments[0], false); } break; } }, addVisibilityListener: function(elem) { // Add a mutation observer (https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver) // to detect when root invisible element is behing shown in order to initialize the thumb correctly // when position and offets are available (https://stackoverflow.com/a/5974377) var observer = new MutationObserver(function(mutationList) { if ($(elem).is(':visible')) { observer.disconnect(); // Avoid infinite recursion because « module.setValuePosition » will trigger this observer module.setValuePosition(settings.start); } }); var closestHiddenParent = $(elem).parentsUntil(':visible'); if (closestHiddenParent.length != 0) { observer.observe(closestHiddenParent[closestHiddenParent.length - 1], {attributes: true}); } }, }; if(methodInvoked) { if(instance === undefined) { module.initialize(); } module.invoke(query); } else { module.initialize(); } }) ; return this; }; $.fn.range.settings = { name : 'Range', namespace : 'range', min : 0, max : false, step : 1, start : 0, input : false, onChange : function(value){}, }; })( jQuery, window, document );




© 2015 - 2024 Weber Informatics LLC | Privacy Policy