Changed nouislider

Changed to one slider handle
Changed default value to middle of range
Added step option
Added slider value tooltip
Added scale

Author: MrKrabat

src/nouislider.js

@@ -15,43 +15,33 @@ function init(Survey) {
     activatedByChanged: function(activatedBy) {
       Survey.JsonObject.metaData.addClass("nouislider", [], null, "empty");
       Survey.JsonObject.metaData.addProperties("nouislider", [
+        {
+          name: "step:number",
+          default: 1
+        },
         {
           name: "rangeMin:number",
           default: 0
         },
         {
           name: "rangeMax:number",
           default: 100
-        },
-        {
-          name: "defaultRangeMin:number",
-          default: 30
-        },
-        {
-          name: "defaultRangeMax:number",
-          default: 70
         }
       ]);
     },
     afterRender: function(question, el) {
-      var startValue = question.value;
-      if (!startValue || startValue.length != 2) {
-        startValue = [question.defaultRangeMin, question.defaultRangeMax];
-      }
-      if (startValue[0] < question.rangeMin) startValue[0] = question.rangeMin;
-      if (startValue[0] > question.rangeMax) startValue[0] = question.rangeMax;
-      if (startValue[1] < startValue[0]) startValue[1] = startValue[0];
-      if (startValue[1] > question.rangeMax) startValue[1] = question.rangeMax;
-      question.value = startValue;
+      question.value = (question.rangeMin+question.rangeMax)/2;
 
       el.style.marginBottom = "50px";
       var slider = noUiSlider.create(el, {
-        start: startValue,
-        connect: true,
+        start: question.value,
+        connect: [true, false],
+        step: question.step,
+        tooltips: true,
         pips: {
-          mode: "steps",
-          stepped: true,
-          density: 4
+          mode: "positions",
+          values: [0,25,50,75,100],
+          density: 5
         },
         range: {
           min: question.rangeMin,