1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/dom/tests/mochitest/ajax/scriptaculous/src/slider.js Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,277 @@
1.4 +// script.aculo.us slider.js v1.7.1_beta2, Tue May 15 15:15:45 EDT 2007
1.5 +
1.6 +// Copyright (c) 2005-2007 Marty Haught, Thomas Fuchs
1.7 +//
1.8 +// script.aculo.us is freely distributable under the terms of an MIT-style license.
1.9 +// For details, see the script.aculo.us web site: http://script.aculo.us/
1.10 +
1.11 +if(!Control) var Control = {};
1.12 +Control.Slider = Class.create();
1.13 +
1.14 +// options:
1.15 +// axis: 'vertical', or 'horizontal' (default)
1.16 +//
1.17 +// callbacks:
1.18 +// onChange(value)
1.19 +// onSlide(value)
1.20 +Control.Slider.prototype = {
1.21 + initialize: function(handle, track, options) {
1.22 + var slider = this;
1.23 +
1.24 + if(handle instanceof Array) {
1.25 + this.handles = handle.collect( function(e) { return $(e) });
1.26 + } else {
1.27 + this.handles = [$(handle)];
1.28 + }
1.29 +
1.30 + this.track = $(track);
1.31 + this.options = options || {};
1.32 +
1.33 + this.axis = this.options.axis || 'horizontal';
1.34 + this.increment = this.options.increment || 1;
1.35 + this.step = parseInt(this.options.step || '1');
1.36 + this.range = this.options.range || $R(0,1);
1.37 +
1.38 + this.value = 0; // assure backwards compat
1.39 + this.values = this.handles.map( function() { return 0 });
1.40 + this.spans = this.options.spans ? this.options.spans.map(function(s){ return $(s) }) : false;
1.41 + this.options.startSpan = $(this.options.startSpan || null);
1.42 + this.options.endSpan = $(this.options.endSpan || null);
1.43 +
1.44 + this.restricted = this.options.restricted || false;
1.45 +
1.46 + this.maximum = this.options.maximum || this.range.end;
1.47 + this.minimum = this.options.minimum || this.range.start;
1.48 +
1.49 + // Will be used to align the handle onto the track, if necessary
1.50 + this.alignX = parseInt(this.options.alignX || '0');
1.51 + this.alignY = parseInt(this.options.alignY || '0');
1.52 +
1.53 + this.trackLength = this.maximumOffset() - this.minimumOffset();
1.54 +
1.55 + this.handleLength = this.isVertical() ?
1.56 + (this.handles[0].offsetHeight != 0 ?
1.57 + this.handles[0].offsetHeight : this.handles[0].style.height.replace(/px$/,"")) :
1.58 + (this.handles[0].offsetWidth != 0 ? this.handles[0].offsetWidth :
1.59 + this.handles[0].style.width.replace(/px$/,""));
1.60 +
1.61 + this.active = false;
1.62 + this.dragging = false;
1.63 + this.disabled = false;
1.64 +
1.65 + if(this.options.disabled) this.setDisabled();
1.66 +
1.67 + // Allowed values array
1.68 + this.allowedValues = this.options.values ? this.options.values.sortBy(Prototype.K) : false;
1.69 + if(this.allowedValues) {
1.70 + this.minimum = this.allowedValues.min();
1.71 + this.maximum = this.allowedValues.max();
1.72 + }
1.73 +
1.74 + this.eventMouseDown = this.startDrag.bindAsEventListener(this);
1.75 + this.eventMouseUp = this.endDrag.bindAsEventListener(this);
1.76 + this.eventMouseMove = this.update.bindAsEventListener(this);
1.77 +
1.78 + // Initialize handles in reverse (make sure first handle is active)
1.79 + this.handles.each( function(h,i) {
1.80 + i = slider.handles.length-1-i;
1.81 + slider.setValue(parseFloat(
1.82 + (slider.options.sliderValue instanceof Array ?
1.83 + slider.options.sliderValue[i] : slider.options.sliderValue) ||
1.84 + slider.range.start), i);
1.85 + Element.makePositioned(h); // fix IE
1.86 + Event.observe(h, "mousedown", slider.eventMouseDown);
1.87 + });
1.88 +
1.89 + Event.observe(this.track, "mousedown", this.eventMouseDown);
1.90 + Event.observe(document, "mouseup", this.eventMouseUp);
1.91 + Event.observe(document, "mousemove", this.eventMouseMove);
1.92 +
1.93 + this.initialized = true;
1.94 + },
1.95 + dispose: function() {
1.96 + var slider = this;
1.97 + Event.stopObserving(this.track, "mousedown", this.eventMouseDown);
1.98 + Event.stopObserving(document, "mouseup", this.eventMouseUp);
1.99 + Event.stopObserving(document, "mousemove", this.eventMouseMove);
1.100 + this.handles.each( function(h) {
1.101 + Event.stopObserving(h, "mousedown", slider.eventMouseDown);
1.102 + });
1.103 + },
1.104 + setDisabled: function(){
1.105 + this.disabled = true;
1.106 + },
1.107 + setEnabled: function(){
1.108 + this.disabled = false;
1.109 + },
1.110 + getNearestValue: function(value){
1.111 + if(this.allowedValues){
1.112 + if(value >= this.allowedValues.max()) return(this.allowedValues.max());
1.113 + if(value <= this.allowedValues.min()) return(this.allowedValues.min());
1.114 +
1.115 + var offset = Math.abs(this.allowedValues[0] - value);
1.116 + var newValue = this.allowedValues[0];
1.117 + this.allowedValues.each( function(v) {
1.118 + var currentOffset = Math.abs(v - value);
1.119 + if(currentOffset <= offset){
1.120 + newValue = v;
1.121 + offset = currentOffset;
1.122 + }
1.123 + });
1.124 + return newValue;
1.125 + }
1.126 + if(value > this.range.end) return this.range.end;
1.127 + if(value < this.range.start) return this.range.start;
1.128 + return value;
1.129 + },
1.130 + setValue: function(sliderValue, handleIdx){
1.131 + if(!this.active) {
1.132 + this.activeHandleIdx = handleIdx || 0;
1.133 + this.activeHandle = this.handles[this.activeHandleIdx];
1.134 + this.updateStyles();
1.135 + }
1.136 + handleIdx = handleIdx || this.activeHandleIdx || 0;
1.137 + if(this.initialized && this.restricted) {
1.138 + if((handleIdx>0) && (sliderValue<this.values[handleIdx-1]))
1.139 + sliderValue = this.values[handleIdx-1];
1.140 + if((handleIdx < (this.handles.length-1)) && (sliderValue>this.values[handleIdx+1]))
1.141 + sliderValue = this.values[handleIdx+1];
1.142 + }
1.143 + sliderValue = this.getNearestValue(sliderValue);
1.144 + this.values[handleIdx] = sliderValue;
1.145 + this.value = this.values[0]; // assure backwards compat
1.146 +
1.147 + this.handles[handleIdx].style[this.isVertical() ? 'top' : 'left'] =
1.148 + this.translateToPx(sliderValue);
1.149 +
1.150 + this.drawSpans();
1.151 + if(!this.dragging || !this.event) this.updateFinished();
1.152 + },
1.153 + setValueBy: function(delta, handleIdx) {
1.154 + this.setValue(this.values[handleIdx || this.activeHandleIdx || 0] + delta,
1.155 + handleIdx || this.activeHandleIdx || 0);
1.156 + },
1.157 + translateToPx: function(value) {
1.158 + return Math.round(
1.159 + ((this.trackLength-this.handleLength)/(this.range.end-this.range.start)) *
1.160 + (value - this.range.start)) + "px";
1.161 + },
1.162 + translateToValue: function(offset) {
1.163 + return ((offset/(this.trackLength-this.handleLength) *
1.164 + (this.range.end-this.range.start)) + this.range.start);
1.165 + },
1.166 + getRange: function(range) {
1.167 + var v = this.values.sortBy(Prototype.K);
1.168 + range = range || 0;
1.169 + return $R(v[range],v[range+1]);
1.170 + },
1.171 + minimumOffset: function(){
1.172 + return(this.isVertical() ? this.alignY : this.alignX);
1.173 + },
1.174 + maximumOffset: function(){
1.175 + return(this.isVertical() ?
1.176 + (this.track.offsetHeight != 0 ? this.track.offsetHeight :
1.177 + this.track.style.height.replace(/px$/,"")) - this.alignY :
1.178 + (this.track.offsetWidth != 0 ? this.track.offsetWidth :
1.179 + this.track.style.width.replace(/px$/,"")) - this.alignY);
1.180 + },
1.181 + isVertical: function(){
1.182 + return (this.axis == 'vertical');
1.183 + },
1.184 + drawSpans: function() {
1.185 + var slider = this;
1.186 + if(this.spans)
1.187 + $R(0, this.spans.length-1).each(function(r) { slider.setSpan(slider.spans[r], slider.getRange(r)) });
1.188 + if(this.options.startSpan)
1.189 + this.setSpan(this.options.startSpan,
1.190 + $R(0, this.values.length>1 ? this.getRange(0).min() : this.value ));
1.191 + if(this.options.endSpan)
1.192 + this.setSpan(this.options.endSpan,
1.193 + $R(this.values.length>1 ? this.getRange(this.spans.length-1).max() : this.value, this.maximum));
1.194 + },
1.195 + setSpan: function(span, range) {
1.196 + if(this.isVertical()) {
1.197 + span.style.top = this.translateToPx(range.start);
1.198 + span.style.height = this.translateToPx(range.end - range.start + this.range.start);
1.199 + } else {
1.200 + span.style.left = this.translateToPx(range.start);
1.201 + span.style.width = this.translateToPx(range.end - range.start + this.range.start);
1.202 + }
1.203 + },
1.204 + updateStyles: function() {
1.205 + this.handles.each( function(h){ Element.removeClassName(h, 'selected') });
1.206 + Element.addClassName(this.activeHandle, 'selected');
1.207 + },
1.208 + startDrag: function(event) {
1.209 + if(Event.isLeftClick(event)) {
1.210 + if(!this.disabled){
1.211 + this.active = true;
1.212 +
1.213 + var handle = Event.element(event);
1.214 + var pointer = [Event.pointerX(event), Event.pointerY(event)];
1.215 + var track = handle;
1.216 + if(track==this.track) {
1.217 + var offsets = Position.cumulativeOffset(this.track);
1.218 + this.event = event;
1.219 + this.setValue(this.translateToValue(
1.220 + (this.isVertical() ? pointer[1]-offsets[1] : pointer[0]-offsets[0])-(this.handleLength/2)
1.221 + ));
1.222 + var offsets = Position.cumulativeOffset(this.activeHandle);
1.223 + this.offsetX = (pointer[0] - offsets[0]);
1.224 + this.offsetY = (pointer[1] - offsets[1]);
1.225 + } else {
1.226 + // find the handle (prevents issues with Safari)
1.227 + while((this.handles.indexOf(handle) == -1) && handle.parentNode)
1.228 + handle = handle.parentNode;
1.229 +
1.230 + if(this.handles.indexOf(handle)!=-1) {
1.231 + this.activeHandle = handle;
1.232 + this.activeHandleIdx = this.handles.indexOf(this.activeHandle);
1.233 + this.updateStyles();
1.234 +
1.235 + var offsets = Position.cumulativeOffset(this.activeHandle);
1.236 + this.offsetX = (pointer[0] - offsets[0]);
1.237 + this.offsetY = (pointer[1] - offsets[1]);
1.238 + }
1.239 + }
1.240 + }
1.241 + Event.stop(event);
1.242 + }
1.243 + },
1.244 + update: function(event) {
1.245 + if(this.active) {
1.246 + if(!this.dragging) this.dragging = true;
1.247 + this.draw(event);
1.248 + if(Prototype.Browser.WebKit) window.scrollBy(0,0);
1.249 + Event.stop(event);
1.250 + }
1.251 + },
1.252 + draw: function(event) {
1.253 + var pointer = [Event.pointerX(event), Event.pointerY(event)];
1.254 + var offsets = Position.cumulativeOffset(this.track);
1.255 + pointer[0] -= this.offsetX + offsets[0];
1.256 + pointer[1] -= this.offsetY + offsets[1];
1.257 + this.event = event;
1.258 + this.setValue(this.translateToValue( this.isVertical() ? pointer[1] : pointer[0] ));
1.259 + if(this.initialized && this.options.onSlide)
1.260 + this.options.onSlide(this.values.length>1 ? this.values : this.value, this);
1.261 + },
1.262 + endDrag: function(event) {
1.263 + if(this.active && this.dragging) {
1.264 + this.finishDrag(event, true);
1.265 + Event.stop(event);
1.266 + }
1.267 + this.active = false;
1.268 + this.dragging = false;
1.269 + },
1.270 + finishDrag: function(event, success) {
1.271 + this.active = false;
1.272 + this.dragging = false;
1.273 + this.updateFinished();
1.274 + },
1.275 + updateFinished: function() {
1.276 + if(this.initialized && this.options.onChange)
1.277 + this.options.onChange(this.values.length>1 ? this.values : this.value, this);
1.278 + this.event = null;
1.279 + }
1.280 +}
1.281 \ No newline at end of file
