Projet

Général

Profil

Paste
Télécharger (17,7 ko) Statistiques
| Branche: | Révision:

root / drupal7 / sites / all / modules / jquery_update / replace / ui / ui / jquery.ui.slider.js @ 503b3f7b

1
/*!
2
 * jQuery UI Slider 1.10.2
3
 * http://jqueryui.com
4
 *
5
 * Copyright 2013 jQuery Foundation and other contributors
6
 * Released under the MIT license.
7
 * http://jquery.org/license
8
 *
9
 * http://api.jqueryui.com/slider/
10
 *
11
 * Depends:
12
 *        jquery.ui.core.js
13
 *        jquery.ui.mouse.js
14
 *        jquery.ui.widget.js
15
 */
16
(function( $, undefined ) {
17

    
18
// number of pages in a slider
19
// (how many times can you page up/down to go through the whole range)
20
var numPages = 5;
21

    
22
$.widget( "ui.slider", $.ui.mouse, {
23
        version: "1.10.2",
24
        widgetEventPrefix: "slide",
25

    
26
        options: {
27
                animate: false,
28
                distance: 0,
29
                max: 100,
30
                min: 0,
31
                orientation: "horizontal",
32
                range: false,
33
                step: 1,
34
                value: 0,
35
                values: null,
36

    
37
                // callbacks
38
                change: null,
39
                slide: null,
40
                start: null,
41
                stop: null
42
        },
43

    
44
        _create: function() {
45
                this._keySliding = false;
46
                this._mouseSliding = false;
47
                this._animateOff = true;
48
                this._handleIndex = null;
49
                this._detectOrientation();
50
                this._mouseInit();
51

    
52
                this.element
53
                        .addClass( "ui-slider" +
54
                                " ui-slider-" + this.orientation +
55
                                " ui-widget" +
56
                                " ui-widget-content" +
57
                                " ui-corner-all");
58

    
59
                this._refresh();
60
                this._setOption( "disabled", this.options.disabled );
61

    
62
                this._animateOff = false;
63
        },
64

    
65
        _refresh: function() {
66
                this._createRange();
67
                this._createHandles();
68
                this._setupEvents();
69
                this._refreshValue();
70
        },
71

    
72
        _createHandles: function() {
73
                var i, handleCount,
74
                        options = this.options,
75
                        existingHandles = this.element.find( ".ui-slider-handle" ).addClass( "ui-state-default ui-corner-all" ),
76
                        handle = "<a class='ui-slider-handle ui-state-default ui-corner-all' href='#'></a>",
77
                        handles = [];
78

    
79
                handleCount = ( options.values && options.values.length ) || 1;
80

    
81
                if ( existingHandles.length > handleCount ) {
82
                        existingHandles.slice( handleCount ).remove();
83
                        existingHandles = existingHandles.slice( 0, handleCount );
84
                }
85

    
86
                for ( i = existingHandles.length; i < handleCount; i++ ) {
87
                        handles.push( handle );
88
                }
89

    
90
                this.handles = existingHandles.add( $( handles.join( "" ) ).appendTo( this.element ) );
91

    
92
                this.handle = this.handles.eq( 0 );
93

    
94
                this.handles.each(function( i ) {
95
                        $( this ).data( "ui-slider-handle-index", i );
96
                });
97
        },
98

    
99
        _createRange: function() {
100
                var options = this.options,
101
                        classes = "";
102

    
103
                if ( options.range ) {
104
                        if ( options.range === true ) {
105
                                if ( !options.values ) {
106
                                        options.values = [ this._valueMin(), this._valueMin() ];
107
                                } else if ( options.values.length && options.values.length !== 2 ) {
108
                                        options.values = [ options.values[0], options.values[0] ];
109
                                } else if ( $.isArray( options.values ) ) {
110
                                        options.values = options.values.slice(0);
111
                                }
112
                        }
113

    
114
                        if ( !this.range || !this.range.length ) {
115
                                this.range = $( "<div></div>" )
116
                                        .appendTo( this.element );
117

    
118
                                classes = "ui-slider-range" +
119
                                // note: this isn't the most fittingly semantic framework class for this element,
120
                                // but worked best visually with a variety of themes
121
                                " ui-widget-header ui-corner-all";
122
                        } else {
123
                                this.range.removeClass( "ui-slider-range-min ui-slider-range-max" )
124
                                        // Handle range switching from true to min/max
125
                                        .css({
126
                                                "left": "",
127
                                                "bottom": ""
128
                                        });
129
                        }
130

    
131
                        this.range.addClass( classes +
132
                                ( ( options.range === "min" || options.range === "max" ) ? " ui-slider-range-" + options.range : "" ) );
133
                } else {
134
                        this.range = $([]);
135
                }
136
        },
137

    
138
        _setupEvents: function() {
139
                var elements = this.handles.add( this.range ).filter( "a" );
140
                this._off( elements );
141
                this._on( elements, this._handleEvents );
142
                this._hoverable( elements );
143
                this._focusable( elements );
144
        },
145

    
146
        _destroy: function() {
147
                this.handles.remove();
148
                this.range.remove();
149

    
150
                this.element
151
                        .removeClass( "ui-slider" +
152
                                " ui-slider-horizontal" +
153
                                " ui-slider-vertical" +
154
                                " ui-widget" +
155
                                " ui-widget-content" +
156
                                " ui-corner-all" );
157

    
158
                this._mouseDestroy();
159
        },
160

    
161
        _mouseCapture: function( event ) {
162
                var position, normValue, distance, closestHandle, index, allowed, offset, mouseOverHandle,
163
                        that = this,
164
                        o = this.options;
165

    
166
                if ( o.disabled ) {
167
                        return false;
168
                }
169

    
170
                this.elementSize = {
171
                        width: this.element.outerWidth(),
172
                        height: this.element.outerHeight()
173
                };
174
                this.elementOffset = this.element.offset();
175

    
176
                position = { x: event.pageX, y: event.pageY };
177
                normValue = this._normValueFromMouse( position );
178
                distance = this._valueMax() - this._valueMin() + 1;
179
                this.handles.each(function( i ) {
180
                        var thisDistance = Math.abs( normValue - that.values(i) );
181
                        if (( distance > thisDistance ) ||
182
                                ( distance === thisDistance &&
183
                                        (i === that._lastChangedValue || that.values(i) === o.min ))) {
184
                                distance = thisDistance;
185
                                closestHandle = $( this );
186
                                index = i;
187
                        }
188
                });
189

    
190
                allowed = this._start( event, index );
191
                if ( allowed === false ) {
192
                        return false;
193
                }
194
                this._mouseSliding = true;
195

    
196
                this._handleIndex = index;
197

    
198
                closestHandle
199
                        .addClass( "ui-state-active" )
200
                        .focus();
201

    
202
                offset = closestHandle.offset();
203
                mouseOverHandle = !$( event.target ).parents().addBack().is( ".ui-slider-handle" );
204
                this._clickOffset = mouseOverHandle ? { left: 0, top: 0 } : {
205
                        left: event.pageX - offset.left - ( closestHandle.width() / 2 ),
206
                        top: event.pageY - offset.top -
207
                                ( closestHandle.height() / 2 ) -
208
                                ( parseInt( closestHandle.css("borderTopWidth"), 10 ) || 0 ) -
209
                                ( parseInt( closestHandle.css("borderBottomWidth"), 10 ) || 0) +
210
                                ( parseInt( closestHandle.css("marginTop"), 10 ) || 0)
211
                };
212

    
213
                if ( !this.handles.hasClass( "ui-state-hover" ) ) {
214
                        this._slide( event, index, normValue );
215
                }
216
                this._animateOff = true;
217
                return true;
218
        },
219

    
220
        _mouseStart: function() {
221
                return true;
222
        },
223

    
224
        _mouseDrag: function( event ) {
225
                var position = { x: event.pageX, y: event.pageY },
226
                        normValue = this._normValueFromMouse( position );
227

    
228
                this._slide( event, this._handleIndex, normValue );
229

    
230
                return false;
231
        },
232

    
233
        _mouseStop: function( event ) {
234
                this.handles.removeClass( "ui-state-active" );
235
                this._mouseSliding = false;
236

    
237
                this._stop( event, this._handleIndex );
238
                this._change( event, this._handleIndex );
239

    
240
                this._handleIndex = null;
241
                this._clickOffset = null;
242
                this._animateOff = false;
243

    
244
                return false;
245
        },
246

    
247
        _detectOrientation: function() {
248
                this.orientation = ( this.options.orientation === "vertical" ) ? "vertical" : "horizontal";
249
        },
250

    
251
        _normValueFromMouse: function( position ) {
252
                var pixelTotal,
253
                        pixelMouse,
254
                        percentMouse,
255
                        valueTotal,
256
                        valueMouse;
257

    
258
                if ( this.orientation === "horizontal" ) {
259
                        pixelTotal = this.elementSize.width;
260
                        pixelMouse = position.x - this.elementOffset.left - ( this._clickOffset ? this._clickOffset.left : 0 );
261
                } else {
262
                        pixelTotal = this.elementSize.height;
263
                        pixelMouse = position.y - this.elementOffset.top - ( this._clickOffset ? this._clickOffset.top : 0 );
264
                }
265

    
266
                percentMouse = ( pixelMouse / pixelTotal );
267
                if ( percentMouse > 1 ) {
268
                        percentMouse = 1;
269
                }
270
                if ( percentMouse < 0 ) {
271
                        percentMouse = 0;
272
                }
273
                if ( this.orientation === "vertical" ) {
274
                        percentMouse = 1 - percentMouse;
275
                }
276

    
277
                valueTotal = this._valueMax() - this._valueMin();
278
                valueMouse = this._valueMin() + percentMouse * valueTotal;
279

    
280
                return this._trimAlignValue( valueMouse );
281
        },
282

    
283
        _start: function( event, index ) {
284
                var uiHash = {
285
                        handle: this.handles[ index ],
286
                        value: this.value()
287
                };
288
                if ( this.options.values && this.options.values.length ) {
289
                        uiHash.value = this.values( index );
290
                        uiHash.values = this.values();
291
                }
292
                return this._trigger( "start", event, uiHash );
293
        },
294

    
295
        _slide: function( event, index, newVal ) {
296
                var otherVal,
297
                        newValues,
298
                        allowed;
299

    
300
                if ( this.options.values && this.options.values.length ) {
301
                        otherVal = this.values( index ? 0 : 1 );
302

    
303
                        if ( ( this.options.values.length === 2 && this.options.range === true ) &&
304
                                        ( ( index === 0 && newVal > otherVal) || ( index === 1 && newVal < otherVal ) )
305
                                ) {
306
                                newVal = otherVal;
307
                        }
308

    
309
                        if ( newVal !== this.values( index ) ) {
310
                                newValues = this.values();
311
                                newValues[ index ] = newVal;
312
                                // A slide can be canceled by returning false from the slide callback
313
                                allowed = this._trigger( "slide", event, {
314
                                        handle: this.handles[ index ],
315
                                        value: newVal,
316
                                        values: newValues
317
                                } );
318
                                otherVal = this.values( index ? 0 : 1 );
319
                                if ( allowed !== false ) {
320
                                        this.values( index, newVal, true );
321
                                }
322
                        }
323
                } else {
324
                        if ( newVal !== this.value() ) {
325
                                // A slide can be canceled by returning false from the slide callback
326
                                allowed = this._trigger( "slide", event, {
327
                                        handle: this.handles[ index ],
328
                                        value: newVal
329
                                } );
330
                                if ( allowed !== false ) {
331
                                        this.value( newVal );
332
                                }
333
                        }
334
                }
335
        },
336

    
337
        _stop: function( event, index ) {
338
                var uiHash = {
339
                        handle: this.handles[ index ],
340
                        value: this.value()
341
                };
342
                if ( this.options.values && this.options.values.length ) {
343
                        uiHash.value = this.values( index );
344
                        uiHash.values = this.values();
345
                }
346

    
347
                this._trigger( "stop", event, uiHash );
348
        },
349

    
350
        _change: function( event, index ) {
351
                if ( !this._keySliding && !this._mouseSliding ) {
352
                        var uiHash = {
353
                                handle: this.handles[ index ],
354
                                value: this.value()
355
                        };
356
                        if ( this.options.values && this.options.values.length ) {
357
                                uiHash.value = this.values( index );
358
                                uiHash.values = this.values();
359
                        }
360

    
361
                        //store the last changed value index for reference when handles overlap
362
                        this._lastChangedValue = index;
363

    
364
                        this._trigger( "change", event, uiHash );
365
                }
366
        },
367

    
368
        value: function( newValue ) {
369
                if ( arguments.length ) {
370
                        this.options.value = this._trimAlignValue( newValue );
371
                        this._refreshValue();
372
                        this._change( null, 0 );
373
                        return;
374
                }
375

    
376
                return this._value();
377
        },
378

    
379
        values: function( index, newValue ) {
380
                var vals,
381
                        newValues,
382
                        i;
383

    
384
                if ( arguments.length > 1 ) {
385
                        this.options.values[ index ] = this._trimAlignValue( newValue );
386
                        this._refreshValue();
387
                        this._change( null, index );
388
                        return;
389
                }
390

    
391
                if ( arguments.length ) {
392
                        if ( $.isArray( arguments[ 0 ] ) ) {
393
                                vals = this.options.values;
394
                                newValues = arguments[ 0 ];
395
                                for ( i = 0; i < vals.length; i += 1 ) {
396
                                        vals[ i ] = this._trimAlignValue( newValues[ i ] );
397
                                        this._change( null, i );
398
                                }
399
                                this._refreshValue();
400
                        } else {
401
                                if ( this.options.values && this.options.values.length ) {
402
                                        return this._values( index );
403
                                } else {
404
                                        return this.value();
405
                                }
406
                        }
407
                } else {
408
                        return this._values();
409
                }
410
        },
411

    
412
        _setOption: function( key, value ) {
413
                var i,
414
                        valsLength = 0;
415

    
416
                if ( key === "range" && this.options.range === true ) {
417
                        if ( value === "min" ) {
418
                                this.options.value = this._values( 0 );
419
                                this.options.values = null;
420
                        } else if ( value === "max" ) {
421
                                this.options.value = this._values( this.options.values.length-1 );
422
                                this.options.values = null;
423
                        }
424
                }
425

    
426
                if ( $.isArray( this.options.values ) ) {
427
                        valsLength = this.options.values.length;
428
                }
429

    
430
                $.Widget.prototype._setOption.apply( this, arguments );
431

    
432
                switch ( key ) {
433
                        case "orientation":
434
                                this._detectOrientation();
435
                                this.element
436
                                        .removeClass( "ui-slider-horizontal ui-slider-vertical" )
437
                                        .addClass( "ui-slider-" + this.orientation );
438
                                this._refreshValue();
439
                                break;
440
                        case "value":
441
                                this._animateOff = true;
442
                                this._refreshValue();
443
                                this._change( null, 0 );
444
                                this._animateOff = false;
445
                                break;
446
                        case "values":
447
                                this._animateOff = true;
448
                                this._refreshValue();
449
                                for ( i = 0; i < valsLength; i += 1 ) {
450
                                        this._change( null, i );
451
                                }
452
                                this._animateOff = false;
453
                                break;
454
                        case "min":
455
                        case "max":
456
                                this._animateOff = true;
457
                                this._refreshValue();
458
                                this._animateOff = false;
459
                                break;
460
                        case "range":
461
                                this._animateOff = true;
462
                                this._refresh();
463
                                this._animateOff = false;
464
                                break;
465
                }
466
        },
467

    
468
        //internal value getter
469
        // _value() returns value trimmed by min and max, aligned by step
470
        _value: function() {
471
                var val = this.options.value;
472
                val = this._trimAlignValue( val );
473

    
474
                return val;
475
        },
476

    
477
        //internal values getter
478
        // _values() returns array of values trimmed by min and max, aligned by step
479
        // _values( index ) returns single value trimmed by min and max, aligned by step
480
        _values: function( index ) {
481
                var val,
482
                        vals,
483
                        i;
484

    
485
                if ( arguments.length ) {
486
                        val = this.options.values[ index ];
487
                        val = this._trimAlignValue( val );
488

    
489
                        return val;
490
                } else if ( this.options.values && this.options.values.length ) {
491
                        // .slice() creates a copy of the array
492
                        // this copy gets trimmed by min and max and then returned
493
                        vals = this.options.values.slice();
494
                        for ( i = 0; i < vals.length; i+= 1) {
495
                                vals[ i ] = this._trimAlignValue( vals[ i ] );
496
                        }
497

    
498
                        return vals;
499
                } else {
500
                        return [];
501
                }
502
        },
503

    
504
        // returns the step-aligned value that val is closest to, between (inclusive) min and max
505
        _trimAlignValue: function( val ) {
506
                if ( val <= this._valueMin() ) {
507
                        return this._valueMin();
508
                }
509
                if ( val >= this._valueMax() ) {
510
                        return this._valueMax();
511
                }
512
                var step = ( this.options.step > 0 ) ? this.options.step : 1,
513
                        valModStep = (val - this._valueMin()) % step,
514
                        alignValue = val - valModStep;
515

    
516
                if ( Math.abs(valModStep) * 2 >= step ) {
517
                        alignValue += ( valModStep > 0 ) ? step : ( -step );
518
                }
519

    
520
                // Since JavaScript has problems with large floats, round
521
                // the final value to 5 digits after the decimal point (see #4124)
522
                return parseFloat( alignValue.toFixed(5) );
523
        },
524

    
525
        _valueMin: function() {
526
                return this.options.min;
527
        },
528

    
529
        _valueMax: function() {
530
                return this.options.max;
531
        },
532

    
533
        _refreshValue: function() {
534
                var lastValPercent, valPercent, value, valueMin, valueMax,
535
                        oRange = this.options.range,
536
                        o = this.options,
537
                        that = this,
538
                        animate = ( !this._animateOff ) ? o.animate : false,
539
                        _set = {};
540

    
541
                if ( this.options.values && this.options.values.length ) {
542
                        this.handles.each(function( i ) {
543
                                valPercent = ( that.values(i) - that._valueMin() ) / ( that._valueMax() - that._valueMin() ) * 100;
544
                                _set[ that.orientation === "horizontal" ? "left" : "bottom" ] = valPercent + "%";
545
                                $( this ).stop( 1, 1 )[ animate ? "animate" : "css" ]( _set, o.animate );
546
                                if ( that.options.range === true ) {
547
                                        if ( that.orientation === "horizontal" ) {
548
                                                if ( i === 0 ) {
549
                                                        that.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { left: valPercent + "%" }, o.animate );
550
                                                }
551
                                                if ( i === 1 ) {
552
                                                        that.range[ animate ? "animate" : "css" ]( { width: ( valPercent - lastValPercent ) + "%" }, { queue: false, duration: o.animate } );
553
                                                }
554
                                        } else {
555
                                                if ( i === 0 ) {
556
                                                        that.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { bottom: ( valPercent ) + "%" }, o.animate );
557
                                                }
558
                                                if ( i === 1 ) {
559
                                                        that.range[ animate ? "animate" : "css" ]( { height: ( valPercent - lastValPercent ) + "%" }, { queue: false, duration: o.animate } );
560
                                                }
561
                                        }
562
                                }
563
                                lastValPercent = valPercent;
564
                        });
565
                } else {
566
                        value = this.value();
567
                        valueMin = this._valueMin();
568
                        valueMax = this._valueMax();
569
                        valPercent = ( valueMax !== valueMin ) ?
570
                                        ( value - valueMin ) / ( valueMax - valueMin ) * 100 :
571
                                        0;
572
                        _set[ this.orientation === "horizontal" ? "left" : "bottom" ] = valPercent + "%";
573
                        this.handle.stop( 1, 1 )[ animate ? "animate" : "css" ]( _set, o.animate );
574

    
575
                        if ( oRange === "min" && this.orientation === "horizontal" ) {
576
                                this.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { width: valPercent + "%" }, o.animate );
577
                        }
578
                        if ( oRange === "max" && this.orientation === "horizontal" ) {
579
                                this.range[ animate ? "animate" : "css" ]( { width: ( 100 - valPercent ) + "%" }, { queue: false, duration: o.animate } );
580
                        }
581
                        if ( oRange === "min" && this.orientation === "vertical" ) {
582
                                this.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { height: valPercent + "%" }, o.animate );
583
                        }
584
                        if ( oRange === "max" && this.orientation === "vertical" ) {
585
                                this.range[ animate ? "animate" : "css" ]( { height: ( 100 - valPercent ) + "%" }, { queue: false, duration: o.animate } );
586
                        }
587
                }
588
        },
589

    
590
        _handleEvents: {
591
                keydown: function( event ) {
592
                        /*jshint maxcomplexity:25*/
593
                        var allowed, curVal, newVal, step,
594
                                index = $( event.target ).data( "ui-slider-handle-index" );
595

    
596
                        switch ( event.keyCode ) {
597
                                case $.ui.keyCode.HOME:
598
                                case $.ui.keyCode.END:
599
                                case $.ui.keyCode.PAGE_UP:
600
                                case $.ui.keyCode.PAGE_DOWN:
601
                                case $.ui.keyCode.UP:
602
                                case $.ui.keyCode.RIGHT:
603
                                case $.ui.keyCode.DOWN:
604
                                case $.ui.keyCode.LEFT:
605
                                        event.preventDefault();
606
                                        if ( !this._keySliding ) {
607
                                                this._keySliding = true;
608
                                                $( event.target ).addClass( "ui-state-active" );
609
                                                allowed = this._start( event, index );
610
                                                if ( allowed === false ) {
611
                                                        return;
612
                                                }
613
                                        }
614
                                        break;
615
                        }
616

    
617
                        step = this.options.step;
618
                        if ( this.options.values && this.options.values.length ) {
619
                                curVal = newVal = this.values( index );
620
                        } else {
621
                                curVal = newVal = this.value();
622
                        }
623

    
624
                        switch ( event.keyCode ) {
625
                                case $.ui.keyCode.HOME:
626
                                        newVal = this._valueMin();
627
                                        break;
628
                                case $.ui.keyCode.END:
629
                                        newVal = this._valueMax();
630
                                        break;
631
                                case $.ui.keyCode.PAGE_UP:
632
                                        newVal = this._trimAlignValue( curVal + ( (this._valueMax() - this._valueMin()) / numPages ) );
633
                                        break;
634
                                case $.ui.keyCode.PAGE_DOWN:
635
                                        newVal = this._trimAlignValue( curVal - ( (this._valueMax() - this._valueMin()) / numPages ) );
636
                                        break;
637
                                case $.ui.keyCode.UP:
638
                                case $.ui.keyCode.RIGHT:
639
                                        if ( curVal === this._valueMax() ) {
640
                                                return;
641
                                        }
642
                                        newVal = this._trimAlignValue( curVal + step );
643
                                        break;
644
                                case $.ui.keyCode.DOWN:
645
                                case $.ui.keyCode.LEFT:
646
                                        if ( curVal === this._valueMin() ) {
647
                                                return;
648
                                        }
649
                                        newVal = this._trimAlignValue( curVal - step );
650
                                        break;
651
                        }
652

    
653
                        this._slide( event, index, newVal );
654
                },
655
                click: function( event ) {
656
                        event.preventDefault();
657
                },
658
                keyup: function( event ) {
659
                        var index = $( event.target ).data( "ui-slider-handle-index" );
660

    
661
                        if ( this._keySliding ) {
662
                                this._keySliding = false;
663
                                this._stop( event, index );
664
                                this._change( event, index );
665
                                $( event.target ).removeClass( "ui-state-active" );
666
                        }
667
                }
668
        }
669

    
670
});
671

    
672
}(jQuery));