@maslick/radiaslider - npm Package Compare versions

Comparing version 1.1.7 to 1.2.0

circular/slider-circular.js

@@ -17,4 +17,4 @@ function Slider(options) {
 
-    this.x0 = options.x0 == undefined ? this.container.width / 2 : options.x0;
-    this.y0 = options.y0 == undefined ? this.container.height / 2 : options.y0;
+    this.x0 = options.x0 === undefined ? this.container.width / 2 : options.x0;
+    this.y0 = options.y0 === undefined ? this.container.height / 2 : options.y0;
 
@@ -192,3 +192,3 @@ this.MouseX = 0;
 
-// Normilizes tangent
+// Normalizes tangent
 Slider.prototype.normalizeTan = function (ang) {
@@ -251,3 +251,3 @@ var rads = ang + Math.PI / 2 > 0 ? ang + Math.PI / 2 : (2 * Math.PI + ang + Math.PI / 2);
 
-    if (this.currentSlider && this.getSelectedSlider() && this.currentSlider.id != this.getSelectedSlider().id) {
+    if (this.currentSlider && this.getSelectedSlider() && this.currentSlider.id !== this.getSelectedSlider().id) {
         return;
@@ -254,0 +254,0 @@ }

circular/slider-circular.min.js

@@ -1,1 +0,1 @@
-function Slider(a){this.sliders={},this.scaleWidth=35,this.fillWidth=35,this.knobWidth=35,this.startAngle=1.5*Math.PI+1e-6,this.endAngle=1.5*Math.PI-1e-6,this.continuousMode=a.continuousMode||!1,this.container=document.getElementById(a.canvasId),this.the_body=document.body,this.context=this.container.getContext("2d"),this.x0=void 0==a.x0?this.container.width/2:a.x0,this.y0=void 0==a.y0?this.container.height/2:a.y0,this.MouseX=0,this.MouseY=0,this.selectedSlider=null,this.currentSlider=null,this.rotationEventListener=this._rotation.bind(this),this.container.addEventListener("mousedown",this._handleMouseDown.bind(this),!1),this.the_body.addEventListener("mouseup",this._handleMouseUp.bind(this),!1),this.container.addEventListener("click",this._handleClick.bind(this),!1),this.container.addEventListener("touchstart",this._handleTouch.bind(this),!1),this.container.addEventListener("touchmove",this._handleMove.bind(this),!1),this.container.addEventListener("touchend",this._handleEnd.bind(this),!1)}Slider.prototype.addSlider=function(a){this.sliders[a.id]={id:a.id,container:document.getElementById(a.container),color:a.color||"#104b63",min:a.min||0,max:a.max||100,radius:a.radius||100,startAngle:this.startAngle,endAngle:this.endAngle,onValueChangeCallback:a.changed||function(a){},ang_degrees:0,normalizedValue:a.min||0,step:a.step||1};var b=this.sliders[a.id];this.setSliderValue(b.id,a.min)},Slider.prototype.setSliderValue=function(a,b){var c=this.sliders[a];b<=c.min?(c.endAngle=this.startAngle,c.ang_degrees=0,c.normalizedValue=0):b>=c.max?(c.endAngle=this.endAngle,c.ang_degrees=360,c.normalizedValue=c.max):(c.endAngle=2*Math.PI*(b-c.min)/(c.max-c.min)-Math.PI/2,c.ang_degrees=this.radToDeg(this.normalizeTan(c.endAngle)),c.normalizedValue=b),this.drawAll()},Slider.prototype.drawAll=function(){this.context.clearRect(0,0,this.container.width,this.container.height);for(var a in this.sliders)if(this.sliders.hasOwnProperty(a)){var b=this.sliders[a];this.drawScale(b),this.drawData(b),this.drawArrow(b),this.drawKnob(b),b.onValueChangeCallback({rad:b.endAngle,deg:b.ang_degrees,value:b.normalizedValue})}this.drawCenterDot()},Slider.prototype.drawScale=function(a){for(var b=0;b<=2*Math.PI;b+=Math.PI/6)this.context.beginPath(),this.context.strokeStyle="#eeeeee",this.context.arc(this.x0,this.y0,a.radius,b,b+Math.PI/6,!1),this.context.lineWidth=this.scaleWidth,this.context.stroke()},Slider.prototype.drawCenterDot=function(){this.context.beginPath(),this.context.strokeStyle="#eeeeee",this.context.arc(this.x0,this.y0,this.scaleWidth/2,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="#eeeeee",this.context.fill()},Slider.prototype.drawData=function(a){this.context.beginPath(),this.context.strokeStyle=a.color,this.context.arc(this.x0,this.y0,a.radius,a.startAngle,a.endAngle,!1),this.context.lineWidth=this.fillWidth,this.context.stroke()},Slider.prototype.drawArrow=function(a){this.context.beginPath(),this.context.moveTo(this.x0,this.y0-a.radius+this.scaleWidth/2),this.context.lineTo(this.x0,this.y0-this.scaleWidth-a.radius+this.scaleWidth/2),this.context.lineTo(this.x0+this.scaleWidth/4,this.y0-this.scaleWidth/2-a.radius+this.scaleWidth/2),this.context.fillStyle="#eeeeee",this.context.fill()},Slider.prototype.drawKnob=function(a){this.context.beginPath(),this.context.strokeStyle="#eb879c",this.context.arc(Math.cos(a.endAngle)*a.radius+this.x0,Math.sin(a.endAngle)*a.radius+this.y0,this.knobWidth/2,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="#eb879c",this.context.fill(),this.context.beginPath(),this.context.strokeStyle="yellow",this.context.arc(Math.cos(a.endAngle)*a.radius+this.x0,Math.sin(a.endAngle)*a.radius+this.y0,this.scaleWidth/10,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="yellow",this.context.fill()},Slider.prototype.calculateAngles=function(a,b){if(this.selectedSlider){var c=this.selectedSlider.max,d=this.selectedSlider.min,e=this.selectedSlider.step,f=Math.atan2(b-this.y0,a-this.x0),g=this.radToDeg(this.normalizeTan(f)),h=this.normalizeTan(f)*(c-d)/(2*Math.PI)+d;h=(h/e>>0)*e,this.selectedSlider.endAngle=f,this.selectedSlider.ang_degrees=g,this.selectedSlider.normalizedValue=h}},Slider.prototype.radToDeg=function(a){return 180*a/Math.PI},Slider.prototype.normalizeTan=function(a){var b=a+Math.PI/2>0?a+Math.PI/2:2*Math.PI+a+Math.PI/2;return b},Slider.prototype.calculateUserCursor=function(){var a=this.container.getBoundingClientRect();event.touches?(this.MouseX=event.touches[0].clientX-a.left,this.MouseY=event.touches[0].clientY-a.top):(this.MouseX=event.clientX-a.left,this.MouseY=event.clientY-a.top)},Slider.prototype.getSelectedSlider=function(){this.calculateUserCursor();var a=Math.sqrt(Math.pow(this.MouseX-this.x0,2)+Math.pow(this.MouseY-this.y0,2));for(var b in this.sliders)if(this.sliders.hasOwnProperty(b)){var c=this.sliders[b];if(Math.abs(a-c.radius)<=this.scaleWidth/2){var d=c;break}}return d?d:null},Slider.prototype._handleMouseDown=function(a){a.preventDefault(),this.selectedSlider=this.getSelectedSlider(),this.selectedSlider&&this.the_body.addEventListener("mousemove",this.rotationEventListener,!1)},Slider.prototype._handleMouseUp=function(a){a.preventDefault(),this.the_body.removeEventListener("mousemove",this.rotationEventListener,!1),this.currentSlider=this.selectedSlider},Slider.prototype._handleClick=function(a){this.selectedSlider=this.getSelectedSlider(),this.currentSlider&&this.getSelectedSlider()&&this.currentSlider.id!=this.getSelectedSlider().id||this.selectedSlider&&this._rotation()},Slider.prototype._handleTouch=function(a){a.preventDefault(),this.selectedSlider=this.getSelectedSlider(),this.selectedSlider&&this._rotation()},Slider.prototype._handleMove=function(a){a.preventDefault(),this.continuousMode?this._rotation():this.selectedSlider&&this._rotation()},Slider.prototype._handleEnd=function(a){a.preventDefault(),this.the_body.removeEventListener("mousemove",this.rotationEventListener,!1)},Slider.prototype._rotation=function(){this.calculateUserCursor(),this.continuousMode&&(this.selectedSlider=this.getSelectedSlider()),this.calculateAngles(this.MouseX,this.MouseY),this.drawAll()};
+function Slider(t){this.sliders={},this.scaleWidth=35,this.fillWidth=35,this.knobWidth=35,this.startAngle=1.5*Math.PI+1e-6,this.endAngle=1.5*Math.PI-1e-6,this.continuousMode=t.continuousMode||!1,this.container=document.getElementById(t.canvasId),this.the_body=document.body,this.context=this.container.getContext("2d"),this.x0=void 0===t.x0?this.container.width/2:t.x0,this.y0=void 0===t.y0?this.container.height/2:t.y0,this.MouseX=0,this.MouseY=0,this.selectedSlider=null,this.currentSlider=null,this.rotationEventListener=this._rotation.bind(this),this.container.addEventListener("mousedown",this._handleMouseDown.bind(this),!1),this.the_body.addEventListener("mouseup",this._handleMouseUp.bind(this),!1),this.container.addEventListener("click",this._handleClick.bind(this),!1),this.container.addEventListener("touchstart",this._handleTouch.bind(this),!1),this.container.addEventListener("touchmove",this._handleMove.bind(this),!1),this.container.addEventListener("touchend",this._handleEnd.bind(this),!1)}Slider.prototype.addSlider=function(t){this.sliders[t.id]={id:t.id,container:document.getElementById(t.container),color:t.color||"#104b63",min:t.min||0,max:t.max||100,radius:t.radius||100,startAngle:this.startAngle,endAngle:this.endAngle,onValueChangeCallback:t.changed||function(t){},ang_degrees:0,normalizedValue:t.min||0,step:t.step||1};var e=this.sliders[t.id];this.setSliderValue(e.id,t.min)},Slider.prototype.setSliderValue=function(t,e){var i=this.sliders[t];e<=i.min?(i.endAngle=this.startAngle,i.ang_degrees=0,i.normalizedValue=0):e>=i.max?(i.endAngle=this.endAngle,i.ang_degrees=360,i.normalizedValue=i.max):(i.endAngle=2*Math.PI*(e-i.min)/(i.max-i.min)-Math.PI/2,i.ang_degrees=this.radToDeg(this.normalizeTan(i.endAngle)),i.normalizedValue=e),this.drawAll()},Slider.prototype.drawAll=function(){for(var t in this.context.clearRect(0,0,this.container.width,this.container.height),this.sliders)if(this.sliders.hasOwnProperty(t)){var e=this.sliders[t];this.drawScale(e),this.drawData(e),this.drawArrow(e),this.drawKnob(e),e.onValueChangeCallback({rad:e.endAngle,deg:e.ang_degrees,value:e.normalizedValue})}this.drawCenterDot()},Slider.prototype.drawScale=function(t){for(var e=0;e<=2*Math.PI;e+=Math.PI/6)this.context.beginPath(),this.context.strokeStyle="#eeeeee",this.context.arc(this.x0,this.y0,t.radius,e,e+Math.PI/6,!1),this.context.lineWidth=this.scaleWidth,this.context.stroke()},Slider.prototype.drawCenterDot=function(){this.context.beginPath(),this.context.strokeStyle="#eeeeee",this.context.arc(this.x0,this.y0,this.scaleWidth/2,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="#eeeeee",this.context.fill()},Slider.prototype.drawData=function(t){this.context.beginPath(),this.context.strokeStyle=t.color,this.context.arc(this.x0,this.y0,t.radius,t.startAngle,t.endAngle,!1),this.context.lineWidth=this.fillWidth,this.context.stroke()},Slider.prototype.drawArrow=function(t){this.context.beginPath(),this.context.moveTo(this.x0,this.y0-t.radius+this.scaleWidth/2),this.context.lineTo(this.x0,this.y0-this.scaleWidth-t.radius+this.scaleWidth/2),this.context.lineTo(this.x0+this.scaleWidth/4,this.y0-this.scaleWidth/2-t.radius+this.scaleWidth/2),this.context.fillStyle="#eeeeee",this.context.fill()},Slider.prototype.drawKnob=function(t){this.context.beginPath(),this.context.strokeStyle="#eb879c",this.context.arc(Math.cos(t.endAngle)*t.radius+this.x0,Math.sin(t.endAngle)*t.radius+this.y0,this.knobWidth/2,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="#eb879c",this.context.fill(),this.context.beginPath(),this.context.strokeStyle="yellow",this.context.arc(Math.cos(t.endAngle)*t.radius+this.x0,Math.sin(t.endAngle)*t.radius+this.y0,this.scaleWidth/10,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="yellow",this.context.fill()},Slider.prototype.calculateAngles=function(t,e){if(this.selectedSlider){var i=this.selectedSlider.max,s=this.selectedSlider.min,n=this.selectedSlider.step,h=Math.atan2(e-this.y0,t-this.x0),o=this.radToDeg(this.normalizeTan(h)),r=this.normalizeTan(h)*(i-s)/(2*Math.PI)+s;r=(r/n>>0)*n,this.selectedSlider.endAngle=h,this.selectedSlider.ang_degrees=o,this.selectedSlider.normalizedValue=r}},Slider.prototype.radToDeg=function(t){return 180*t/Math.PI},Slider.prototype.normalizeTan=function(t){return 0<t+Math.PI/2?t+Math.PI/2:2*Math.PI+t+Math.PI/2},Slider.prototype.calculateUserCursor=function(){var t=this.container.getBoundingClientRect();event.touches?(this.MouseX=event.touches[0].clientX-t.left,this.MouseY=event.touches[0].clientY-t.top):(this.MouseX=event.clientX-t.left,this.MouseY=event.clientY-t.top)},Slider.prototype.getSelectedSlider=function(){this.calculateUserCursor();var t=Math.sqrt(Math.pow(this.MouseX-this.x0,2)+Math.pow(this.MouseY-this.y0,2));for(var e in this.sliders)if(this.sliders.hasOwnProperty(e)){var i=this.sliders[e];if(Math.abs(t-i.radius)<=this.scaleWidth/2){var s=i;break}}return s||null},Slider.prototype._handleMouseDown=function(t){t.preventDefault(),this.selectedSlider=this.getSelectedSlider(),this.selectedSlider&&this.the_body.addEventListener("mousemove",this.rotationEventListener,!1)},Slider.prototype._handleMouseUp=function(t){t.preventDefault(),this.the_body.removeEventListener("mousemove",this.rotationEventListener,!1),this.currentSlider=this.selectedSlider},Slider.prototype._handleClick=function(t){this.selectedSlider=this.getSelectedSlider(),this.currentSlider&&this.getSelectedSlider()&&this.currentSlider.id!==this.getSelectedSlider().id||this.selectedSlider&&this._rotation()},Slider.prototype._handleTouch=function(t){t.preventDefault(),this.selectedSlider=this.getSelectedSlider(),this.selectedSlider&&this._rotation()},Slider.prototype._handleMove=function(t){t.preventDefault(),this.continuousMode?this._rotation():this.selectedSlider&&this._rotation()},Slider.prototype._handleEnd=function(t){t.preventDefault(),this.the_body.removeEventListener("mousemove",this.rotationEventListener,!1)},Slider.prototype._rotation=function(){this.calculateUserCursor(),this.continuousMode&&(this.selectedSlider=this.getSelectedSlider()),this.calculateAngles(this.MouseX,this.MouseY),this.drawAll()};

linear/slider-linear.js

@@ -241,9 +241,11 @@ function Slider(options) {
         var obj = this.sliders[key];
+        var xx;
+        var yy;
         if (this.vertical) {
-            var xx = this.MouseX >= obj.x0 - this.scaleWidth / 2 && this.MouseX <= obj.x0 + this.scaleWidth / 2;
-            var yy = this.MouseY >= obj.y0 - obj.width - this.scaleWidth/2 && this.MouseY <= obj.y0 + this.scaleWidth/2;
+            xx = this.MouseX >= obj.x0 - this.scaleWidth / 2 && this.MouseX <= obj.x0 + this.scaleWidth / 2;
+            yy = this.MouseY >= obj.y0 - obj.width - this.scaleWidth/2 && this.MouseY <= obj.y0 + this.scaleWidth/2;
         }
         else {
-            var xx = this.MouseX >= obj.x0 - this.scaleWidth/2 && this.MouseX <= obj.x0 + obj.width + this.scaleWidth/2;
-            var yy = this.MouseY >= obj.y0 - this.scaleWidth/2 && this.MouseY <= obj.y0 + this.scaleWidth/2;
+            xx = this.MouseX >= obj.x0 - this.scaleWidth/2 && this.MouseX <= obj.x0 + obj.width + this.scaleWidth/2;
+            yy = this.MouseY >= obj.y0 - this.scaleWidth/2 && this.MouseY <= obj.y0 + this.scaleWidth/2;
         }
@@ -282,5 +284,4 @@
 
-    if (this.currentSlider && this.getSelectedSlider() && this.currentSlider.id != this.getSelectedSlider().id) {
+    if (this.currentSlider && this.getSelectedSlider() && this.currentSlider.id !== this.getSelectedSlider().id) {
         return;
-        this._rotation();
     }
@@ -287,0 +288,0 @@

linear/slider-linear.min.js

@@ -1,1 +0,1 @@
-function Slider(a){this.sliders={},this.scaleWidth=35,this.fillWidth=35,this.knobWidth=35,this.continuousMode=a.continuousMode||!1,this.vertical=a.vertical||!1,this.container=document.getElementById(a.canvasId),this.the_body=document.body,this.context=this.container.getContext("2d"),this.MouseX=0,this.MouseY=0,this.selectedSlider=null,this.currentSlider=null,this.rotationEventListener=this._rotation.bind(this),this.container.addEventListener("mousedown",this._handleMouseDown.bind(this),!1),this.the_body.addEventListener("mouseup",this._handleMouseUp.bind(this),!1),this.container.addEventListener("click",this._handleClick.bind(this),!1),this.container.addEventListener("touchstart",this._handleTouch.bind(this),!1),this.container.addEventListener("touchmove",this._handleMove.bind(this),!1),this.container.addEventListener("touchend",this._handleEnd.bind(this),!1)}Slider.prototype.addSlider=function(a){this.sliders[a.id]={id:a.id,container:document.getElementById(a.container),color:a.color||"#104b63",width:a.width||100,min:a.min||0,max:a.max||100,step:a.step||1,x0:a.x0||0,y0:a.y0||0,onValueChangeCallback:a.changed||function(a){},value:0,normalizedValue:a.min||0};var b=this.sliders[a.id];this.setSliderValue(b.id,a.min)},Slider.prototype.setSliderValue=function(a,b){var c=this.sliders[a];b<=c.min?(c.value=0,c.normalizedValue=c.min):b>=c.max?(c.value=c.width,c.normalizedValue=c.max):(c.value=c.width*(b-c.min)/(c.max-c.min),c.normalizedValue=b),this.drawAll()},Slider.prototype.drawAll=function(){this.context.clearRect(0,0,this.container.width,this.container.height);for(var a in this.sliders)if(this.sliders.hasOwnProperty(a)){var b=this.sliders[a];this.drawScale(b),this.drawData(b),this.drawKnob(b),b.onValueChangeCallback({width:b.value,value:b.normalizedValue})}},Slider.prototype.drawScale=function(a){var b=this.vertical?0:1,c=this.vertical?1:0;this.context.beginPath(),this.context.strokeStyle=a.color,this.context.arc(a.x0+b,a.y0-c,this.scaleWidth/2,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle=a.color,this.context.fill();var d,e;this.vertical?(d=a.x0,e=a.y0-a.width):(d=a.x0+a.width,e=a.y0),this.context.beginPath(),this.context.strokeStyle="#eeeeee",this.context.moveTo(a.x0,a.y0),this.context.lineTo(d,e),this.context.lineWidth=this.scaleWidth,this.context.stroke(),this.context.strokeStyle="#eeeeee",this.context.arc(d,e,this.scaleWidth/2,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="#eeeeee",this.context.fill()},Slider.prototype.drawData=function(a){var b,c;this.vertical?(b=a.x0,c=a.y0-a.value):(b=a.x0+a.value,c=a.y0),this.context.beginPath(),this.context.strokeStyle=a.color,this.context.moveTo(a.x0,a.y0),this.context.lineTo(b,c),this.context.lineWidth=this.fillWidth,this.context.stroke()},Slider.prototype.drawKnob=function(a){var b,c;this.vertical?(b=a.x0,c=a.y0-a.value):(b=a.x0+a.value,c=a.y0),this.context.beginPath(),this.context.strokeStyle="#eb879c",this.context.arc(b,c,this.knobWidth/2,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="#eb879c",this.context.fill(),this.context.beginPath(),this.context.strokeStyle="yellow",this.context.arc(b,c,this.scaleWidth/10,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="yellow",this.context.fill()},Slider.prototype.calculateValues=function(a,b){if(this.selectedSlider){var g,c=this.selectedSlider.max,d=this.selectedSlider.min,e=this.selectedSlider.step,f=this.selectedSlider.width;g=this.vertical?this.selectedSlider.y0-b:a-this.selectedSlider.x0;var h=g;h>this.selectedSlider.width-this.selectedSlider.step&&(h=this.selectedSlider.width),h<0+this.selectedSlider.step&&(h=0);var i=h*(c-d)/f+d;i=(i/e>>0)*e,this.selectedSlider.value=h,this.selectedSlider.normalizedValue=i}},Slider.prototype.calculateUserCursor=function(){var a=this.container.getBoundingClientRect();event.touches?(this.MouseX=event.touches[0].clientX-a.left,this.MouseY=event.touches[0].clientY-a.top):(this.MouseX=event.clientX-a.left,this.MouseY=event.clientY-a.top)},Slider.prototype.getSelectedSlider=function(){this.calculateUserCursor();for(var a in this.sliders)if(this.sliders.hasOwnProperty(a)){var b=this.sliders[a];if(this.vertical)var c=this.MouseX>=b.x0-this.scaleWidth/2&&this.MouseX<=b.x0+this.scaleWidth/2,d=this.MouseY>=b.y0-b.width-this.scaleWidth/2&&this.MouseY<=b.y0+this.scaleWidth/2;else var c=this.MouseX>=b.x0-this.scaleWidth/2&&this.MouseX<=b.x0+b.width+this.scaleWidth/2,d=this.MouseY>=b.y0-this.scaleWidth/2&&this.MouseY<=b.y0+this.scaleWidth/2;if(c&&d){var e=b;break}}return e?e:null},Slider.prototype._handleMouseDown=function(a){a.preventDefault(),this.selectedSlider=this.getSelectedSlider(),this.selectedSlider&&this.the_body.addEventListener("mousemove",this.rotationEventListener,!1)},Slider.prototype._handleMouseUp=function(a){a.preventDefault(),this.the_body.removeEventListener("mousemove",this.rotationEventListener,!1),this.currentSlider=this.selectedSlider},Slider.prototype._handleClick=function(a){this.selectedSlider=this.getSelectedSlider(),this.currentSlider&&this.getSelectedSlider()&&this.currentSlider.id!=this.getSelectedSlider().id||this.selectedSlider&&this._rotation()},Slider.prototype._handleTouch=function(a){a.preventDefault(),this.selectedSlider=this.getSelectedSlider(),this.selectedSlider&&this._rotation()},Slider.prototype._handleMove=function(a){a.preventDefault(),this.continuousMode?this._rotation():this.selectedSlider&&this._rotation()},Slider.prototype._handleEnd=function(a){a.preventDefault(),this.the_body.removeEventListener("mousemove",this.rotationEventListener,!1)},Slider.prototype._rotation=function(){this.calculateUserCursor(),this.continuousMode&&(this.selectedSlider=this.getSelectedSlider()),this.calculateValues(this.MouseX,this.MouseY),this.drawAll()};
+function Slider(t){this.sliders={},this.scaleWidth=35,this.fillWidth=35,this.knobWidth=35,this.continuousMode=t.continuousMode||!1,this.vertical=t.vertical||!1,this.container=document.getElementById(t.canvasId),this.the_body=document.body,this.context=this.container.getContext("2d"),this.MouseX=0,this.MouseY=0,this.selectedSlider=null,this.currentSlider=null,this.rotationEventListener=this._rotation.bind(this),this.container.addEventListener("mousedown",this._handleMouseDown.bind(this),!1),this.the_body.addEventListener("mouseup",this._handleMouseUp.bind(this),!1),this.container.addEventListener("click",this._handleClick.bind(this),!1),this.container.addEventListener("touchstart",this._handleTouch.bind(this),!1),this.container.addEventListener("touchmove",this._handleMove.bind(this),!1),this.container.addEventListener("touchend",this._handleEnd.bind(this),!1)}Slider.prototype.addSlider=function(t){this.sliders[t.id]={id:t.id,container:document.getElementById(t.container),color:t.color||"#104b63",width:t.width||100,min:t.min||0,max:t.max||100,step:t.step||1,x0:t.x0||0,y0:t.y0||0,onValueChangeCallback:t.changed||function(t){},value:0,normalizedValue:t.min||0};var e=this.sliders[t.id];this.setSliderValue(e.id,t.min)},Slider.prototype.setSliderValue=function(t,e){var i=this.sliders[t];e<=i.min?(i.value=0,i.normalizedValue=i.min):e>=i.max?(i.value=i.width,i.normalizedValue=i.max):(i.value=i.width*(e-i.min)/(i.max-i.min),i.normalizedValue=e),this.drawAll()},Slider.prototype.drawAll=function(){for(var t in this.context.clearRect(0,0,this.container.width,this.container.height),this.sliders)if(this.sliders.hasOwnProperty(t)){var e=this.sliders[t];this.drawScale(e),this.drawData(e),this.drawKnob(e),e.onValueChangeCallback({width:e.value,value:e.normalizedValue})}},Slider.prototype.drawScale=function(t){var e,i,s=this.vertical?0:1,l=this.vertical?1:0;this.context.beginPath(),this.context.strokeStyle=t.color,this.context.arc(t.x0+s,t.y0-l,this.scaleWidth/2,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle=t.color,this.context.fill(),this.vertical?(e=t.x0,i=t.y0-t.width):(e=t.x0+t.width,i=t.y0),this.context.beginPath(),this.context.strokeStyle="#eeeeee",this.context.moveTo(t.x0,t.y0),this.context.lineTo(e,i),this.context.lineWidth=this.scaleWidth,this.context.stroke(),this.context.strokeStyle="#eeeeee",this.context.arc(e,i,this.scaleWidth/2,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="#eeeeee",this.context.fill()},Slider.prototype.drawData=function(t){var e,i;this.vertical?(e=t.x0,i=t.y0-t.value):(e=t.x0+t.value,i=t.y0),this.context.beginPath(),this.context.strokeStyle=t.color,this.context.moveTo(t.x0,t.y0),this.context.lineTo(e,i),this.context.lineWidth=this.fillWidth,this.context.stroke()},Slider.prototype.drawKnob=function(t){var e,i;this.vertical?(e=t.x0,i=t.y0-t.value):(e=t.x0+t.value,i=t.y0),this.context.beginPath(),this.context.strokeStyle="#eb879c",this.context.arc(e,i,this.knobWidth/2,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="#eb879c",this.context.fill(),this.context.beginPath(),this.context.strokeStyle="yellow",this.context.arc(e,i,this.scaleWidth/10,0,2*Math.PI,!1),this.context.lineWidth=1,this.context.fillStyle="yellow",this.context.fill()},Slider.prototype.calculateValues=function(t,e){if(this.selectedSlider){var i=this.selectedSlider.max,s=this.selectedSlider.min,l=this.selectedSlider.step,h=this.selectedSlider.width,n=this.vertical?this.selectedSlider.y0-e:t-this.selectedSlider.x0;n>this.selectedSlider.width-this.selectedSlider.step&&(n=this.selectedSlider.width),n<0+this.selectedSlider.step&&(n=0);var o=n*(i-s)/h+s;o=(o/l>>0)*l,this.selectedSlider.value=n,this.selectedSlider.normalizedValue=o}},Slider.prototype.calculateUserCursor=function(){var t=this.container.getBoundingClientRect();event.touches?(this.MouseX=event.touches[0].clientX-t.left,this.MouseY=event.touches[0].clientY-t.top):(this.MouseX=event.clientX-t.left,this.MouseY=event.clientY-t.top)},Slider.prototype.getSelectedSlider=function(){for(var t in this.calculateUserCursor(),this.sliders)if(this.sliders.hasOwnProperty(t)){var e,i,s=this.sliders[t];if(this.vertical?(e=this.MouseX>=s.x0-this.scaleWidth/2&&this.MouseX<=s.x0+this.scaleWidth/2,i=this.MouseY>=s.y0-s.width-this.scaleWidth/2&&this.MouseY<=s.y0+this.scaleWidth/2):(e=this.MouseX>=s.x0-this.scaleWidth/2&&this.MouseX<=s.x0+s.width+this.scaleWidth/2,i=this.MouseY>=s.y0-this.scaleWidth/2&&this.MouseY<=s.y0+this.scaleWidth/2),e&&i){var l=s;break}}return l||null},Slider.prototype._handleMouseDown=function(t){t.preventDefault(),this.selectedSlider=this.getSelectedSlider(),this.selectedSlider&&this.the_body.addEventListener("mousemove",this.rotationEventListener,!1)},Slider.prototype._handleMouseUp=function(t){t.preventDefault(),this.the_body.removeEventListener("mousemove",this.rotationEventListener,!1),this.currentSlider=this.selectedSlider},Slider.prototype._handleClick=function(t){this.selectedSlider=this.getSelectedSlider(),this.currentSlider&&this.getSelectedSlider()&&this.currentSlider.id!==this.getSelectedSlider().id||this.selectedSlider&&this._rotation()},Slider.prototype._handleTouch=function(t){t.preventDefault(),this.selectedSlider=this.getSelectedSlider(),this.selectedSlider&&this._rotation()},Slider.prototype._handleMove=function(t){t.preventDefault(),this.continuousMode?this._rotation():this.selectedSlider&&this._rotation()},Slider.prototype._handleEnd=function(t){t.preventDefault(),this.the_body.removeEventListener("mousemove",this.rotationEventListener,!1)},Slider.prototype._rotation=function(){this.calculateUserCursor(),this.continuousMode&&(this.selectedSlider=this.getSelectedSlider()),this.calculateValues(this.MouseX,this.MouseY),this.drawAll()};

package.json

 {
   "name": "@maslick/radiaslider",
-  "version": "1.1.7",
+  "version": "1.2.0",
   "description": "nice looking canvas-based radial and linear slider",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -5,3 +5,3 @@ # =radiaSlider=
 [![npm no dependencies](https://img.shields.io/badge/dependencies-none-green.svg)](https://www.npmjs.com/package/@maslick/radiaslider)
-[![npm download count](https://img.shields.io/npm/dt/@maslick/radiaslider.svg)](https://www.npmjs.com/package/@maslick/radiaslider)
+[![npm download count](https://img.shields.io/npm/dt/@maslick/radiaslider.svg)](https://npmcharts.com/compare/@maslick/radiaslider?minimal=true)
 [![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)
@@ -8,0 +8,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of package files

16

increased by23.08%

Lines of code

508

increased by0.2%

Worsened metrics

Total package byte prevSize

71076

decreased by-57.07%

No dependency changes