Skip to content

I
i20rzslider
Commit 271b4967 authored by Valentin Hervieu's avatar Valentin Hervieu Committed by Valentin Hervieu
Browse files
Options

Add a global options method to apply custom default options to all sliders

parent a3aacff3
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 95 additions and 59 deletions
dist/rzslider.js
View file @ 271b4967
...@@ -31,23 +31,47 @@ ...@@ -31,23 +31,47 @@
'use strict'; 'use strict';
var module = angular.module('rzModule', []) var module = angular.module('rzModule', [])
.value('defaultOptions', { .factory('RzSliderOptions', function() {
floor: 0, var defaultOptions = {
ceil: null, //defaults to rz-slider-model floor: 0,
step: 1, ceil: null, //defaults to rz-slider-model
precision: 0, step: 1,
translate: null, precision: 0,
draggableRange: false, translate: null,
showSelectionBar: false, draggableRange: false,
hideLimitLabels: false, showSelectionBar: false,
readOnly: false, hideLimitLabels: false,
disabled: false, readOnly: false,
interval: 350, disabled: false,
showTicks: false, interval: 350,
showTicksValues: false, showTicks: false,
onStart: null, showTicksValues: false,
onChange: null, scale: 1,
onEnd: null onStart: null,
onChange: null,
onEnd: null
};
var globalOptions = {};
var factory = {};
/**
* `options({})` allows global configuration of all sliders in the
* application.
*
* var app = angular.module( 'App', ['rzModule'], function( RzSliderOptions ) {
* // show ticks for all sliders
* RzSliderOptions.options( { showTicks: true } );
* });
*/
factory.options = function(value) {
angular.extend(globalOptions, value);
};
factory.getOptions = function(options) {
return angular.extend({}, defaultOptions, globalOptions, options);
};
return factory;
}) })
.value('throttle', .value('throttle',
...@@ -97,7 +121,7 @@ ...@@ -97,7 +121,7 @@
}; };
}) })
.factory('RzSlider', ['$timeout', '$document', '$window', 'defaultOptions', 'throttle', function($timeout, $document, $window, defaultOptions, throttle) { .factory('RzSlider', ['$timeout', '$document', '$window', 'RzSliderOptions', 'throttle', function($timeout, $document, $window, RzSliderOptions, throttle) {
'use strict'; 'use strict';
/** /**
...@@ -326,14 +350,8 @@ ...@@ -326,14 +350,8 @@
* Read the user options and apply them to the slider model * Read the user options and apply them to the slider model
*/ */
applyOptions: function() { applyOptions: function() {
var userOpts = this.scope.rzSliderOptions; this.options = RzSliderOptions.getOptions(this.scope.rzSliderOptions);
this.options = {};
for (var option_name in defaultOptions) {
if (!userOpts || userOpts[option_name] === undefined)
this.options[option_name] = defaultOptions[option_name];
else
this.options[option_name] = userOpts[option_name];
}
if (this.options.step <= 0) if (this.options.step <= 0)
this.options.step = 1; this.options.step = 1;
this.range = this.scope.rzSliderModel !== undefined && this.scope.rzSliderHigh !== undefined; this.range = this.scope.rzSliderModel !== undefined && this.scope.rzSliderHigh !== undefined;
...@@ -915,7 +933,7 @@ ...@@ -915,7 +933,7 @@
*/ */
getWidth: function(elem) { getWidth: function(elem) {
var val = elem[0].getBoundingClientRect(); var val = elem[0].getBoundingClientRect();
elem.rzsw = val.right - val.left; elem.rzsw = (val.right - val.left) * this.options.scale;
return elem.rzsw; return elem.rzsw;
}, },
...@@ -982,7 +1000,7 @@ ...@@ -982,7 +1000,7 @@
if (!this.range) { if (!this.range) {
return this.minH; return this.minH;
} }
var offset = this.getEventX(event) - this.sliderElem.rzsl - this.handleHalfWidth; var offset = (this.getEventX(event) - this.sliderElem.rzsl - this.handleHalfWidth) * this.options.scale;
return Math.abs(offset - this.minH.rzsl) < Math.abs(offset - this.maxH.rzsl) ? this.minH : this.maxH; return Math.abs(offset - this.minH.rzsl) < Math.abs(offset - this.maxH.rzsl) ? this.minH : this.maxH;
}, },
...@@ -1095,7 +1113,7 @@ ...@@ -1095,7 +1113,7 @@
sliderLO, newOffset, newValue; sliderLO, newOffset, newValue;
sliderLO = this.sliderElem.rzsl; sliderLO = this.sliderElem.rzsl;
newOffset = eventX - sliderLO - this.handleHalfWidth; newOffset = (eventX - sliderLO - this.handleHalfWidth) * this.options.scale;
if (newOffset <= 0) { if (newOffset <= 0) {
if (pointer.rzsl === 0) if (pointer.rzsl === 0)
......
dist/rzslider.min.js
View file @ 271b4967
This diff is collapsed.
src/rzslider.js
View file @ 271b4967
...@@ -31,23 +31,47 @@ ...@@ -31,23 +31,47 @@
'use strict'; 'use strict';
var module = angular.module('rzModule', []) var module = angular.module('rzModule', [])
.value('defaultOptions', { .factory('RzSliderOptions', function() {
floor: 0, var defaultOptions = {
ceil: null, //defaults to rz-slider-model floor: 0,
step: 1, ceil: null, //defaults to rz-slider-model
precision: 0, step: 1,
translate: null, precision: 0,
draggableRange: false, translate: null,
showSelectionBar: false, draggableRange: false,
hideLimitLabels: false, showSelectionBar: false,
readOnly: false, hideLimitLabels: false,
disabled: false, readOnly: false,
interval: 350, disabled: false,
showTicks: false, interval: 350,
showTicksValues: false, showTicks: false,
onStart: null, showTicksValues: false,
onChange: null, scale: 1,
onEnd: null onStart: null,
onChange: null,
onEnd: null
};
var globalOptions = {};
var factory = {};
/**
* `options({})` allows global configuration of all sliders in the
* application.
*
* var app = angular.module( 'App', ['rzModule'], function( RzSliderOptions ) {
* // show ticks for all sliders
* RzSliderOptions.options( { showTicks: true } );
* });
*/
factory.options = function(value) {
angular.extend(globalOptions, value);
};
factory.getOptions = function(options) {
return angular.extend({}, defaultOptions, globalOptions, options);
};
return factory;
}) })
.value('throttle', .value('throttle',
...@@ -97,7 +121,7 @@ ...@@ -97,7 +121,7 @@
}; };
}) })
.factory('RzSlider', function($timeout, $document, $window, defaultOptions, throttle) { .factory('RzSlider', function($timeout, $document, $window, RzSliderOptions, throttle) {
'use strict'; 'use strict';
/** /**
...@@ -326,14 +350,8 @@ ...@@ -326,14 +350,8 @@
* Read the user options and apply them to the slider model * Read the user options and apply them to the slider model
*/ */
applyOptions: function() { applyOptions: function() {
var userOpts = this.scope.rzSliderOptions; this.options = RzSliderOptions.getOptions(this.scope.rzSliderOptions);
this.options = {};
for (var option_name in defaultOptions) {
if (!userOpts || userOpts[option_name] === undefined)
this.options[option_name] = defaultOptions[option_name];
else
this.options[option_name] = userOpts[option_name];
}
if (this.options.step <= 0) if (this.options.step <= 0)
this.options.step = 1; this.options.step = 1;
this.range = this.scope.rzSliderModel !== undefined && this.scope.rzSliderHigh !== undefined; this.range = this.scope.rzSliderModel !== undefined && this.scope.rzSliderHigh !== undefined;
...@@ -915,7 +933,7 @@ ...@@ -915,7 +933,7 @@
*/ */
getWidth: function(elem) { getWidth: function(elem) {
var val = elem[0].getBoundingClientRect(); var val = elem[0].getBoundingClientRect();
elem.rzsw = val.right - val.left; elem.rzsw = (val.right - val.left) * this.options.scale;
return elem.rzsw; return elem.rzsw;
}, },
...@@ -982,7 +1000,7 @@ ...@@ -982,7 +1000,7 @@
if (!this.range) { if (!this.range) {
return this.minH; return this.minH;
} }
var offset = this.getEventX(event) - this.sliderElem.rzsl - this.handleHalfWidth; var offset = (this.getEventX(event) - this.sliderElem.rzsl - this.handleHalfWidth) * this.options.scale;
return Math.abs(offset - this.minH.rzsl) < Math.abs(offset - this.maxH.rzsl) ? this.minH : this.maxH; return Math.abs(offset - this.minH.rzsl) < Math.abs(offset - this.maxH.rzsl) ? this.minH : this.maxH;
}, },
...@@ -1095,7 +1113,7 @@ ...@@ -1095,7 +1113,7 @@
sliderLO, newOffset, newValue; sliderLO, newOffset, newValue;
sliderLO = this.sliderElem.rzsl; sliderLO = this.sliderElem.rzsl;
newOffset = eventX - sliderLO - this.handleHalfWidth; newOffset = (eventX - sliderLO - this.handleHalfWidth) * this.options.scale;
if (newOffset <= 0) { if (newOffset <= 0) {
if (pointer.rzsl === 0) if (pointer.rzsl === 0)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment