1 /**

     2  *  jquery.spin-button

     3  *  (c) 2008 Semooh (http://semooh.jp/)

     4  *

     5  *  Dual licensed under the MIT (MIT-LICENSE.txt)

     6  *  and GPL (GPL-LICENSE.txt) licenses.

     7  *

     8  **/

     9 (function($){

    10   $.fn.extend({

    11     spin: function(opt){

    12       return this.each(function(){

    13         opt = $.extend({

    14             imageBasePath: '/soc/content/images/',

    15             spinBtnImage: 'spin-button.png',

    16             spinUpImage: 'spin-up.png',

    17             spinDownImage: 'spin-down.png',

    18             interval: 1,

    19             max: null,

    20             min: null,

    21             timeInterval: 500,

    22             timeBlink: 200

    23           }, opt || {});

    24 

    25         var txt = $(this);

    26 

    27         var spinBtnImage = opt.imageBasePath+opt.spinBtnImage;

    28         var btnSpin = new Image();

    29         btnSpin.src = spinBtnImage;

    30         var spinUpImage = opt.imageBasePath+opt.spinUpImage;

    31         var btnSpinUp = new Image();

    32         btnSpinUp.src = spinUpImage;

    33         var spinDownImage = opt.imageBasePath+opt.spinDownImage;

    34         var btnSpinDown = new Image();

    35         btnSpinDown.src = spinDownImage;

    36 

    37         var btn = $(document.createElement('img'));

    38         btn.attr('src', spinBtnImage);

    39         btn.css({cursor: 'pointer', verticalAlign: 'bottom', padding: 0, margin: 0});

    40         txt.after(btn);

    41         txt.css({marginRight:0, paddingRight:0});

    42 

    43         function spin(vector){

    44           var val = txt.val();

    45           if(!isNaN(val)){

    46             val = parseFloat(val) + (vector*opt.interval);

    47             if(opt.min!=null && val<opt.min) val=opt.min;

    48             if(opt.min!=null && val>opt.max) val=opt.max;

    49             if(val != txt.val()){

    50               txt.val(val);

    51               txt.change();

    52               src = (vector > 0 ? spinUpImage : spinDownImage);

    53               btn.attr('src', src);

    54               if(opt.timeBlink<opt.timeInterval)

    55                 setTimeout(function(){btn.attr('src', spinBtnImage);}, opt.timeBlink);

    56             }

    57           }

    58         }

    59 

    60         btn.mousedown(function(e){

    61           var pos = e.pageY - btn.offset().top;

    62           var vector = (btn.height()/2 > pos ? 1 : -1);

    63           (function(){

    64             spin(vector);

    65             var tk = setTimeout(arguments.callee, opt.timeInterval);

    66             $(document).one('mouseup', function(){

    67               clearTimeout(tk); btn.attr('src', spinBtnImage);

    68             });

    69           })();

    70           return false;

    71         });

    72       });

    73     }

    74   });

    75 })(jQuery);