XoopsModules25x/xoopspoll

View on GitHub
assets/js/jquery-ui-sliderAccess.js

Summary

Maintainability
A
3 hrs
Test Coverage
/*
 * jQuery UI Slider Access
 * By: Trent Richardson [http://trentrichardson.com]
 * Version 0.3
 * Last Modified: 10/20/2012
 * 
 * Copyright 2011 Trent Richardson
 * Dual licensed under the MIT and GPL licenses.
 * http://trentrichardson.com/Impromptu/GPL-LICENSE.txt
 * http://trentrichardson.com/Impromptu/MIT-LICENSE.txt
 * 
 */
 (function($){

    $.fn.extend({
        sliderAccess: function(options){
            options = options || {};
            options.touchonly = options.touchonly !== undefined? options.touchonly : true; // by default only show it if touch device

            if(options.touchonly === true && !("ontouchend" in document)){
                return $(this);
            }
                
            return $(this).each(function(i,obj){
                        var $t = $(this),
                            o = $.extend({},{ 
                                            where: 'after',
                                            step: $t.slider('option','step'), 
                                            upIcon: 'ui-icon-plus', 
                                            downIcon: 'ui-icon-minus',
                                            text: false,
                                            upText: '+',
                                            downText: '-',
                                            buttonset: true,
                                            buttonsetTag: 'span',
                                            isRTL: false
                                        }, options),
                            $buttons = $('<'+ o.buttonsetTag +' class="ui-slider-access">'+
                                            '<button data-icon="'+ o.downIcon +'" data-step="'+ (o.isRTL? o.step : o.step*-1) +'">'+ o.downText +'</button>'+
                                            '<button data-icon="'+ o.upIcon +'" data-step="'+ (o.isRTL? o.step*-1 : o.step) +'">'+ o.upText +'</button>'+
                                        '</'+ o.buttonsetTag +'>');

                        $buttons.children('button').each(function(j, jobj){
                            var $jt = $(this);
                            $jt.button({ 
                                            text: o.text, 
                                            icons: { primary: $jt.data('icon') }
                                        })
                                .click(function(e){
                                            var step = $jt.data('step'),
                                                curr = $t.slider('value'),
                                                newval = curr += step*1,
                                                minval = $t.slider('option','min'),
                                                maxval = $t.slider('option','max'),
                                                slidee = $t.slider("option", "slide") || function(){},
                                                stope = $t.slider("option", "stop") || function(){};

                                            e.preventDefault();
                                            
                                            if(newval < minval || newval > maxval){
                                                return;
                                            }
                                            
                                            $t.slider('value', newval);

                                            slidee.call($t, null, { value: newval });
                                            stope.call($t, null, { value: newval });
                                        });
                        });
                        
                        // before or after                    
                        $t[o.where]($buttons);

                        if(o.buttonset){
                            $buttons.removeClass('ui-corner-right').removeClass('ui-corner-left').buttonset();
                            $buttons.eq(0).addClass('ui-corner-left');
                            $buttons.eq(1).addClass('ui-corner-right');
                        }

                        // adjust the width so we don't break the original layout
                        var bOuterWidth = $buttons.css({
                                    marginLeft: ((o.where === 'after' && !o.isRTL) || (o.where === 'before' && o.isRTL)? 10:0), 
                                    marginRight: ((o.where === 'before' && !o.isRTL) || (o.where === 'after' && o.isRTL)? 10:0)
                                }).outerWidth(true) + 5;
                        var tOuterWidth = $t.outerWidth(true);
                        $t.css('display','inline-block').width(tOuterWidth-bOuterWidth);
                    });        
        }
    });

})(jQuery);