circular-sliders-rails 0.1.1 → 0.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 1f2e6e0f89cc1eab4359e3134dffb3edb3a7456872aea2c1edeedc2cd31a0cae
-  data.tar.gz: 8ae66273d4e1d42ac7892a00e0a08412c6265b1d548a20777bb283beb3c82574
+  metadata.gz: 69ff79f3c1156560e0fc4fd075ad51a4e6f3545a1588a2336433a326383d1486
+  data.tar.gz: 7a59b0a99466b98e6082c73641e9c0fe5ac25fe0f33db72cc21d8a4d1a8fcd79
 SHA512:
-  metadata.gz: 86eb821cc7fe29cfd0a4c7edb5aaee15b48f50fb15d22580b5f27caa6ff821a7f1ee07ce59d6fe51a5208c513bb56c4b712f32b3e13de31ef3b3be6b9c68def2
-  data.tar.gz: cdcbcb7cb4890d727c8112565abddfc25fba3f4430940434d0f49713114e5b80de3af470bf250ce47be228f717a7866035d92d98b1405dfad28fa5f1f6b77ec5
+  metadata.gz: 44afddd02a7fa71cfc36055acd5d08ee55844fd10989dfa9494ab9a8ee6b8f9aedb7551f2bc0232aa8733a61abdc6cf2cb44ebbae72cd689c924c8e930684f77
+  data.tar.gz: 261adb194e5684e53237d9bef2ea9a1b5c98767ac055dbede22101a7d9ba013be63f269d3514e04d0bbf44d8a8bd452812c82d6c3879204b2de0b3ab11d5d3ec

data/README.md

@@ -90,12 +90,10 @@ Slider settings:
 | centerY         | Float  | Center of canvas or previous slider | Specify the y value for the center of the slider       |
 | color           | String | "#0000FF"                           | Specify the color of the arc fill                      |
 | minValue        | Float  | 0                                   | The minimum value of your slider                       |
-| maxValue        | Float  | 0                                   | The maximum value of your slider                       |
+| maxValue        | Float  | 100                                 | The maximum value of your slider                       |
 | step            | Float  | 10                                  | The amount the value is incremented                    |
 | units           | String | ""                                  | The units your value is displayed in                   |
 | radius          | Float  | 40 or previous slider radius +≈ 15  | The radius of your slider                              |
-| lineDashLength  | Float  | 5                                   | The arc length of each dash of your slider             |
-| lineDashSpacing | Float  | 5                                   | The arc spacing length of each dash of your slider     |
 | lineWidth       | Float  | 5                                   | The slider and arc width                               |
 | strokeColor     | String | "#D3D3D3"                           | The color of the dashes on the slider                  |
 | ballColor       | String | "#000000"                           | The color of the slider ball                           |

data/lib/circular/sliders/rails/version.rb

@@ -1,7 +1,7 @@
 module Circular
   module Sliders
     module Rails
-      VERSION = "0.1.1"
+      VERSION = "0.2.0"
     end
   end
 end

data/vendor/assets/javascripts/circular-sliders.js

@@ -27,12 +27,10 @@
       centerY: slidersCenterY,
       color: "#0000FF",
       minValue: 0,
-      maxValue: 1000,
+      maxValue: 100,
       step: 10,
       units: "",
       radius: 40,
-      lineDashLength: 5,
-      lineDashSpacing: 5,
       lineWidth: 5,
       strokeColor: "#D3D3D3",
       ballColor: "#000000",
@@ -69,12 +67,11 @@
     this.step = settings.step;
     this.units = settings.units;
     this.radius = settings.radius;
-    this.lineDashLength = settings.lineDashLength;
-    this.lineDashSpacing = settings.lineDashSpacing;
     this.lineWidth = settings.lineWidth;
     this.strokeColor = settings.strokeColor;
     this.textColor = settings.textColor;
     this.value = settings.minValue;
+    this.range = settings.maxValue - settings.minValue;
     // ball starts at top of circle which is - pi / 2
     this.angle = -(Math.PI / 2);
     this.ball = new Ball (settings);
@@ -103,7 +100,11 @@
     ctx.arc(slider.centerX, slider.centerY, slider.radius, 0, Math.PI*2, false);
     ctx.lineWidth = slider.lineWidth;
     ctx.strokeStyle = slider.strokeColor;
-    ctx.setLineDash([slider.lineDashLength, slider.lineDashSpacing]);
+    var sliderCircumference = 2 * Math.PI * slider.radius;
+    // maybe refactor, I like 2/3 and 1/3 for now
+    var sliderLineDashLength = (2 / 3) * (sliderCircumference / (slider.range / slider.step));
+    var sliderLineDashSpacing = (1 / 3) * (sliderCircumference / (slider.range / slider.step));
+    ctx.setLineDash([sliderLineDashLength, sliderLineDashSpacing]);
     ctx.stroke();
     ctx.closePath();
   }
@@ -135,6 +136,7 @@
   }
 
   function drawText (slider, count) {
+    // maybe refactor and make this editable
     ctx.font = "12px Arial";
     ctx.fillStyle = slider.textColor;
     ctx.fillText(slider.name + ": " + slider.value + " " + slider.units, 10, 20*(count+1));
@@ -147,7 +149,7 @@
     if (dx < 0) { slider.angle += Math.PI };
     slider.ball.x = slider.centerX + slider.radius * Math.cos(slider.angle);
     slider.ball.y = slider.centerY + slider.radius * Math.sin(slider.angle);
-    slider.value = slider.minValue + (slider.maxValue - slider.minValue) * ((slider.angle + (Math.PI/2)) / (2 * Math.PI) );
+    slider.value = slider.minValue + slider.range * ((slider.angle + (Math.PI/2)) / (2 * Math.PI) );
     // refactor - bug if give step value below 0.5
     var roundedValue = round(slider.value, slider.step);
     elem.data(slider.name.split(" ").join("_"), roundedValue);
@@ -159,9 +161,9 @@
     e.preventDefault();
     isMouseDown = true;
     setOffset();
-    // $(window).scrollLeft() and $(window).scrollTop() to account for page scrolling
-    mouseX = parseInt(e.clientX - offset[0] + $(window).scrollLeft());
-    mouseY = parseInt(e.clientY - offset[1] + $(window).scrollTop());
+    // $(window).scrollLeft() and $(window).scrollTop() to account for page scrolling, maybe refactor and make mouseX and mouseY global
+    var mouseX = parseInt(e.clientX - offset[0] + $(window).scrollLeft());
+    var mouseY = parseInt(e.clientY - offset[1] + $(window).scrollTop());
     for (var i = 0; i < sliders.length; i++) {
       if (onBall(mouseX, mouseY, sliders[i])) {
         selectedSlider = sliders[i];
@@ -180,8 +182,8 @@
     }
     e.preventDefault();
     setOffset();
-    mouseX = parseInt(e.clientX - offset[0] + $(window).scrollLeft());
-    mouseY = parseInt(e.clientY - offset[1] + $(window).scrollTop());
+    var mouseX = parseInt(e.clientX - offset[0] + $(window).scrollLeft());
+    var mouseY = parseInt(e.clientY - offset[1] + $(window).scrollTop());
     moveBall(mouseX, mouseY, selectedSlider);
   }
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: circular-sliders-rails
 version: !ruby/object:Gem::Version
-  version: 0.1.1
+  version: 0.2.0
 platform: ruby
 authors:
 - Sebastian Peterlin
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2018-05-12 00:00:00.000000000 Z
+date: 2018-05-19 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler