diff --git a/dist/Handles.mpk b/dist/Handles.mpk
index b6e0c61..ee7c399 100644
Binary files a/dist/Handles.mpk and b/dist/Handles.mpk differ
diff --git a/node_modules/grunt-newer/.cache/copy/deployment/timestamp b/node_modules/grunt-newer/.cache/copy/deployment/timestamp
index 5e88c32..6652d94 100644
--- a/node_modules/grunt-newer/.cache/copy/deployment/timestamp
+++ b/node_modules/grunt-newer/.cache/copy/deployment/timestamp
@@ -1 +1 @@
-1478036213563
\ No newline at end of file
+1479244894805
\ No newline at end of file
diff --git a/node_modules/grunt-newer/.cache/copy/mpks/timestamp b/node_modules/grunt-newer/.cache/copy/mpks/timestamp
index 36a220a..f1aaf15 100644
--- a/node_modules/grunt-newer/.cache/copy/mpks/timestamp
+++ b/node_modules/grunt-newer/.cache/copy/mpks/timestamp
@@ -1 +1 @@
-1478036213599
\ No newline at end of file
+1479244894825
\ No newline at end of file
diff --git a/src/Handles/Handles.xml b/src/Handles/Handles.xml
index c899ecf..5c3ca64 100644
--- a/src/Handles/Handles.xml
+++ b/src/Handles/Handles.xml
@@ -1,7 +1,7 @@
Handles
- The description of this widget.
+ Slider with two (or more handles)
The size of the interval between slider steps.
- Lower Handle
+ Lower Handle Attribute
Slider Settings
Entity Attribute (decimal) coupled with the lower handle of the slider.
@@ -30,12 +30,60 @@
- Upper Handle
+ Upper Handle Attribute
Slider Settings
Entity Attribute (decimal) coupled with the upper handle of the slider.
+
+ Display Value Labels
+ Slider Settings
+ Set true to display the handle's value in a label.
+
+
+ Direction
+ Slider Settings
+ Configure the slider to increase left-to-right/top-to-bottom or right-to-left/bottom-to-top.
+
+ Left-to-right / Top-to-bottom
+ Right-to-left / Bottom-to-top
+
+
+
+ Orientation
+ Slider Settings
+ Configure the orientation of the slider.
+If Vertical, be sure to select the correct Direction value for your purposes.
+Also if Vertical, height must be manually set in the widget css (class .noUi-vertical)
+
+ Horizontal
+ Vertical
+
+
+
+
+ Enforce Minimum Range
+ Advanced Settings
+ Set true to enforce a minimum size for the range between handles
+
+
+ Minimum Range
+ Advanced Settings
+ Size of the minimum range; takes effect only if Enforce Minimum Range is true.
+
+
+ Enforce Maximum Range
+ Advanced Settings
+ Set true to enforce a maximum size for the range between handles
+
+
+ Maximum Range
+ Advanced Settings
+ Size of the maximum range; takes effect only if Enforce Maximum Range is true.
+
+
+
diff --git a/src/Handles/widget/Handles.js b/src/Handles/widget/Handles.js
index b5bc0be..4d42147 100644
--- a/src/Handles/widget/Handles.js
+++ b/src/Handles/widget/Handles.js
@@ -33,10 +33,14 @@ define([
"dojo/text",
"dojo/html",
"dojo/_base/event",
+ "dojo/query",
"Handles/lib/nouislider",
"dojo/text!Handles/widget/template/Handles.html"
], function (declare, _WidgetBase, _TemplatedMixin, dom, dojoDom, dojoProp, dojoGeometry, dojoClass, dojoStyle, dojoConstruct, dojoArray, dojoLang, dojoText, dojoHtml, dojoEvent,
+
+ dojoQuery,
+
noUiSlider, widgetTemplate) {
"use strict";
@@ -54,12 +58,21 @@ define([
sliderStep : "",
handleAttr0 : "",
handleAttr1 : "",
+ testProperty : "",
+ enforceMargin : false,
+ marginSize : null,
+ enforceLimit : false,
+ limitSize : null,
+ direction : "",
+ orientation : "",
+ toolTips : false,
// Internal variables. Non-primitives created in the prototype are shared between all widget instances.
_handles: null,
_contextObj: null,
_alertDiv: null,
_readOnly: false,
+ _sliderSettings: null,
// dojo.declare.constructor is called to construct the widget instance. Implement to initialize non-primitive properties.
constructor: function () {
@@ -71,13 +84,22 @@ define([
postCreate: function () {
logger.debug(this.id + ".postCreate");
+ this._sliderSettings = {
+ start: [this.sliderMax * 0.25, this.sliderMax * 0.75],
+ step: this.sliderStep,
+ connect: true,
+ range: { 'min': this.sliderMin, 'max': this.sliderMax },
+ behaviour: 'drag-tap'
+ };
+
this._updateRendering();
- noUiSlider.create(this.domTarget, {
- start: [this.sliderMax * 0.25, this.sliderMax * 0.75],
- step: this.sliderStep,
- connect: true,
- range: { 'min': this.sliderMin, 'max': this.sliderMax }
- });
+
+ this._setDirectionAndOrientation();
+ this._setMarginAndLimit();
+ this._toggleTooltips();
+ this._buildPips();
+
+ noUiSlider.create(this.domTarget, this._sliderSettings);
this._setupEvents();
},
@@ -92,7 +114,7 @@ define([
if(this._contextObj.get(this.handleAttr0) == 0 && this._contextObj.get(this.handleAttr1) == 0) {
this._contextObj.set(this.handleAttr0, this.domTarget.noUiSlider.get()[0]);
- this._contextObj.set(this.handleAttr1, this.domTarget.noUiSlider.get()[1]);
+ this._contextObj.set(this.handleAttr1, this.domTarget.noUiSlider.get()[1]);
} else {
this.domTarget.noUiSlider.set( [this._contextObj.get(this.handleAttr0), this._contextObj.get(this.handleAttr1)] );
}
@@ -132,7 +154,6 @@ define([
logger.debug(this.id + "._setupEvents");
var self = this;
self.domTarget.noUiSlider.on('slide', function() {
- console.log("listener is firing");
self._contextObj.set(self.handleAttr0, self.domTarget.noUiSlider.get()[0]);
self._contextObj.set(self.handleAttr1, self.domTarget.noUiSlider.get()[1]);
});
@@ -225,7 +246,49 @@ define([
this._handles = [ objectHandle, attrHandle, validationHandle ];
}
+ },
+
+ // Set the direction and orientation of the sliderMin
+ _setDirectionAndOrientation: function() {
+ console.log('set direction and orientation');
+ if (this.direction == 'rtl') {
+ this._sliderSettings.direction = this.direction
+ };
+ if (this.orientation == 'vertical') {
+ this._sliderSettings.orientation = this.orientation
+ };
+ },
+
+ // Set the margin and limit (minimum and maximum separation between handles)
+ _setMarginAndLimit: function() {
+ console.log('set margin...')
+ if ( (this.enforceMargin && this.marginSize != null) ) {
+ this._sliderSettings.margin = this.marginSize
+ };
+ if ( (this.enforceLimit && this.limitSize != null) ) {
+ this._sliderSettings.limit = this.limitSize
+ };
+ },
+
+ // Toogle display of values on the handles
+ _toggleTooltips: function() {
+ console.log('set tool tips...')
+ if ( (this.toolTips) ) {
+ this._sliderSettings.tooltips = [true, true];
+ }
+ },
+
+ // If steps are >= 25% of the range, render pips
+ _buildPips: function() {
+ console.log('build pips...')
+ if ( (this.sliderMax-this.sliderMin) / this.sliderStep <= 4 ) {
+ this._sliderSettings.pips = {
+ mode: 'steps', density: this.sliderStep
+ }
+ }
}
+
+
});
});
diff --git a/src/Handles/widget/ui/Handles.css b/src/Handles/widget/ui/Handles.css
index 5b22adb..b49b7f3 100644
--- a/src/Handles/widget/ui/Handles.css
+++ b/src/Handles/widget/ui/Handles.css
@@ -92,6 +92,7 @@
}
.noUi-vertical {
width: 18px;
+ height: 400px;
}
.noUi-vertical .noUi-handle {
width: 28px;
diff --git a/test/Test.mpr b/test/Test.mpr
index fffa8ca..f460f6a 100644
Binary files a/test/Test.mpr and b/test/Test.mpr differ
diff --git a/test/deployment/build_core.xml b/test/deployment/build_core.xml
index 4f06989..ea0a67d 100644
--- a/test/deployment/build_core.xml
+++ b/test/deployment/build_core.xml
@@ -1,5 +1,5 @@
-
+
Ant buildfile for deployment. Generated by the Mendix Business Modeler.
Mendix 5
@@ -17,11 +17,11 @@
isDebug: true,
useCustomLogger: true,
baseUrl: "mxclientsystem/dojo/",
- cacheBust: "636136186170567001",
+ cacheBust: "636148207702740555",
ltrRedirect: "index-console.html"
};
-
-
+
+