jquery.dragval-1.0-pack.js 12 KB

12345678910111213141516171819202122232425
  1. /**
  2. * plugin name: jQuery Dragval
  3. * varsion: 1.0
  4. * Alpha
  5. * license: GNU GENERAL PUBLIC LICENSE v3
  6. *
  7. * September 21, 2010
  8. *
  9. * Copyright (c) 2010 Kamil Szalewski (http://szalewski.pl, http://pimago.pl)
  10. *
  11. * jQuery Dragval is free software: you can redistribute it and/or modify
  12. * it under the terms of the GNU General Public License as published by
  13. * the Free Software Foundation, either version 3 of the License, or
  14. * (at your option) any later version.
  15. *
  16. * jQuery Dragval is distributed in the hope that it will be useful,
  17. * but WITHOUT ANY WARRANTY; without even the implied warranty of
  18. * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  19. * GNU General Public License for more details.
  20. *
  21. * You should have received a copy of the GNU General Public License
  22. * along with Foobar. If not, see <http://www.gnu.org/licenses/>.
  23. *
  24. **/
  25. (function($){jQuery.fn.dragval=function(options){set=jQuery.extend({out:".Output",actMin:".ActMin",actMax:".ActMax",loop:".Loop",dragloop:".DragLoop",rightloop:".RightLoop",leftloop:".LeftLoop",mouseout:".MouseOut",measure:".Measure",indicator:".Indicator",track:".Track",label:".Label",labels:".Labels",leftBtn:".LeftBtn",rightBtn:".RightBtn",loopTime:60,clickTime:200,step:10000,min:10000,max:2000000,startValue:0,indicStep:51.7,iniPosition:17},options);this.each(function(){var obj=$(this);obj.prepend('<div class="Container">'+'<div class="Track">'+'<div class="Indicator"></div>'+'<div class="LeftBtn"></div>'+'<div class="Labels">'+'<div class="Label LabelFirst" id="lab-1"></div>'+'<div class="Label" id="lab-2"></div>'+'<div class="Label" id="lab-3"></div>'+'<div class="Label" id="lab-4"></div>'+'<div class="Label" id="lab-5"></div>'+'<div class="Label" id="lab-6"></div>'+'<div class="Label" id="lab-7"></div>'+'<div class="Label" id="lab-8"></div>'+'<div class="Label" id="lab-9"></div>'+'<div class="Label LabelLast" id="lab-10"></div>'+'</div>'+'<div class="RightBtn"></div>'+'</div>'+'<div class="Measure"></div>'+'</div>'+'<input type="hidden" name="" value="" class="ActMin" />'+'<input type="hidden" name="" value="" class="ActMax" />'+'<input type="hidden" name="" value="0" class="Loop" />'+'<input type="hidden" name="" value="0" class="DragLoop" />'+'<input type="hidden" name="" value="0" class="MouseOut" />'+'<input type="hidden" name="" value="0" class="LeftLoop" />'+'<input type="hidden" name="" value="0" class="RightLoop" />');var indicator=set.indicator;var loopTime=Number(set.loopTime);var clickTime=Number(set.clickTime);var step=Number(set.step);var min=Number(set.min);var max=Number(set.max);var startValue=Number(set.startValue);var indicStep=Number(set.indicStep);var iniPosition=Number(set.iniPosition);if(startValue>0){$(set.out,obj).attr("value",set.startValue);$(set.actMin,obj).attr("value",set.startValue);$(set.actMax,obj).attr("value",set.startValue+(9*set.step));toValue(startValue)}else{$(set.out,obj).attr("value",set.min);$(set.actMin,obj).attr("value",set.min);$(set.actMax,obj).attr("value",set.min+(9*set.step));var x=set.min;$(set.measure,obj).html(" ");while(x<=set.min+(9*set.step)){$(set.measure,obj).append("<span class=\"Value\">"+number_format(x," ")+"</span>");x=x+set.step}}var track=$(set.track,obj);$(indicator,obj).draggable({axis:'x',containment:track,grid:[indicStep,indicStep],stop:function(event,ui){var actMin=Number($(set.actMin,obj).attr("value"));var actMax=Number($(set.actMax,obj).attr("value"));var posNumber=Math.round(((Number($(indicator,obj).css("left").split("px")[0])-iniPosition)/indicStep)+1);$(set.out,obj).attr("value",Number((posNumber-1)*step)+actMin);$(set.loop,obj).attr("value",0);$(set.dragloop,obj).attr("value",0);$(set.mouseout,obj).attr("value",0);$(set.rightloop,obj).attr("value",0);$(set.leftloop,obj).attr("value",0)},drag:function(event,ui){if($(set.dragloop,obj).attr("value")=='0'){if(Number($(indicator,obj).css("left").split("px")[0])<=17&&$(set.mouseout,obj).attr("value")=='1'){$(set.loop,obj).attr("value",1);$(set.dragloop,obj).attr("value",1);$(set.leftloop,obj).attr("value",1);moveLeft()}if(Number($(indicator,obj).css("left").split("px")[0])>=481&&$(set.mouseout,obj).attr("value")=='1'){$(set.loop,obj).attr("value",1);$(set.dragloop,obj).attr("value",1);$(set.rightloop,obj).attr("value",1);moveRight()}}else if(Number($(indicator,obj).css("left").split("px")[0])<482&&$(set.rightloop,obj).attr("value")=='1'){$(set.loop,obj).attr("value",0);$(set.dragloop,obj).attr("value",0);$(set.rightloop,obj).attr("value",0)}else if(Number($(indicator,obj).css("left").split("px")[0])>17&&$(set.leftloop,obj).attr("value")=='1'){$(set.loop,obj).attr("value",0);$(set.dragloop,obj).attr("value",0);$(set.leftloop,obj).attr("value",0)}if(Math.round(((Number($(indicator,obj).css("left").split("px")[0])-iniPosition)/indicStep)+1)>=1&&Math.round(((Number($(indicator,obj).css("left").split("px")[0])-iniPosition)/indicStep)+1)<=10){var actMin=Number($(set.actMin,obj).attr("value"));var actMax=Number($(set.actMax,obj).attr("value"));var posNumber=Math.round(((Number($(indicator,obj).css("left").split("px")[0])-iniPosition)/indicStep)+1);$(set.out,obj).attr("value",Number((posNumber-1)*step)+actMin)}}});$(set.label,obj).click(function(){var actMin=Number($(set.actMin,obj).attr("value"));var actMax=Number($(set.actMax,obj).attr("value"));var posNumber=$(this).attr("id").split("-")[1];var distance=Number(posNumber*indicStep)-indicStep;$(set.out,obj).attr("value",Number((posNumber-1)*step)+actMin);$(set.indicator,obj).css("left",distance+iniPosition+"px")});$(set.leftBtn,obj).mousedown(function(){$(set.loop,obj).attr("value",1);moveLeftWarun(1)}).mouseup(function(){$(set.loop,obj).attr("value",0);$(set.mouseout,obj).attr("value",0)});$(set.rightBtn,obj).mousedown(function(){$(set.loop,obj).attr("value",1);moveRightWarun(1)}).mouseup(function(){$(set.loop,obj).attr("value",0);$(set.mouseout,obj).attr("value",0)});$(set.labels,obj).mouseleave(function(){if($(indicator,obj).attr("class")=="Indicator ui-draggable ui-draggable-dragging"){$(set.loop,obj).attr("value",1);$(set.mouseout,obj).attr("value",1)}}).mouseover(function(){$(set.loop,obj).attr("value",0);$(set.mouseout,obj).attr("value",0)});$(indicator,obj).mouseleave(function(){if($(indicator,obj).attr("class")=="Indicator ui-draggable ui-draggable-dragging"){$(set.loop,obj).attr("value",1);$(set.mouseout,obj).attr("value",1)}});$(indicator,obj).mouseup(function(){$(set.loop,obj).attr("value",0);$(set.mouseout,obj).attr("value",0)});$(set.out,obj).focusout(function(){var newValue=Number((Math.round(Number($(set.out,obj).attr("value"))/step))*step);if(integer_validate(newValue)){toValue(newValue)}else{toValue(min);$(set.out,obj).attr("value",min)}});function toValue(newValue){if(newValue>=min&&newValue<=max){var actMin=Number($(set.actMin,obj).attr("value"));var actMax=Number($(set.actMax,obj).attr("value"));if(newValue==max){$(set.actMin,obj).attr("value",newValue-(9*step));$(set.actMax,obj).attr("value",newValue);$(indicator,obj).css("left",iniPosition+(9*indicStep)+"px");var x=newValue-(9*step);$(set.measure,obj).html(" ");while(x<=newValue){$(set.measure,obj).append("<span class=\"Value\">"+number_format(x," ")+"</span>");x=x+step}}else if(newValue>actMin&&newValue<actMax){var stepsTo=(10-((actMax-newValue)/step))-1;$(indicator,obj).css("left",(stepsTo*indicStep)+17+"px")}else{$(set.actMin,obj).attr("value",newValue);$(set.actMax,obj).attr("value",newValue+(9*step));$(indicator,obj).css("left","17px");var x=newValue;$(set.measure,obj).html(" ");while(x<=(newValue+(9*step))){$(set.measure,obj).append("<span class=\"Value\">"+number_format(x," ")+"</span>");x=x+step}}}else if(newValue>max){toValue(max);$(set.out,obj).attr("value",max)}else if(newValue<min){toValue(min);$(set.out,obj).attr("value",min)}}function integer_validate(src){var regex=/^[\-]{0,1}[0-9]{1,8}$/;return regex.test(src)}function number_format(l,r){w='';while(a=~~(l/1e3)){w=r+((b=l%1e3)>9?(b>99?'':'0'):'00')+b+w;l=a}return l+w}function moveLeft(){var actValue=Number($(set.out,obj).attr("value"));var actMin=Number($(set.actMin,obj).attr("value"));var actMax=Number($(set.actMax,obj).attr("value"));if(actMin>min){$(set.out,obj).attr("value",actValue-step);$(set.actMin,obj).attr("value",actMin-step);$(set.actMax,obj).attr("value",actMax-step);var x=Number($(set.actMin,obj).attr("value"));$(set.measure,obj).html("");while(x<=Number($(set.actMax,obj).attr("value"))){$(set.measure,obj).append("<span class=\"Value\">"+number_format(x," ")+"</span>");x=x+step}}else{var posNumber=Math.round(((Number($(indicator,obj).css("left").split("px")[0])-iniPosition)/indicStep)+1);var distance=Number(posNumber*indicStep)-indicStep;if(posNumber>1){$(set.out,obj).attr("value",(Number((posNumber-1)*step)+actMin)-step);$(indicator,obj).css("left",(distance+iniPosition)-indicStep+"px")}}if($(set.loop,obj).attr("value")>0){setTimeout(moveLeft,loopTime)}}function moveLeftWarun(w){var actValue=Number($(set.out,obj).attr("value"));var actMin=Number($(set.actMin,obj).attr("value"));var actMax=Number($(set.actMax,obj).attr("value"));if(actMin>min){$(set.out,obj).attr("value",actValue-step);$(set.actMin,obj).attr("value",actMin-step);$(set.actMax,obj).attr("value",actMax-step);var x=Number($(set.actMin,obj).attr("value"));$(set.measure,obj).html("");while(x<=Number($(set.actMax,obj).attr("value"))){$(set.measure,obj).append("<span class=\"Value\">"+number_format(x," ")+"</span>");x=x+step}}else{var posNumber=Math.round(((Number($(indicator,obj).css("left").split("px")[0])-iniPosition)/indicStep)+1);var distance=Number(posNumber*indicStep)-indicStep;if(posNumber>1){$(set.out,obj).attr("value",(Number((posNumber-1)*step)+actMin)-step);$(indicator,obj).css("left",(distance+iniPosition)-indicStep+"px")}}if(w>0){setTimeout(checkLoopLeft,clickTime)}else{if($(set.loop,obj).attr("value")>0){setTimeout(moveLeft,loopTime)}}}function checkLoopLeft(){if($(set.loop,obj).attr("value")>0){moveLeft()}}function moveRight(){var actValue=Number($(set.out,obj).attr("value"));var actMin=Number($(set.actMin,obj).attr("value"));var actMax=Number($(set.actMax,obj).attr("value"));if(actMax<max){$(set.out,obj).attr("value",actValue+step);$(set.actMin,obj).attr("value",actMin+step);$(set.actMax,obj).attr("value",actMax+step);var x=Number($(set.actMin,obj).attr("value"));$(set.measure,obj).html("");while(x<=Number($(set.actMax,obj).attr("value"))){$(set.measure,obj).append("<span class=\"Value\">"+number_format(x," ")+"</span>");x=x+step}}else{var posNumber=Math.round(((Number($(indicator,obj).css("left").split("px")[0])-iniPosition)/indicStep)+1);var distance=Number(posNumber*indicStep)-indicStep;if(posNumber<10){$(set.out,obj).attr("value",(Number((posNumber-1)*step)+actMin)+step);$(indicator,obj).css("left",(distance+iniPosition)+indicStep+"px")}}if($(set.loop,obj).attr("value")>0){setTimeout(moveRight,loopTime)}}function moveRightWarun(w){var actValue=Number($(set.out,obj).attr("value"));var actMin=Number($(set.actMin,obj).attr("value"));var actMax=Number($(set.actMax,obj).attr("value"));if(actMax<max){$(set.out,obj).attr("value",actValue+step);$(set.actMin,obj).attr("value",actMin+step);$(set.actMax,obj).attr("value",actMax+step);var x=Number($(set.actMin,obj).attr("value"));$(set.measure,obj).html("");while(x<=Number($(set.actMax,obj).attr("value"))){$(set.measure,obj).append("<span class=\"Value\">"+number_format(x," ")+"</span>");x=x+step}}else{var posNumber=Math.round(((Number($(indicator,obj).css("left").split("px")[0])-iniPosition)/indicStep)+1);var distance=Number(posNumber*indicStep)-indicStep;if(posNumber<10){$(set.out,obj).attr("value",(Number((posNumber-1)*step)+actMin)+step);$(indicator,obj).css("left",(distance+iniPosition)+indicStep+"px")}}if(w>0){setTimeout(checkLoopRight,clickTime)}else{if($(set.loop,obj).attr("value")>0){setTimeout(moveRight,loopTime)}}}function checkLoopRight(){if($(set.loop,obj).attr("value")>0){moveRight()}}});return this}})(jQuery);