Merge pull request #121 from adaptlearning/issue/1423

Adds support for decimal steps
adaptlearning · Feb 21, 2017 · fcf06cf · fcf06cf
2 parents 20a802f + c300b59
commit fcf06cf
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 10 deletions.
diff --git a/README.md b/README.md
@@ -107,7 +107,7 @@ contains values for three types of answers: **correct**, **_incorrect**, and **_
 No known limitations.  
 
 ----------------------------
-**Version number:**  2.1.3   <a href="https://community.adaptlearning.org/" target="_blank"><img src="https://github.com/adaptlearning/documentation/blob/master/04_wiki_assets/plug-ins/images/adapt-logo-mrgn-lft.jpg" alt="adapt learning logo" align="right"></a>
+**Version number:**  2.1.4   <a href="https://community.adaptlearning.org/" target="_blank"><img src="https://github.com/adaptlearning/documentation/blob/master/04_wiki_assets/plug-ins/images/adapt-logo-mrgn-lft.jpg" alt="adapt learning logo" align="right"></a>
 **Framework versions:** 2.0.13  
 **Author / maintainer:** Adapt Core Team with [contributors](https://github.com/adaptlearning/adapt-contrib-slider/graphs/contributors)    
 **Accessibility support:** WAI AA   

diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "adapt-contrib-slider",
-  "version": "2.1.3",
+  "version": "2.1.4",
   "framework": "^2.0.13",
   "homepage": "https://github.com/adaptlearning/adapt-contrib-slider",
   "issues": "https://github.com/adaptlearning/adapt_framework/issues/new?title=contrib-slider%3A%20please%20enter%20a%20brief%20summary%20of%20the%20issue%20here&body=please%20provide%20a%20full%20description%20of%20the%20problem,%20including%20steps%20on%20how%20to%20replicate,%20what%20browser(s)/device(s)%20the%20problem%20occurs%20on%20and,%20where%20helpful,%20screenshots.",

diff --git a/js/adapt-contrib-slider.js b/js/adapt-contrib-slider.js
@@ -6,12 +6,12 @@ define([
 
     var Slider = QuestionView.extend({
 
-        tempValue:true,
+        tempValue: true,
 
         events: {
             'click .slider-scale-number': 'onNumberSelected',
-            'focus input[type="range"]':'onHandleFocus',
-            'blur input[type="range"]':'onHandleBlur'
+            'focus input[type="range"]': 'onHandleFocus',
+            'blur input[type="range"]': 'onHandleBlur'
         },
 
         // Used by the question to reset the question when revisiting the component
@@ -78,6 +78,13 @@ define([
             this.tempValue = true;
         },
 
+        /**
+         * Returns the number of decimal places in a specified number
+         */
+        getDecimalPlaces: function(num) {
+            return (num.toString().split('.')[1] || []).length;
+        },
+
         setupModelItems: function() {
             var items = [];
             var answer = this.model.get('_correctAnswer');
@@ -86,7 +93,15 @@ define([
             var end = this.model.get('_scaleEnd');
             var step = this.model.get('_scaleStep') || 1;
 
+            var dp = this.getDecimalPlaces(step);
+
             for (var i = start; i <= end; i += step) {
+                if (dp !== 0) {
+                    // Ensure that steps with decimal places are handled correctly.
+                    i = parseFloat(i.toFixed(dp));
+                }
+
+                // Format number
                 if (answer) {
                     items.push({value: i, selected: false, correct: (i == answer)});
                 } else {
@@ -105,7 +120,7 @@ define([
                     _userAnswer: undefined
                 });
                 return;
-            };
+            }
 
             var items = this.model.get('_items');
             var userAnswer = this.model.get('_userAnswer');
@@ -183,7 +198,7 @@ define([
         getIndexFromValue: function(itemValue) {
             var scaleStart = this.model.get('_scaleStart'),
                 scaleEnd = this.model.get('_scaleEnd');
-            return Math.floor(this.mapValue(itemValue, scaleStart, scaleEnd, 0, this.model.get('_items').length - 1));
+            return Math.round(this.mapValue(itemValue, scaleStart, scaleEnd, 0, this.model.get('_items').length - 1));
         },
 
         // this should set given value to slider handle
@@ -262,12 +277,12 @@ define([
               return;
             }
 
-            var itemValue = parseInt($(event.currentTarget).attr('data-id'));
+            var itemValue = parseFloat($(event.currentTarget).attr('data-id'));
             var index = this.getIndexFromValue(itemValue);
             this.selectItem(index);
             this.animateToPosition(this.mapIndexToPixels(index));
             this.setAltText(itemValue);
-            this.setSliderValue(itemValue)
+            this.setSliderValue(itemValue);
         },
 
         getValueFromIndex: function(index) {
@@ -453,7 +468,7 @@ define([
                     answer += step;
                 }
             } else {
-                console.log("adapt-contrib-slider::WARNING: no correct answer or correct range set in JSON")
+                console.log("adapt-contrib-slider::WARNING: no correct answer or correct range set in JSON");
             }
 
             var middleAnswer = answers[Math.floor(answers.length / 2)];