| |
1
| +// Ion.RangeSlider |
| |
2
| +// version 2.1.4 Build: 355 |
| |
3
| +// © Denis Ineshin, 2016 |
| |
4
| +// https://github.com/IonDen |
| |
5
| +// |
| |
6
| +// Project page: http://ionden.com/a/plugins/ion.rangeSlider/en.html |
| |
7
| +// GitHub page: https://github.com/IonDen/ion.rangeSlider |
| |
8
| +// |
| |
9
| +// Released under MIT licence: |
| |
10
| +// http://ionden.com/a/plugins/licence-en.html |
| |
11
| +// ===================================================================================================================== |
| |
12
| + |
| |
13
| +(function (factory) { |
| |
14
| + if (typeof define === 'function' && define.amd) { |
| |
15
| + define(['jquery'], function ($) { |
| |
16
| + factory($, document, window, navigator); |
| |
17
| + }); |
| |
18
| + } else { |
| |
19
| + factory(jQuery, document, window, navigator); |
| |
20
| + } |
| |
21
| +} (function ($, document, window, navigator, undefined) { |
| |
22
| + "use strict"; |
| |
23
| + |
| |
24
| + // ================================================================================================================= |
| |
25
| + // Service |
| |
26
| + |
| |
27
| + var plugin_count = 0; |
| |
28
| + |
| |
29
| + // IE8 fix |
| |
30
| + var is_old_ie = (function () { |
| |
31
| + var n = navigator.userAgent, |
| |
32
| + r = /msie\s\d+/i, |
| |
33
| + v; |
| |
34
| + if (n.search(r) > 0) { |
| |
35
| + v = r.exec(n).toString(); |
| |
36
| + v = v.split(" ")[1]; |
| |
37
| + if (v < 9) { |
| |
38
| + $("html").addClass("lt-ie9"); |
| |
39
| + return true; |
| |
40
| + } |
| |
41
| + } |
| |
42
| + return false; |
| |
43
| + } ()); |
| |
44
| + if (!Function.prototype.bind) { |
| |
45
| + Function.prototype.bind = function bind(that) { |
| |
46
| + |
| |
47
| + var target = this; |
| |
48
| + var slice = [].slice; |
| |
49
| + |
| |
50
| + if (typeof target != "function") { |
| |
51
| + throw new TypeError(); |
| |
52
| + } |
| |
53
| + |
| |
54
| + var args = slice.call(arguments, 1), |
| |
55
| + bound = function () { |
| |
56
| + |
| |
57
| + if (this instanceof bound) { |
| |
58
| + |
| |
59
| + var F = function(){}; |
| |
60
| + F.prototype = target.prototype; |
| |
61
| + var self = new F(); |
| |
62
| + |
| |
63
| + var result = target.apply( |
| |
64
| + self, |
| |
65
| + args.concat(slice.call(arguments)) |
| |
66
| + ); |
| |
67
| + if (Object(result) === result) { |
| |
68
| + return result; |
| |
69
| + } |
| |
70
| + return self; |
| |
71
| + |
| |
72
| + } else { |
| |
73
| + |
| |
74
| + return target.apply( |
| |
75
| + that, |
| |
76
| + args.concat(slice.call(arguments)) |
| |
77
| + ); |
| |
78
| + |
| |
79
| + } |
| |
80
| + |
| |
81
| + }; |
| |
82
| + |
| |
83
| + return bound; |
| |
84
| + }; |
| |
85
| + } |
| |
86
| + if (!Array.prototype.indexOf) { |
| |
87
| + Array.prototype.indexOf = function(searchElement, fromIndex) { |
| |
88
| + var k; |
| |
89
| + if (this == null) { |
| |
90
| + throw new TypeError('"this" is null or not defined'); |
| |
91
| + } |
| |
92
| + var O = Object(this); |
| |
93
| + var len = O.length >>> 0; |
| |
94
| + if (len === 0) { |
| |
95
| + return -1; |
| |
96
| + } |
| |
97
| + var n = +fromIndex || 0; |
| |
98
| + if (Math.abs(n) === Infinity) { |
| |
99
| + n = 0; |
| |
100
| + } |
| |
101
| + if (n >= len) { |
| |
102
| + return -1; |
| |
103
| + } |
| |
104
| + k = Math.max(n >= 0 ? n : len - Math.abs(n), 0); |
| |
105
| + while (k < len) { |
| |
106
| + if (k in O && O[k] === searchElement) { |
| |
107
| + return k; |
| |
108
| + } |
| |
109
| + k++; |
| |
110
| + } |
| |
111
| + return -1; |
| |
112
| + }; |
| |
113
| + } |
| |
114
| + |
| |
115
| + |
| |
116
| + |
| |
117
| + // ================================================================================================================= |
| |
118
| + // Template |
| |
119
| + |
| |
120
| + var base_html = |
| |
121
| + '<span class="irs">' + |
| |
122
| + '<span class="irs-line" tabindex="-1"><span class="irs-line-left"></span><span class="irs-line-mid"></span><span class="irs-line-right"></span></span>' + |
| |
123
| + '<span class="irs-min">0</span><span class="irs-max">1</span>' + |
| |
124
| + '<span class="irs-from">0</span><span class="irs-to">0</span><span class="irs-single">0</span>' + |
| |
125
| + '</span>' + |
| |
126
| + '<span class="irs-grid"></span>' + |
| |
127
| + '<span class="irs-bar"></span>'; |
| |
128
| + |
| |
129
| + var single_html = |
| |
130
| + '<span class="irs-bar-edge"></span>' + |
| |
131
| + '<span class="irs-shadow shadow-single"></span>' + |
| |
132
| + '<span class="irs-slider single"></span>'; |
| |
133
| + |
| |
134
| + var double_html = |
| |
135
| + '<span class="irs-shadow shadow-from"></span>' + |
| |
136
| + '<span class="irs-shadow shadow-to"></span>' + |
| |
137
| + '<span class="irs-slider from"></span>' + |
| |
138
| + '<span class="irs-slider to"></span>'; |
| |
139
| + |
| |
140
| + var disable_html = |
| |
141
| + '<span class="irs-disable-mask"></span>'; |
| |
142
| + |
| |
143
| + |
| |
144
| + |
| |
145
| + // ================================================================================================================= |
| |
146
| + // Core |
| |
147
| + |
| |
148
| + /** |
| |
149
| + * Main plugin constructor |
| |
150
| + * |
| |
151
| + * @param input {Object} link to base input element |
| |
152
| + * @param options {Object} slider config |
| |
153
| + * @param plugin_count {Number} |
| |
154
| + * @constructor |
| |
155
| + */ |
| |
156
| + var IonRangeSlider = function (input, options, plugin_count) { |
| |
157
| + this.VERSION = "2.1.4"; |
| |
158
| + this.input = input; |
| |
159
| + this.plugin_count = plugin_count; |
| |
160
| + this.current_plugin = 0; |
| |
161
| + this.calc_count = 0; |
| |
162
| + this.update_tm = 0; |
| |
163
| + this.old_from = 0; |
| |
164
| + this.old_to = 0; |
| |
165
| + this.old_min_interval = null; |
| |
166
| + this.raf_id = null; |
| |
167
| + this.dragging = false; |
| |
168
| + this.force_redraw = false; |
| |
169
| + this.no_diapason = false; |
| |
170
| + this.is_key = false; |
| |
171
| + this.is_update = false; |
| |
172
| + this.is_start = true; |
| |
173
| + this.is_finish = false; |
| |
174
| + this.is_active = false; |
| |
175
| + this.is_resize = false; |
| |
176
| + this.is_click = false; |
| |
177
| + |
| |
178
| + // cache for links to all DOM elements |
| |
179
| + this.$cache = { |
| |
180
| + win: $(window), |
| |
181
| + body: $(document.body), |
| |
182
| + input: $(input), |
| |
183
| + cont: null, |
| |
184
| + rs: null, |
| |
185
| + min: null, |
| |
186
| + max: null, |
| |
187
| + from: null, |
| |
188
| + to: null, |
| |
189
| + single: null, |
| |
190
| + bar: null, |
| |
191
| + line: null, |
| |
192
| + s_single: null, |
| |
193
| + s_from: null, |
| |
194
| + s_to: null, |
| |
195
| + shad_single: null, |
| |
196
| + shad_from: null, |
| |
197
| + shad_to: null, |
| |
198
| + edge: null, |
| |
199
| + grid: null, |
| |
200
| + grid_labels: [] |
| |
201
| + }; |
| |
202
| + |
| |
203
| + // storage for measure variables |
| |
204
| + this.coords = { |
| |
205
| + // left |
| |
206
| + x_gap: 0, |
| |
207
| + x_pointer: 0, |
| |
208
| + |
| |
209
| + // width |
| |
210
| + w_rs: 0, |
| |
211
| + w_rs_old: 0, |
| |
212
| + w_handle: 0, |
| |
213
| + |
| |
214
| + // percents |
| |
215
| + p_gap: 0, |
| |
216
| + p_gap_left: 0, |
| |
217
| + p_gap_right: 0, |
| |
218
| + p_step: 0, |
| |
219
| + p_pointer: 0, |
| |
220
| + p_handle: 0, |
| |
221
| + p_single_fake: 0, |
| |
222
| + p_single_real: 0, |
| |
223
| + p_from_fake: 0, |
| |
224
| + p_from_real: 0, |
| |
225
| + p_to_fake: 0, |
| |
226
| + p_to_real: 0, |
| |
227
| + p_bar_x: 0, |
| |
228
| + p_bar_w: 0, |
| |
229
| + |
| |
230
| + // grid |
| |
231
| + grid_gap: 0, |
| |
232
| + big_num: 0, |
| |
233
| + big: [], |
| |
234
| + big_w: [], |
| |
235
| + big_p: [], |
| |
236
| + big_x: [] |
| |
237
| + }; |
| |
238
| + |
| |
239
| + // storage for labels measure variables |
| |
240
| + this.labels = { |
| |
241
| + // width |
| |
242
| + w_min: 0, |
| |
243
| + w_max: 0, |
| |
244
| + w_from: 0, |
| |
245
| + w_to: 0, |
| |
246
| + w_single: 0, |
| |
247
| + |
| |
248
| + // percents |
| |
249
| + p_min: 0, |
| |
250
| + p_max: 0, |
| |
251
| + p_from_fake: 0, |
| |
252
| + p_from_left: 0, |
| |
253
| + p_to_fake: 0, |
| |
254
| + p_to_left: 0, |
| |
255
| + p_single_fake: 0, |
| |
256
| + p_single_left: 0 |
| |
257
| + }; |
| |
258
| + |
| |
259
| + |
| |
260
| + |
| |
261
| + /** |
| |
262
| + * get and validate config |
| |
263
| + */ |
| |
264
| + var $inp = this.$cache.input, |
| |
265
| + val = $inp.prop("value"), |
| |
266
| + config, config_from_data, prop; |
| |
267
| + |
| |
268
| + // default config |
| |
269
| + config = { |
| |
270
| + type: "single", |
| |
271
| + |
| |
272
| + min: 10, |
| |
273
| + max: 100, |
| |
274
| + from: null, |
| |
275
| + to: null, |
| |
276
| + step: 1, |
| |
277
| + |
| |
278
| + min_interval: 0, |
| |
279
| + max_interval: 0, |
| |
280
| + drag_interval: false, |
| |
281
| + |
| |
282
| + values: [], |
| |
283
| + p_values: [], |
| |
284
| + |
| |
285
| + from_fixed: false, |
| |
286
| + from_min: null, |
| |
287
| + from_max: null, |
| |
288
| + from_shadow: false, |
| |
289
| + |
| |
290
| + to_fixed: false, |
| |
291
| + to_min: null, |
| |
292
| + to_max: null, |
| |
293
| + to_shadow: false, |
| |
294
| + |
| |
295
| + prettify_enabled: true, |
| |
296
| + prettify_separator: " ", |
| |
297
| + prettify: null, |
| |
298
| + |
| |
299
| + force_edges: false, |
| |
300
| + |
| |
301
| + keyboard: false, |
| |
302
| + keyboard_step: 5, |
| |
303
| + |
| |
304
| + grid: false, |
| |
305
| + grid_margin: true, |
| |
306
| + grid_num: 4, |
| |
307
| + grid_snap: false, |
| |
308
| + |
| |
309
| + hide_min_max: false, |
| |
310
| + hide_from_to: false, |
| |
311
| + |
| |
312
| + prefix: "", |
| |
313
| + postfix: "", |
| |
314
| + max_postfix: "", |
| |
315
| + decorate_both: true, |
| |
316
| + values_separator: " — ", |
| |
317
| + |
| |
318
| + input_values_separator: ";", |
| |
319
| + |
| |
320
| + disable: false, |
| |
321
| + |
| |
322
| + onStart: null, |
| |
323
| + onChange: null, |
| |
324
| + onFinish: null, |
| |
325
| + onUpdate: null |
| |
326
| + }; |
| |
327
| + |
| |
328
| + |
| |
329
| + |
| |
330
| + // config from data-attributes extends js config |
| |
331
| + config_from_data = { |
| |
332
| + type: $inp.data("type"), |
| |
333
| + |
| |
334
| + min: $inp.data("min"), |
| |
335
| + max: $inp.data("max"), |
| |
336
| + from: $inp.data("from"), |
| |
337
| + to: $inp.data("to"), |
| |
338
| + step: $inp.data("step"), |
| |
339
| + |
| |
340
| + min_interval: $inp.data("minInterval"), |
| |
341
| + max_interval: $inp.data("maxInterval"), |
| |
342
| + drag_interval: $inp.data("dragInterval"), |
| |
343
| + |
| |
344
| + values: $inp.data("values"), |
| |
345
| + |
| |
346
| + from_fixed: $inp.data("fromFixed"), |
| |
347
| + from_min: $inp.data("fromMin"), |
| |
348
| + from_max: $inp.data("fromMax"), |
| |
349
| + from_shadow: $inp.data("fromShadow"), |
| |
350
| + |
| |
351
| + to_fixed: $inp.data("toFixed"), |
| |
352
| + to_min: $inp.data("toMin"), |
| |
353
| + to_max: $inp.data("toMax"), |
| |
354
| + to_shadow: $inp.data("toShadow"), |
| |
355
| + |
| |
356
| + prettify_enabled: $inp.data("prettifyEnabled"), |
| |
357
| + prettify_separator: $inp.data("prettifySeparator"), |
| |
358
| + |
| |
359
| + force_edges: $inp.data("forceEdges"), |
| |
360
| + |
| |
361
| + keyboard: $inp.data("keyboard"), |
| |
362
| + keyboard_step: $inp.data("keyboardStep"), |
| |
363
| + |
| |
364
| + grid: $inp.data("grid"), |
| |
365
| + grid_margin: $inp.data("gridMargin"), |
| |
366
| + grid_num: $inp.data("gridNum"), |
| |
367
| + grid_snap: $inp.data("gridSnap"), |
| |
368
| + |
| |
369
| + hide_min_max: $inp.data("hideMinMax"), |
| |
370
| + hide_from_to: $inp.data("hideFromTo"), |
| |
371
| + |
| |
372
| + prefix: $inp.data("prefix"), |
| |
373
| + postfix: $inp.data("postfix"), |
| |
374
| + max_postfix: $inp.data("maxPostfix"), |
| |
375
| + decorate_both: $inp.data("decorateBoth"), |
| |
376
| + values_separator: $inp.data("valuesSeparator"), |
| |
377
| + |
| |
378
| + input_values_separator: $inp.data("inputValuesSeparator"), |
| |
379
| + |
| |
380
| + disable: $inp.data("disable") |
| |
381
| + }; |
| |
382
| + config_from_data.values = config_from_data.values && config_from_data.values.split(","); |
| |
383
| + |
| |
384
| + for (prop in config_from_data) { |
| |
385
| + if (config_from_data.hasOwnProperty(prop)) { |
| |
386
| + if (!config_from_data[prop] && config_from_data[prop] !== 0) { |
| |
387
| + delete config_from_data[prop]; |
| |
388
| + } |
| |
389
| + } |
| |
390
| + } |
| |
391
| + |
| |
392
| + |
| |
393
| + |
| |
394
| + // input value extends default config |
| |
395
| + if (val) { |
| |
396
| + val = val.split(config_from_data.input_values_separator || options.input_values_separator || ";"); |
| |
397
| + |
| |
398
| + if (val[0] && val[0] == +val[0]) { |
| |
399
| + val[0] = +val[0]; |
| |
400
| + } |
| |
401
| + if (val[1] && val[1] == +val[1]) { |
| |
402
| + val[1] = +val[1]; |
| |
403
| + } |
| |
404
| + |
| |
405
| + if (options && options.values && options.values.length) { |
| |
406
| + config.from = val[0] && options.values.indexOf(val[0]); |
| |
407
| + config.to = val[1] && options.values.indexOf(val[1]); |
| |
408
| + } else { |
| |
409
| + config.from = val[0] && +val[0]; |
| |
410
| + config.to = val[1] && +val[1]; |
| |
411
| + } |
| |
412
| + } |
| |
413
| + |
| |
414
| + |
| |
415
| + |
| |
416
| + // js config extends default config |
| |
417
| + $.extend(config, options); |
| |
418
| + |
| |
419
| + |
| |
420
| + // data config extends config |
| |
421
| + $.extend(config, config_from_data); |
| |
422
| + this.options = config; |
| |
423
| + |
| |
424
| + |
| |
425
| + |
| |
426
| + // validate config, to be sure that all data types are correct |
| |
427
| + this.validate(); |
| |
428
| + |
| |
429
| + |
| |
430
| + |
| |
431
| + // default result object, returned to callbacks |
| |
432
| + this.result = { |
| |
433
| + input: this.$cache.input, |
| |
434
| + slider: null, |
| |
435
| + |
| |
436
| + min: this.options.min, |
| |
437
| + max: this.options.max, |
| |
438
| + |
| |
439
| + from: this.options.from, |
| |
440
| + from_percent: 0, |
| |
441
| + from_value: null, |
| |
442
| + |
| |
443
| + to: this.options.to, |
| |
444
| + to_percent: 0, |
| |
445
| + to_value: null |
| |
446
| + }; |
| |
447
| + |
| |
448
| + |
| |
449
| + |
| |
450
| + this.init(); |
| |
451
| + }; |
| |
452
| + |
| |
453
| + IonRangeSlider.prototype = { |
| |
454
| + |
| |
455
| + /** |
| |
456
| + * Starts or updates the plugin instance |
| |
457
| + * |
| |
458
| + * @param is_update {boolean} |
| |
459
| + */ |
| |
460
| + init: function (is_update) { |
| |
461
| + this.no_diapason = false; |
| |
462
| + this.coords.p_step = this.convertToPercent(this.options.step, true); |
| |
463
| + |
| |
464
| + this.target = "base"; |
| |
465
| + |
| |
466
| + this.toggleInput(); |
| |
467
| + this.append(); |
| |
468
| + this.setMinMax(); |
| |
469
| + |
| |
470
| + if (is_update) { |
| |
471
| + this.force_redraw = true; |
| |
472
| + this.calc(true); |
| |
473
| + |
| |
474
| + // callbacks called |
| |
475
| + this.callOnUpdate(); |
| |
476
| + } else { |
| |
477
| + this.force_redraw = true; |
| |
478
| + this.calc(true); |
| |
479
| + |
| |
480
| + // callbacks called |
| |
481
| + this.callOnStart(); |
| |
482
| + } |
| |
483
| + |
| |
484
| + this.updateScene(); |
| |
485
| + }, |
| |
486
| + |
| |
487
| + /** |
| |
488
| + * Appends slider template to a DOM |
| |
489
| + */ |
| |
490
| + append: function () { |
| |
491
| + var container_html = '<span class="irs js-irs-' + this.plugin_count + '"></span>'; |
| |
492
| + this.$cache.input.before(container_html); |
| |
493
| + this.$cache.input.prop("readonly", true); |
| |
494
| + this.$cache.cont = this.$cache.input.prev(); |
| |
495
| + this.result.slider = this.$cache.cont; |
| |
496
| + |
| |
497
| + this.$cache.cont.html(base_html); |
| |
498
| + this.$cache.rs = this.$cache.cont.find(".irs"); |
| |
499
| + this.$cache.min = this.$cache.cont.find(".irs-min"); |
| |
500
| + this.$cache.max = this.$cache.cont.find(".irs-max"); |
| |
501
| + this.$cache.from = this.$cache.cont.find(".irs-from"); |
| |
502
| + this.$cache.to = this.$cache.cont.find(".irs-to"); |
| |
503
| + this.$cache.single = this.$cache.cont.find(".irs-single"); |
| |
504
| + this.$cache.bar = this.$cache.cont.find(".irs-bar"); |
| |
505
| + this.$cache.line = this.$cache.cont.find(".irs-line"); |
| |
506
| + this.$cache.grid = this.$cache.cont.find(".irs-grid"); |
| |
507
| + |
| |
508
| + if (this.options.type === "single") { |
| |
509
| + this.$cache.cont.append(single_html); |
| |
510
| + this.$cache.edge = this.$cache.cont.find(".irs-bar-edge"); |
| |
511
| + this.$cache.s_single = this.$cache.cont.find(".single"); |
| |
512
| + this.$cache.from[0].style.visibility = "hidden"; |
| |
513
| + this.$cache.to[0].style.visibility = "hidden"; |
| |
514
| + this.$cache.shad_single = this.$cache.cont.find(".shadow-single"); |
| |
515
| + } else { |
| |
516
| + this.$cache.cont.append(double_html); |
| |
517
| + this.$cache.s_from = this.$cache.cont.find(".from"); |
| |
518
| + this.$cache.s_to = this.$cache.cont.find(".to"); |
| |
519
| + this.$cache.shad_from = this.$cache.cont.find(".shadow-from"); |
| |
520
| + this.$cache.shad_to = this.$cache.cont.find(".shadow-to"); |
| |
521
| + |
| |
522
| + this.setTopHandler(); |
| |
523
| + } |
| |
524
| + |
| |
525
| + if (this.options.hide_from_to) { |
| |
526
| + this.$cache.from[0].style.display = "none"; |
| |
527
| + this.$cache.to[0].style.display = "none"; |
| |
528
| + this.$cache.single[0].style.display = "none"; |
| |
529
| + } |
| |
530
| + |
| |
531
| + this.appendGrid(); |
| |
532
| + |
| |
533
| + if (this.options.disable) { |
| |
534
| + this.appendDisableMask(); |
| |
535
| + this.$cache.input[0].disabled = true; |
| |
536
| + } else { |
| |
537
| + this.$cache.cont.removeClass("irs-disabled"); |
| |
538
| + this.$cache.input[0].disabled = false; |
| |
539
| + this.bindEvents(); |
| |
540
| + } |
| |
541
| + |
| |
542
| + if (this.options.drag_interval) { |
| |
543
| + this.$cache.bar[0].style.cursor = "ew-resize"; |
| |
544
| + } |
| |
545
| + }, |
| |
546
| + |
| |
547
| + /** |
| |
548
| + * Determine which handler has a priority |
| |
549
| + * works only for double slider type |
| |
550
| + */ |
| |
551
| + setTopHandler: function () { |
| |
552
| + var min = this.options.min, |
| |
553
| + max = this.options.max, |
| |
554
| + from = this.options.from, |
| |
555
| + to = this.options.to; |
| |
556
| + |
| |
557
| + if (from > min && to === max) { |
| |
558
| + this.$cache.s_from.addClass("type_last"); |
| |
559
| + } else if (to < max) { |
| |
560
| + this.$cache.s_to.addClass("type_last"); |
| |
561
| + } |
| |
562
| + }, |
| |
563
| + |
| |
564
| + /** |
| |
565
| + * Determine which handles was clicked last |
| |
566
| + * and which handler should have hover effect |
| |
567
| + * |
| |
568
| + * @param target {String} |
| |
569
| + */ |
| |
570
| + changeLevel: function (target) { |
| |
571
| + switch (target) { |
| |
572
| + case "single": |
| |
573
| + this.coords.p_gap = this.toFixed(this.coords.p_pointer - this.coords.p_single_fake); |
| |
574
| + break; |
| |
575
| + case "from": |
| |
576
| + this.coords.p_gap = this.toFixed(this.coords.p_pointer - this.coords.p_from_fake); |
| |
577
| + this.$cache.s_from.addClass("state_hover"); |
| |
578
| + this.$cache.s_from.addClass("type_last"); |
| |
579
| + this.$cache.s_to.removeClass("type_last"); |
| |
580
| + break; |
| |
581
| + case "to": |
| |
582
| + this.coords.p_gap = this.toFixed(this.coords.p_pointer - this.coords.p_to_fake); |
| |
583
| + this.$cache.s_to.addClass("state_hover"); |
| |
584
| + this.$cache.s_to.addClass("type_last"); |
| |
585
| + this.$cache.s_from.removeClass("type_last"); |
| |
586
| + break; |
| |
587
| + case "both": |
| |
588
| + this.coords.p_gap_left = this.toFixed(this.coords.p_pointer - this.coords.p_from_fake); |
| |
589
| + this.coords.p_gap_right = this.toFixed(this.coords.p_to_fake - this.coords.p_pointer); |
| |
590
| + this.$cache.s_to.removeClass("type_last"); |
| |
591
| + this.$cache.s_from.removeClass("type_last"); |
| |
592
| + break; |
| |
593
| + } |
| |
594
| + }, |
| |
595
| + |
| |
596
| + /** |
| |
597
| + * Then slider is disabled |
| |
598
| + * appends extra layer with opacity |
| |
599
| + */ |
| |
600
| + appendDisableMask: function () { |
| |
601
| + this.$cache.cont.append(disable_html); |
| |
602
| + this.$cache.cont.addClass("irs-disabled"); |
| |
603
| + }, |
| |
604
| + |
| |
605
| + /** |
| |
606
| + * Remove slider instance |
| |
607
| + * and ubind all events |
| |
608
| + */ |
| |
609
| + remove: function () { |
| |
610
| + this.$cache.cont.remove(); |
| |
611
| + this.$cache.cont = null; |
| |
612
| + |
| |
613
| + this.$cache.line.off("keydown.irs_" + this.plugin_count); |
| |
614
| + |
| |
615
| + this.$cache.body.off("touchmove.irs_" + this.plugin_count); |
| |
616
| + this.$cache.body.off("mousemove.irs_" + this.plugin_count); |
| |
617
| + |
| |
618
| + this.$cache.win.off("touchend.irs_" + this.plugin_count); |
| |
619
| + this.$cache.win.off("mouseup.irs_" + this.plugin_count); |
| |
620
| + |
| |
621
| + if (is_old_ie) { |
| |
622
| + this.$cache.body.off("mouseup.irs_" + this.plugin_count); |
| |
623
| + this.$cache.body.off("mouseleave.irs_" + this.plugin_count); |
| |
624
| + } |
| |
625
| + |
| |
626
| + this.$cache.grid_labels = []; |
| |
627
| + this.coords.big = []; |
| |
628
| + this.coords.big_w = []; |
| |
629
| + this.coords.big_p = []; |
| |
630
| + this.coords.big_x = []; |
| |
631
| + |
| |
632
| + cancelAnimationFrame(this.raf_id); |
| |
633
| + }, |
| |
634
| + |
| |
635
| + /** |
| |
636
| + * bind all slider events |
| |
637
| + */ |
| |
638
| + bindEvents: function () { |
| |
639
| + if (this.no_diapason) { |
| |
640
| + return; |
| |
641
| + } |
| |
642
| + |
| |
643
| + this.$cache.body.on("touchmove.irs_" + this.plugin_count, this.pointerMove.bind(this)); |
| |
644
| + this.$cache.body.on("mousemove.irs_" + this.plugin_count, this.pointerMove.bind(this)); |
| |
645
| + |
| |
646
| + this.$cache.win.on("touchend.irs_" + this.plugin_count, this.pointerUp.bind(this)); |
| |
647
| + this.$cache.win.on("mouseup.irs_" + this.plugin_count, this.pointerUp.bind(this)); |
| |
648
| + |
| |
649
| + this.$cache.line.on("touchstart.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
650
| + this.$cache.line.on("mousedown.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
651
| + |
| |
652
| + if (this.options.drag_interval && this.options.type === "double") { |
| |
653
| + this.$cache.bar.on("touchstart.irs_" + this.plugin_count, this.pointerDown.bind(this, "both")); |
| |
654
| + this.$cache.bar.on("mousedown.irs_" + this.plugin_count, this.pointerDown.bind(this, "both")); |
| |
655
| + } else { |
| |
656
| + this.$cache.bar.on("touchstart.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
657
| + this.$cache.bar.on("mousedown.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
658
| + } |
| |
659
| + |
| |
660
| + if (this.options.type === "single") { |
| |
661
| + this.$cache.single.on("touchstart.irs_" + this.plugin_count, this.pointerDown.bind(this, "single")); |
| |
662
| + this.$cache.s_single.on("touchstart.irs_" + this.plugin_count, this.pointerDown.bind(this, "single")); |
| |
663
| + this.$cache.shad_single.on("touchstart.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
664
| + |
| |
665
| + this.$cache.single.on("mousedown.irs_" + this.plugin_count, this.pointerDown.bind(this, "single")); |
| |
666
| + this.$cache.s_single.on("mousedown.irs_" + this.plugin_count, this.pointerDown.bind(this, "single")); |
| |
667
| + this.$cache.edge.on("mousedown.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
668
| + this.$cache.shad_single.on("mousedown.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
669
| + } else { |
| |
670
| + this.$cache.single.on("touchstart.irs_" + this.plugin_count, this.pointerDown.bind(this, null)); |
| |
671
| + this.$cache.single.on("mousedown.irs_" + this.plugin_count, this.pointerDown.bind(this, null)); |
| |
672
| + |
| |
673
| + this.$cache.from.on("touchstart.irs_" + this.plugin_count, this.pointerDown.bind(this, "from")); |
| |
674
| + this.$cache.s_from.on("touchstart.irs_" + this.plugin_count, this.pointerDown.bind(this, "from")); |
| |
675
| + this.$cache.to.on("touchstart.irs_" + this.plugin_count, this.pointerDown.bind(this, "to")); |
| |
676
| + this.$cache.s_to.on("touchstart.irs_" + this.plugin_count, this.pointerDown.bind(this, "to")); |
| |
677
| + this.$cache.shad_from.on("touchstart.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
678
| + this.$cache.shad_to.on("touchstart.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
679
| + |
| |
680
| + this.$cache.from.on("mousedown.irs_" + this.plugin_count, this.pointerDown.bind(this, "from")); |
| |
681
| + this.$cache.s_from.on("mousedown.irs_" + this.plugin_count, this.pointerDown.bind(this, "from")); |
| |
682
| + this.$cache.to.on("mousedown.irs_" + this.plugin_count, this.pointerDown.bind(this, "to")); |
| |
683
| + this.$cache.s_to.on("mousedown.irs_" + this.plugin_count, this.pointerDown.bind(this, "to")); |
| |
684
| + this.$cache.shad_from.on("mousedown.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
685
| + this.$cache.shad_to.on("mousedown.irs_" + this.plugin_count, this.pointerClick.bind(this, "click")); |
| |
686
| + } |
| |
687
| + |
| |
688
| + if (this.options.keyboard) { |
| |
689
| + this.$cache.line.on("keydown.irs_" + this.plugin_count, this.key.bind(this, "keyboard")); |
| |
690
| + } |
| |
691
| + |
| |
692
| + if (is_old_ie) { |
| |
693
| + this.$cache.body.on("mouseup.irs_" + this.plugin_count, this.pointerUp.bind(this)); |
| |
694
| + this.$cache.body.on("mouseleave.irs_" + this.plugin_count, this.pointerUp.bind(this)); |
| |
695
| + } |
| |
696
| + }, |
| |
697
| + |
| |
698
| + /** |
| |
699
| + * Mousemove or touchmove |
| |
700
| + * only for handlers |
| |
701
| + * |
| |
702
| + * @param e {Object} event object |
| |
703
| + */ |
| |
704
| + pointerMove: function (e) { |
| |
705
| + if (!this.dragging) { |
| |
706
| + return; |
| |
707
| + } |
| |
708
| + |
| |
709
| + var x = e.pageX || e.originalEvent.touches && e.originalEvent.touches[0].pageX; |
| |
710
| + this.coords.x_pointer = x - this.coords.x_gap; |
| |
711
| + |
| |
712
| + this.calc(); |
| |
713
| + }, |
| |
714
| + |
| |
715
| + /** |
| |
716
| + * Mouseup or touchend |
| |
717
| + * only for handlers |
| |
718
| + * |
| |
719
| + * @param e {Object} event object |
| |
720
| + */ |
| |
721
| + pointerUp: function (e) { |
| |
722
| + if (this.current_plugin !== this.plugin_count) { |
| |
723
| + return; |
| |
724
| + } |
| |
725
| + |
| |
726
| + if (this.is_active) { |
| |
727
| + this.is_active = false; |
| |
728
| + } else { |
| |
729
| + return; |
| |
730
| + } |
| |
731
| + |
| |
732
| + this.$cache.cont.find(".state_hover").removeClass("state_hover"); |
| |
733
| + |
| |
734
| + this.force_redraw = true; |
| |
735
| + |
| |
736
| + if (is_old_ie) { |
| |
737
| + $("*").prop("unselectable", false); |
| |
738
| + } |
| |
739
| + |
| |
740
| + this.updateScene(); |
| |
741
| + this.restoreOriginalMinInterval(); |
| |
742
| + |
| |
743
| + // callbacks call |
| |
744
| + if ($.contains(this.$cache.cont[0], e.target) || this.dragging) { |
| |
745
| + this.is_finish = true; |
| |
746
| + this.callOnFinish(); |
| |
747
| + } |
| |
748
| + |
| |
749
| + this.dragging = false; |
| |
750
| + }, |
| |
751
| + |
| |
752
| + /** |
| |
753
| + * Mousedown or touchstart |
| |
754
| + * only for handlers |
| |
755
| + * |
| |
756
| + * @param target {String|null} |
| |
757
| + * @param e {Object} event object |
| |
758
| + */ |
| |
759
| + pointerDown: function (target, e) { |
| |
760
| + e.preventDefault(); |
| |
761
| + var x = e.pageX || e.originalEvent.touches && e.originalEvent.touches[0].pageX; |
| |
762
| + if (e.button === 2) { |
| |
763
| + return; |
| |
764
| + } |
| |
765
| + |
| |
766
| + if (target === "both") { |
| |
767
| + this.setTempMinInterval(); |
| |
768
| + } |
| |
769
| + |
| |
770
| + if (!target) { |
| |
771
| + target = this.target; |
| |
772
| + } |
| |
773
| + |
| |
774
| + this.current_plugin = this.plugin_count; |
| |
775
| + this.target = target; |
| |
776
| + |
| |
777
| + this.is_active = true; |
| |
778
| + this.dragging = true; |
| |
779
| + |
| |
780
| + this.coords.x_gap = this.$cache.rs.offset().left; |
| |
781
| + this.coords.x_pointer = x - this.coords.x_gap; |
| |
782
| + |
| |
783
| + this.calcPointerPercent(); |
| |
784
| + this.changeLevel(target); |
| |
785
| + |
| |
786
| + if (is_old_ie) { |
| |
787
| + $("*").prop("unselectable", true); |
| |
788
| + } |
| |
789
| + |
| |
790
| + this.$cache.line.trigger("focus"); |
| |
791
| + |
| |
792
| + this.updateScene(); |
| |
793
| + }, |
| |
794
| + |
| |
795
| + /** |
| |
796
| + * Mousedown or touchstart |
| |
797
| + * for other slider elements, like diapason line |
| |
798
| + * |
| |
799
| + * @param target {String} |
| |
800
| + * @param e {Object} event object |
| |
801
| + */ |
| |
802
| + pointerClick: function (target, e) { |
| |
803
| + e.preventDefault(); |
| |
804
| + var x = e.pageX || e.originalEvent.touches && e.originalEvent.touches[0].pageX; |
| |
805
| + if (e.button === 2) { |
| |
806
| + return; |
| |
807
| + } |
| |
808
| + |
| |
809
| + this.current_plugin = this.plugin_count; |
| |
810
| + this.target = target; |
| |
811
| + |
| |
812
| + this.is_click = true; |
| |
813
| + this.coords.x_gap = this.$cache.rs.offset().left; |
| |
814
| + this.coords.x_pointer = +(x - this.coords.x_gap).toFixed(); |
| |
815
| + |
| |
816
| + this.force_redraw = true; |
| |
817
| + this.calc(); |
| |
818
| + |
| |
819
| + this.$cache.line.trigger("focus"); |
| |
820
| + }, |
| |
821
| + |
| |
822
| + /** |
| |
823
| + * Keyborard controls for focused slider |
| |
824
| + * |
| |
825
| + * @param target {String} |
| |
826
| + * @param e {Object} event object |
| |
827
| + * @returns {boolean|undefined} |
| |
828
| + */ |
| |
829
| + key: function (target, e) { |
| |
830
| + if (this.current_plugin !== this.plugin_count || e.altKey || e.ctrlKey || e.shiftKey || e.metaKey) { |
| |
831
| + return; |
| |
832
| + } |
| |
833
| + |
| |
834
| + switch (e.which) { |
| |
835
| + case 83: // W |
| |
836
| + case 65: // A |
| |
837
| + case 40: // DOWN |
| |
838
| + case 37: // LEFT |
| |
839
| + e.preventDefault(); |
| |
840
| + this.moveByKey(false); |
| |
841
| + break; |
| |
842
| + |
| |
843
| + case 87: // S |
| |
844
| + case 68: // D |
| |
845
| + case 38: // UP |
| |
846
| + case 39: // RIGHT |
| |
847
| + e.preventDefault(); |
| |
848
| + this.moveByKey(true); |
| |
849
| + break; |
| |
850
| + } |
| |
851
| + |
| |
852
| + return true; |
| |
853
| + }, |
| |
854
| + |
| |
855
| + /** |
| |
856
| + * Move by key. Beta |
| |
857
| + * @todo refactor than have plenty of time |
| |
858
| + * |
| |
859
| + * @param right {boolean} direction to move |
| |
860
| + */ |
| |
861
| + moveByKey: function (right) { |
| |
862
| + var p = this.coords.p_pointer; |
| |
863
| + |
| |
864
| + if (right) { |
| |
865
| + p += this.options.keyboard_step; |
| |
866
| + } else { |
| |
867
| + p -= this.options.keyboard_step; |
| |
868
| + } |
| |
869
| + |
| |
870
| + this.coords.x_pointer = this.toFixed(this.coords.w_rs / 100 * p); |
| |
871
| + this.is_key = true; |
| |
872
| + this.calc(); |
| |
873
| + }, |
| |
874
| + |
| |
875
| + /** |
| |
876
| + * Set visibility and content |
| |
877
| + * of Min and Max labels |
| |
878
| + */ |
| |
879
| + setMinMax: function () { |
| |
880
| + if (!this.options) { |
| |
881
| + return; |
| |
882
| + } |
| |
883
| + |
| |
884
| + if (this.options.hide_min_max) { |
| |
885
| + this.$cache.min[0].style.display = "none"; |
| |
886
| + this.$cache.max[0].style.display = "none"; |
| |
887
| + return; |
| |
888
| + } |
| |
889
| + |
| |
890
| + if (this.options.values.length) { |
| |
891
| + this.$cache.min.html(this.decorate(this.options.p_values[this.options.min])); |
| |
892
| + this.$cache.max.html(this.decorate(this.options.p_values[this.options.max])); |
| |
893
| + } else { |
| |
894
| + this.$cache.min.html(this.decorate(this._prettify(this.options.min), this.options.min)); |
| |
895
| + this.$cache.max.html(this.decorate(this._prettify(this.options.max), this.options.max)); |
| |
896
| + } |
| |
897
| + |
| |
898
| + this.labels.w_min = this.$cache.min.outerWidth(false); |
| |
899
| + this.labels.w_max = this.$cache.max.outerWidth(false); |
| |
900
| + }, |
| |
901
| + |
| |
902
| + /** |
| |
903
| + * Then dragging interval, prevent interval collapsing |
| |
904
| + * using min_interval option |
| |
905
| + */ |
| |
906
| + setTempMinInterval: function () { |
| |
907
| + var interval = this.result.to - this.result.from; |
| |
908
| + |
| |
909
| + if (this.old_min_interval === null) { |
| |
910
| + this.old_min_interval = this.options.min_interval; |
| |
911
| + } |
| |
912
| + |
| |
913
| + this.options.min_interval = interval; |
| |
914
| + }, |
| |
915
| + |
| |
916
| + /** |
| |
917
| + * Restore min_interval option to original |
| |
918
| + */ |
| |
919
| + restoreOriginalMinInterval: function () { |
| |
920
| + if (this.old_min_interval !== null) { |
| |
921
| + this.options.min_interval = this.old_min_interval; |
| |
922
| + this.old_min_interval = null; |
| |
923
| + } |
| |
924
| + }, |
| |
925
| + |
| |
926
| + |
| |
927
| + |
| |
928
| + // ============================================================================================================= |
| |
929
| + // Calculations |
| |
930
| + |
| |
931
| + /** |
| |
932
| + * All calculations and measures start here |
| |
933
| + * |
| |
934
| + * @param update {boolean=} |
| |
935
| + */ |
| |
936
| + calc: function (update) { |
| |
937
| + if (!this.options) { |
| |
938
| + return; |
| |
939
| + } |
| |
940
| + |
| |
941
| + this.calc_count++; |
| |
942
| + |
| |
943
| + if (this.calc_count === 10 || update) { |
| |
944
| + this.calc_count = 0; |
| |
945
| + this.coords.w_rs = this.$cache.rs.outerWidth(false); |
| |
946
| + |
| |
947
| + this.calcHandlePercent(); |
| |
948
| + } |
| |
949
| + |
| |
950
| + if (!this.coords.w_rs) { |
| |
951
| + return; |
| |
952
| + } |
| |
953
| + |
| |
954
| + this.calcPointerPercent(); |
| |
955
| + var handle_x = this.getHandleX(); |
| |
956
| + |
| |
957
| + if (this.target === "click") { |
| |
958
| + this.coords.p_gap = this.coords.p_handle / 2; |
| |
959
| + handle_x = this.getHandleX(); |
| |
960
| + |
| |
961
| + if (this.options.drag_interval) { |
| |
962
| + this.target = "both_one"; |
| |
963
| + } else { |
| |
964
| + this.target = this.chooseHandle(handle_x); |
| |
965
| + } |
| |
966
| + } |
| |
967
| + |
| |
968
| + switch (this.target) { |
| |
969
| + case "base": |
| |
970
| + var w = (this.options.max - this.options.min) / 100, |
| |
971
| + f = (this.result.from - this.options.min) / w, |
| |
972
| + t = (this.result.to - this.options.min) / w; |
| |
973
| + |
| |
974
| + this.coords.p_single_real = this.toFixed(f); |
| |
975
| + this.coords.p_from_real = this.toFixed(f); |
| |
976
| + this.coords.p_to_real = this.toFixed(t); |
| |
977
| + |
| |
978
| + this.coords.p_single_real = this.checkDiapason(this.coords.p_single_real, this.options.from_min, this.options.from_max); |
| |
979
| + this.coords.p_from_real = this.checkDiapason(this.coords.p_from_real, this.options.from_min, this.options.from_max); |
| |
980
| + this.coords.p_to_real = this.checkDiapason(this.coords.p_to_real, this.options.to_min, this.options.to_max); |
| |
981
| + |
| |
982
| + this.coords.p_single_fake = this.convertToFakePercent(this.coords.p_single_real); |
| |
983
| + this.coords.p_from_fake = this.convertToFakePercent(this.coords.p_from_real); |
| |
984
| + this.coords.p_to_fake = this.convertToFakePercent(this.coords.p_to_real); |
| |
985
| + |
| |
986
| + this.target = null; |
| |
987
| + |
| |
988
| + break; |
| |
989
| + |
| |
990
| + case "single": |
| |
991
| + if (this.options.from_fixed) { |
| |
992
| + break; |
| |
993
| + } |
| |
994
| + |
| |
995
| + this.coords.p_single_real = this.convertToRealPercent(handle_x); |
| |
996
| + this.coords.p_single_real = this.calcWithStep(this.coords.p_single_real); |
| |
997
| + this.coords.p_single_real = this.checkDiapason(this.coords.p_single_real, this.options.from_min, this.options.from_max); |
| |
998
| + |
| |
999
| + this.coords.p_single_fake = this.convertToFakePercent(this.coords.p_single_real); |
| |
1000
| + |
| |
1001
| + break; |
| |
1002
| + |
| |
1003
| + case "from": |
| |
1004
| + if (this.options.from_fixed) { |
| |
1005
| + break; |
| |
1006
| + } |
| |
1007
| + |
| |
1008
| + this.coords.p_from_real = this.convertToRealPercent(handle_x); |
| |
1009
| + this.coords.p_from_real = this.calcWithStep(this.coords.p_from_real); |
| |
1010
| + if (this.coords.p_from_real > this.coords.p_to_real) { |
| |
1011
| + this.coords.p_from_real = this.coords.p_to_real; |
| |
1012
| + } |
| |
1013
| + this.coords.p_from_real = this.checkDiapason(this.coords.p_from_real, this.options.from_min, this.options.from_max); |
| |
1014
| + this.coords.p_from_real = this.checkMinInterval(this.coords.p_from_real, this.coords.p_to_real, "from"); |
| |
1015
| + this.coords.p_from_real = this.checkMaxInterval(this.coords.p_from_real, this.coords.p_to_real, "from"); |
| |
1016
| + |
| |
1017
| + this.coords.p_from_fake = this.convertToFakePercent(this.coords.p_from_real); |
| |
1018
| + |
| |
1019
| + break; |
| |
1020
| + |
| |
1021
| + case "to": |
| |
1022
| + if (this.options.to_fixed) { |
| |
1023
| + break; |
| |
1024
| + } |
| |
1025
| + |
| |
1026
| + this.coords.p_to_real = this.convertToRealPercent(handle_x); |
| |
1027
| + this.coords.p_to_real = this.calcWithStep(this.coords.p_to_real); |
| |
1028
| + if (this.coords.p_to_real < this.coords.p_from_real) { |
| |
1029
| + this.coords.p_to_real = this.coords.p_from_real; |
| |
1030
| + } |
| |
1031
| + this.coords.p_to_real = this.checkDiapason(this.coords.p_to_real, this.options.to_min, this.options.to_max); |
| |
1032
| + this.coords.p_to_real = this.checkMinInterval(this.coords.p_to_real, this.coords.p_from_real, "to"); |
| |
1033
| + this.coords.p_to_real = this.checkMaxInterval(this.coords.p_to_real, this.coords.p_from_real, "to"); |
| |
1034
| + |
| |
1035
| + this.coords.p_to_fake = this.convertToFakePercent(this.coords.p_to_real); |
| |
1036
| + |
| |
1037
| + break; |
| |
1038
| + |
| |
1039
| + case "both": |
| |
1040
| + if (this.options.from_fixed || this.options.to_fixed) { |
| |
1041
| + break; |
| |
1042
| + } |
| |
1043
| + |
| |
1044
| + handle_x = this.toFixed(handle_x + (this.coords.p_handle * 0.1)); |
| |
1045
| + |
| |
1046
| + this.coords.p_from_real = this.convertToRealPercent(handle_x) - this.coords.p_gap_left; |
| |
1047
| + this.coords.p_from_real = this.calcWithStep(this.coords.p_from_real); |
| |
1048
| + this.coords.p_from_real = this.checkDiapason(this.coords.p_from_real, this.options.from_min, this.options.from_max); |
| |
1049
| + this.coords.p_from_real = this.checkMinInterval(this.coords.p_from_real, this.coords.p_to_real, "from"); |
| |
1050
| + this.coords.p_from_fake = this.convertToFakePercent(this.coords.p_from_real); |
| |
1051
| + |
| |
1052
| + this.coords.p_to_real = this.convertToRealPercent(handle_x) + this.coords.p_gap_right; |
| |
1053
| + this.coords.p_to_real = this.calcWithStep(this.coords.p_to_real); |
| |
1054
| + this.coords.p_to_real = this.checkDiapason(this.coords.p_to_real, this.options.to_min, this.options.to_max); |
| |
1055
| + this.coords.p_to_real = this.checkMinInterval(this.coords.p_to_real, this.coords.p_from_real, "to"); |
| |
1056
| + this.coords.p_to_fake = this.convertToFakePercent(this.coords.p_to_real); |
| |
1057
| + |
| |
1058
| + break; |
| |
1059
| + |
| |
1060
| + case "both_one": |
| |
1061
| + if (this.options.from_fixed || this.options.to_fixed) { |
| |
1062
| + break; |
| |
1063
| + } |
| |
1064
| + |
| |
1065
| + var real_x = this.convertToRealPercent(handle_x), |
| |
1066
| + from = this.result.from_percent, |
| |
1067
| + to = this.result.to_percent, |
| |
1068
| + full = to - from, |
| |
1069
| + half = full / 2, |
| |
1070
| + new_from = real_x - half, |
| |
1071
| + new_to = real_x + half; |
| |
1072
| + |
| |
1073
| + if (new_from < 0) { |
| |
1074
| + new_from = 0; |
| |
1075
| + new_to = new_from + full; |
| |
1076
| + } |
| |
1077
| + |
| |
1078
| + if (new_to > 100) { |
| |
1079
| + new_to = 100; |
| |
1080
| + new_from = new_to - full; |
| |
1081
| + } |
| |
1082
| + |
| |
1083
| + this.coords.p_from_real = this.calcWithStep(new_from); |
| |
1084
| + this.coords.p_from_real = this.checkDiapason(this.coords.p_from_real, this.options.from_min, this.options.from_max); |
| |
1085
| + this.coords.p_from_fake = this.convertToFakePercent(this.coords.p_from_real); |
| |
1086
| + |
| |
1087
| + this.coords.p_to_real = this.calcWithStep(new_to); |
| |
1088
| + this.coords.p_to_real = this.checkDiapason(this.coords.p_to_real, this.options.to_min, this.options.to_max); |
| |
1089
| + this.coords.p_to_fake = this.convertToFakePercent(this.coords.p_to_real); |
| |
1090
| + |
| |
1091
| + break; |
| |
1092
| + } |
| |
1093
| + |
| |
1094
| + if (this.options.type === "single") { |
| |
1095
| + this.coords.p_bar_x = (this.coords.p_handle / 2); |
| |
1096
| + this.coords.p_bar_w = this.coords.p_single_fake; |
| |
1097
| + |
| |
1098
| + this.result.from_percent = this.coords.p_single_real; |
| |
1099
| + this.result.from = this.convertToValue(this.coords.p_single_real); |
| |
1100
| + |
| |
1101
| + if (this.options.values.length) { |
| |
1102
| + this.result.from_value = this.options.values[this.result.from]; |
| |
1103
| + } |
| |
1104
| + } else { |
| |
1105
| + this.coords.p_bar_x = this.toFixed(this.coords.p_from_fake + (this.coords.p_handle / 2)); |
| |
1106
| + this.coords.p_bar_w = this.toFixed(this.coords.p_to_fake - this.coords.p_from_fake); |
| |
1107
| + |
| |
1108
| + this.result.from_percent = this.coords.p_from_real; |
| |
1109
| + this.result.from = this.convertToValue(this.coords.p_from_real); |
| |
1110
| + this.result.to_percent = this.coords.p_to_real; |
| |
1111
| + this.result.to = this.convertToValue(this.coords.p_to_real); |
| |
1112
| + |
| |
1113
| + if (this.options.values.length) { |
| |
1114
| + this.result.from_value = this.options.values[this.result.from]; |
| |
1115
| + this.result.to_value = this.options.values[this.result.to]; |
| |
1116
| + } |
| |
1117
| + } |
| |
1118
| + |
| |
1119
| + this.calcMinMax(); |
| |
1120
| + this.calcLabels(); |
| |
1121
| + }, |
| |
1122
| + |
| |
1123
| + |
| |
1124
| + /** |
| |
1125
| + * calculates pointer X in percent |
| |
1126
| + */ |
| |
1127
| + calcPointerPercent: function () { |
| |
1128
| + if (!this.coords.w_rs) { |
| |
1129
| + this.coords.p_pointer = 0; |
| |
1130
| + return; |
| |
1131
| + } |
| |
1132
| + |
| |
1133
| + if (this.coords.x_pointer < 0 || isNaN(this.coords.x_pointer) ) { |
| |
1134
| + this.coords.x_pointer = 0; |
| |
1135
| + } else if (this.coords.x_pointer > this.coords.w_rs) { |
| |
1136
| + this.coords.x_pointer = this.coords.w_rs; |
| |
1137
| + } |
| |
1138
| + |
| |
1139
| + this.coords.p_pointer = this.toFixed(this.coords.x_pointer / this.coords.w_rs * 100); |
| |
1140
| + }, |
| |
1141
| + |
| |
1142
| + convertToRealPercent: function (fake) { |
| |
1143
| + var full = 100 - this.coords.p_handle; |
| |
1144
| + return fake / full * 100; |
| |
1145
| + }, |
| |
1146
| + |
| |
1147
| + convertToFakePercent: function (real) { |
| |
1148
| + var full = 100 - this.coords.p_handle; |
| |
1149
| + return real / 100 * full; |
| |
1150
| + }, |
| |
1151
| + |
| |
1152
| + getHandleX: function () { |
| |
1153
| + var max = 100 - this.coords.p_handle, |
| |
1154
| + x = this.toFixed(this.coords.p_pointer - this.coords.p_gap); |
| |
1155
| + |
| |
1156
| + if (x < 0) { |
| |
1157
| + x = 0; |
| |
1158
| + } else if (x > max) { |
| |
1159
| + x = max; |
| |
1160
| + } |
| |
1161
| + |
| |
1162
| + return x; |
| |
1163
| + }, |
| |
1164
| + |
| |
1165
| + calcHandlePercent: function () { |
| |
1166
| + if (this.options.type === "single") { |
| |
1167
| + this.coords.w_handle = this.$cache.s_single.outerWidth(false); |
| |
1168
| + } else { |
| |
1169
| + this.coords.w_handle = this.$cache.s_from.outerWidth(false); |
| |
1170
| + } |
| |
1171
| + |
| |
1172
| + this.coords.p_handle = this.toFixed(this.coords.w_handle / this.coords.w_rs * 100); |
| |
1173
| + }, |
| |
1174
| + |
| |
1175
| + /** |
| |
1176
| + * Find closest handle to pointer click |
| |
1177
| + * |
| |
1178
| + * @param real_x {Number} |
| |
1179
| + * @returns {String} |
| |
1180
| + */ |
| |
1181
| + chooseHandle: function (real_x) { |
| |
1182
| + if (this.options.type === "single") { |
| |
1183
| + return "single"; |
| |
1184
| + } else { |
| |
1185
| + var m_point = this.coords.p_from_real + ((this.coords.p_to_real - this.coords.p_from_real) / 2); |
| |
1186
| + if (real_x >= m_point) { |
| |
1187
| + return this.options.to_fixed ? "from" : "to"; |
| |
1188
| + } else { |
| |
1189
| + return this.options.from_fixed ? "to" : "from"; |
| |
1190
| + } |
| |
1191
| + } |
| |
1192
| + }, |
| |
1193
| + |
| |
1194
| + /** |
| |
1195
| + * Measure Min and Max labels width in percent |
| |
1196
| + */ |
| |
1197
| + calcMinMax: function () { |
| |
1198
| + if (!this.coords.w_rs) { |
| |
1199
| + return; |
| |
1200
| + } |
| |
1201
| + |
| |
1202
| + this.labels.p_min = this.labels.w_min / this.coords.w_rs * 100; |
| |
1203
| + this.labels.p_max = this.labels.w_max / this.coords.w_rs * 100; |
| |
1204
| + }, |
| |
1205
| + |
| |
1206
| + /** |
| |
1207
| + * Measure labels width and X in percent |
| |
1208
| + */ |
| |
1209
| + calcLabels: function () { |
| |
1210
| + if (!this.coords.w_rs || this.options.hide_from_to) { |
| |
1211
| + return; |
| |
1212
| + } |
| |
1213
| + |
| |
1214
| + if (this.options.type === "single") { |
| |
1215
| + |
| |
1216
| + this.labels.w_single = this.$cache.single.outerWidth(false); |
| |
1217
| + this.labels.p_single_fake = this.labels.w_single / this.coords.w_rs * 100; |
| |
1218
| + this.labels.p_single_left = this.coords.p_single_fake + (this.coords.p_handle / 2) - (this.labels.p_single_fake / 2); |
| |
1219
| + this.labels.p_single_left = this.checkEdges(this.labels.p_single_left, this.labels.p_single_fake); |
| |
1220
| + |
| |
1221
| + } else { |
| |
1222
| + |
| |
1223
| + this.labels.w_from = this.$cache.from.outerWidth(false); |
| |
1224
| + this.labels.p_from_fake = this.labels.w_from / this.coords.w_rs * 100; |
| |
1225
| + this.labels.p_from_left = this.coords.p_from_fake + (this.coords.p_handle / 2) - (this.labels.p_from_fake / 2); |
| |
1226
| + this.labels.p_from_left = this.toFixed(this.labels.p_from_left); |
| |
1227
| + this.labels.p_from_left = this.checkEdges(this.labels.p_from_left, this.labels.p_from_fake); |
| |
1228
| + |
| |
1229
| + this.labels.w_to = this.$cache.to.outerWidth(false); |
| |
1230
| + this.labels.p_to_fake = this.labels.w_to / this.coords.w_rs * 100; |
| |
1231
| + this.labels.p_to_left = this.coords.p_to_fake + (this.coords.p_handle / 2) - (this.labels.p_to_fake / 2); |
| |
1232
| + this.labels.p_to_left = this.toFixed(this.labels.p_to_left); |
| |
1233
| + this.labels.p_to_left = this.checkEdges(this.labels.p_to_left, this.labels.p_to_fake); |
| |
1234
| + |
| |
1235
| + this.labels.w_single = this.$cache.single.outerWidth(false); |
| |
1236
| + this.labels.p_single_fake = this.labels.w_single / this.coords.w_rs * 100; |
| |
1237
| + this.labels.p_single_left = ((this.labels.p_from_left + this.labels.p_to_left + this.labels.p_to_fake) / 2) - (this.labels.p_single_fake / 2); |
| |
1238
| + this.labels.p_single_left = this.toFixed(this.labels.p_single_left); |
| |
1239
| + this.labels.p_single_left = this.checkEdges(this.labels.p_single_left, this.labels.p_single_fake); |
| |
1240
| + |
| |
1241
| + } |
| |
1242
| + }, |
| |
1243
| + |
| |
1244
| + |
| |
1245
| + |
| |
1246
| + // ============================================================================================================= |
| |
1247
| + // Drawings |
| |
1248
| + |
| |
1249
| + /** |
| |
1250
| + * Main function called in request animation frame |
| |
1251
| + * to update everything |
| |
1252
| + */ |
| |
1253
| + updateScene: function () { |
| |
1254
| + if (this.raf_id) { |
| |
1255
| + cancelAnimationFrame(this.raf_id); |
| |
1256
| + this.raf_id = null; |
| |
1257
| + } |
| |
1258
| + |
| |
1259
| + clearTimeout(this.update_tm); |
| |
1260
| + this.update_tm = null; |
| |
1261
| + |
| |
1262
| + if (!this.options) { |
| |
1263
| + return; |
| |
1264
| + } |
| |
1265
| + |
| |
1266
| + this.drawHandles(); |
| |
1267
| + |
| |
1268
| + if (this.is_active) { |
| |
1269
| + this.raf_id = requestAnimationFrame(this.updateScene.bind(this)); |
| |
1270
| + } else { |
| |
1271
| + this.update_tm = setTimeout(this.updateScene.bind(this), 300); |
| |
1272
| + } |
| |
1273
| + }, |
| |
1274
| + |
| |
1275
| + /** |
| |
1276
| + * Draw handles |
| |
1277
| + */ |
| |
1278
| + drawHandles: function () { |
| |
1279
| + this.coords.w_rs = this.$cache.rs.outerWidth(false); |
| |
1280
| + |
| |
1281
| + if (!this.coords.w_rs) { |
| |
1282
| + return; |
| |
1283
| + } |
| |
1284
| + |
| |
1285
| + if (this.coords.w_rs !== this.coords.w_rs_old) { |
| |
1286
| + this.target = "base"; |
| |
1287
| + this.is_resize = true; |
| |
1288
| + } |
| |
1289
| + |
| |
1290
| + if (this.coords.w_rs !== this.coords.w_rs_old || this.force_redraw) { |
| |
1291
| + this.setMinMax(); |
| |
1292
| + this.calc(true); |
| |
1293
| + this.drawLabels(); |
| |
1294
| + if (this.options.grid) { |
| |
1295
| + this.calcGridMargin(); |
| |
1296
| + this.calcGridLabels(); |
| |
1297
| + } |
| |
1298
| + this.force_redraw = true; |
| |
1299
| + this.coords.w_rs_old = this.coords.w_rs; |
| |
1300
| + this.drawShadow(); |
| |
1301
| + } |
| |
1302
| + |
| |
1303
| + if (!this.coords.w_rs) { |
| |
1304
| + return; |
| |
1305
| + } |
| |
1306
| + |
| |
1307
| + if (!this.dragging && !this.force_redraw && !this.is_key) { |
| |
1308
| + return; |
| |
1309
| + } |
| |
1310
| + |
| |
1311
| + if (this.old_from !== this.result.from || this.old_to !== this.result.to || this.force_redraw || this.is_key) { |
| |
1312
| + |
| |
1313
| + this.drawLabels(); |
| |
1314
| + |
| |
1315
| + this.$cache.bar[0].style.left = this.coords.p_bar_x + "%"; |
| |
1316
| + this.$cache.bar[0].style.width = this.coords.p_bar_w + "%"; |
| |
1317
| + |
| |
1318
| + if (this.options.type === "single") { |
| |
1319
| + this.$cache.s_single[0].style.left = this.coords.p_single_fake + "%"; |
| |
1320
| + |
| |
1321
| + this.$cache.single[0].style.left = this.labels.p_single_left + "%"; |
| |
1322
| + |
| |
1323
| + if (this.options.values.length) { |
| |
1324
| + this.$cache.input.prop("value", this.result.from_value); |
| |
1325
| + } else { |
| |
1326
| + this.$cache.input.prop("value", this.result.from); |
| |
1327
| + } |
| |
1328
| + this.$cache.input.data("from", this.result.from); |
| |
1329
| + } else { |
| |
1330
| + this.$cache.s_from[0].style.left = this.coords.p_from_fake + "%"; |
| |
1331
| + this.$cache.s_to[0].style.left = this.coords.p_to_fake + "%"; |
| |
1332
| + |
| |
1333
| + if (this.old_from !== this.result.from || this.force_redraw) { |
| |
1334
| + this.$cache.from[0].style.left = this.labels.p_from_left + "%"; |
| |
1335
| + } |
| |
1336
| + if (this.old_to !== this.result.to || this.force_redraw) { |
| |
1337
| + this.$cache.to[0].style.left = this.labels.p_to_left + "%"; |
| |
1338
| + } |
| |
1339
| + |
| |
1340
| + this.$cache.single[0].style.left = this.labels.p_single_left + "%"; |
| |
1341
| + |
| |
1342
| + if (this.options.values.length) { |
| |
1343
| + this.$cache.input.prop("value", this.result.from_value + this.options.input_values_separator + this.result.to_value); |
| |
1344
| + } else { |
| |
1345
| + this.$cache.input.prop("value", this.result.from + this.options.input_values_separator + this.result.to); |
| |
1346
| + } |
| |
1347
| + this.$cache.input.data("from", this.result.from); |
| |
1348
| + this.$cache.input.data("to", this.result.to); |
| |
1349
| + } |
| |
1350
| + |
| |
1351
| + if ((this.old_from !== this.result.from || this.old_to !== this.result.to) && !this.is_start) { |
| |
1352
| + this.$cache.input.trigger("change"); |
| |
1353
| + } |
| |
1354
| + |
| |
1355
| + this.old_from = this.result.from; |
| |
1356
| + this.old_to = this.result.to; |
| |
1357
| + |
| |
1358
| + // callbacks call |
| |
1359
| + if (!this.is_resize && !this.is_update && !this.is_start && !this.is_finish) { |
| |
1360
| + this.callOnChange(); |
| |
1361
| + } |
| |
1362
| + if (this.is_key || this.is_click) { |
| |
1363
| + this.is_key = false; |
| |
1364
| + this.is_click = false; |
| |
1365
| + this.callOnFinish(); |
| |
1366
| + } |
| |
1367
| + |
| |
1368
| + this.is_update = false; |
| |
1369
| + this.is_resize = false; |
| |
1370
| + this.is_finish = false; |
| |
1371
| + } |
| |
1372
| + |
| |
1373
| + this.is_start = false; |
| |
1374
| + this.is_key = false; |
| |
1375
| + this.is_click = false; |
| |
1376
| + this.force_redraw = false; |
| |
1377
| + }, |
| |
1378
| + |
| |
1379
| + /** |
| |
1380
| + * Draw labels |
| |
1381
| + * measure labels collisions |
| |
1382
| + * collapse close labels |
| |
1383
| + */ |
| |
1384
| + drawLabels: function () { |
| |
1385
| + if (!this.options) { |
| |
1386
| + return; |
| |
1387
| + } |
| |
1388
| + |
| |
1389
| + var values_num = this.options.values.length, |
| |
1390
| + p_values = this.options.p_values, |
| |
1391
| + text_single, |
| |
1392
| + text_from, |
| |
1393
| + text_to; |
| |
1394
| + |
| |
1395
| + if (this.options.hide_from_to) { |
| |
1396
| + return; |
| |
1397
| + } |
| |
1398
| + |
| |
1399
| + if (this.options.type === "single") { |
| |
1400
| + |
| |
1401
| + if (values_num) { |
| |
1402
| + text_single = this.decorate(p_values[this.result.from]); |
| |
1403
| + this.$cache.single.html(text_single); |
| |
1404
| + } else { |
| |
1405
| + text_single = this.decorate(this._prettify(this.result.from), this.result.from); |
| |
1406
| + this.$cache.single.html(text_single); |
| |
1407
| + } |
| |
1408
| + |
| |
1409
| + this.calcLabels(); |
| |
1410
| + |
| |
1411
| + if (this.labels.p_single_left < this.labels.p_min + 1) { |
| |
1412
| + this.$cache.min[0].style.visibility = "hidden"; |
| |
1413
| + } else { |
| |
1414
| + this.$cache.min[0].style.visibility = "visible"; |
| |
1415
| + } |
| |
1416
| + |
| |
1417
| + if (this.labels.p_single_left + this.labels.p_single_fake > 100 - this.labels.p_max - 1) { |
| |
1418
| + this.$cache.max[0].style.visibility = "hidden"; |
| |
1419
| + } else { |
| |
1420
| + this.$cache.max[0].style.visibility = "visible"; |
| |
1421
| + } |
| |
1422
| + |
| |
1423
| + } else { |
| |
1424
| + |
| |
1425
| + if (values_num) { |
| |
1426
| + |
| |
1427
| + if (this.options.decorate_both) { |
| |
1428
| + text_single = this.decorate(p_values[this.result.from]); |
| |
1429
| + text_single += this.options.values_separator; |
| |
1430
| + text_single += this.decorate(p_values[this.result.to]); |
| |
1431
| + } else { |
| |
1432
| + text_single = this.decorate(p_values[this.result.from] + this.options.values_separator + p_values[this.result.to]); |
| |
1433
| + } |
| |
1434
| + text_from = this.decorate(p_values[this.result.from]); |
| |
1435
| + text_to = this.decorate(p_values[this.result.to]); |
| |
1436
| + |
| |
1437
| + this.$cache.single.html(text_single); |
| |
1438
| + this.$cache.from.html(text_from); |
| |
1439
| + this.$cache.to.html(text_to); |
| |
1440
| + |
| |
1441
| + } else { |
| |
1442
| + |
| |
1443
| + if (this.options.decorate_both) { |
| |
1444
| + text_single = this.decorate(this._prettify(this.result.from), this.result.from); |
| |
1445
| + text_single += this.options.values_separator; |
| |
1446
| + text_single += this.decorate(this._prettify(this.result.to), this.result.to); |
| |
1447
| + } else { |
| |
1448
| + text_single = this.decorate(this._prettify(this.result.from) + this.options.values_separator + this._prettify(this.result.to), this.result.to); |
| |
1449
| + } |
| |
1450
| + text_from = this.decorate(this._prettify(this.result.from), this.result.from); |
| |
1451
| + text_to = this.decorate(this._prettify(this.result.to), this.result.to); |
| |
1452
| + |
| |
1453
| + this.$cache.single.html(text_single); |
| |
1454
| + this.$cache.from.html(text_from); |
| |
1455
| + this.$cache.to.html(text_to); |
| |
1456
| + |
| |
1457
| + } |
| |
1458
| + |
| |
1459
| + this.calcLabels(); |
| |
1460
| + |
| |
1461
| + var min = Math.min(this.labels.p_single_left, this.labels.p_from_left), |
| |
1462
| + single_left = this.labels.p_single_left + this.labels.p_single_fake, |
| |
1463
| + to_left = this.labels.p_to_left + this.labels.p_to_fake, |
| |
1464
| + max = Math.max(single_left, to_left); |
| |
1465
| + |
| |
1466
| + if (this.labels.p_from_left + this.labels.p_from_fake >= this.labels.p_to_left) { |
| |
1467
| + this.$cache.from[0].style.visibility = "hidden"; |
| |
1468
| + this.$cache.to[0].style.visibility = "hidden"; |
| |
1469
| + this.$cache.single[0].style.visibility = "visible"; |
| |
1470
| + |
| |
1471
| + if (this.result.from === this.result.to) { |
| |
1472
| + if (this.target === "from") { |
| |
1473
| + this.$cache.from[0].style.visibility = "visible"; |
| |
1474
| + } else if (this.target === "to") { |
| |
1475
| + this.$cache.to[0].style.visibility = "visible"; |
| |
1476
| + } else if (!this.target) { |
| |
1477
| + this.$cache.from[0].style.visibility = "visible"; |
| |
1478
| + } |
| |
1479
| + this.$cache.single[0].style.visibility = "hidden"; |
| |
1480
| + max = to_left; |
| |
1481
| + } else { |
| |
1482
| + this.$cache.from[0].style.visibility = "hidden"; |
| |
1483
| + this.$cache.to[0].style.visibility = "hidden"; |
| |
1484
| + this.$cache.single[0].style.visibility = "visible"; |
| |
1485
| + max = Math.max(single_left, to_left); |
| |
1486
| + } |
| |
1487
| + } else { |
| |
1488
| + this.$cache.from[0].style.visibility = "visible"; |
| |
1489
| + this.$cache.to[0].style.visibility = "visible"; |
| |
1490
| + this.$cache.single[0].style.visibility = "hidden"; |
| |
1491
| + } |
| |
1492
| + |
| |
1493
| + if (min < this.labels.p_min + 1) { |
| |
1494
| + this.$cache.min[0].style.visibility = "hidden"; |
| |
1495
| + } else { |
| |
1496
| + this.$cache.min[0].style.visibility = "visible"; |
| |
1497
| + } |
| |
1498
| + |
| |
1499
| + if (max > 100 - this.labels.p_max - 1) { |
| |
1500
| + this.$cache.max[0].style.visibility = "hidden"; |
| |
1501
| + } else { |
| |
1502
| + this.$cache.max[0].style.visibility = "visible"; |
| |
1503
| + } |
| |
1504
| + |
| |
1505
| + } |
| |
1506
| + }, |
| |
1507
| + |
| |
1508
| + /** |
| |
1509
| + * Draw shadow intervals |
| |
1510
| + */ |
| |
1511
| + drawShadow: function () { |
| |
1512
| + var o = this.options, |
| |
1513
| + c = this.$cache, |
| |
1514
| + |
| |
1515
| + is_from_min = typeof o.from_min === "number" && !isNaN(o.from_min), |
| |
1516
| + is_from_max = typeof o.from_max === "number" && !isNaN(o.from_max), |
| |
1517
| + is_to_min = typeof o.to_min === "number" && !isNaN(o.to_min), |
| |
1518
| + is_to_max = typeof o.to_max === "number" && !isNaN(o.to_max), |
| |
1519
| + |
| |
1520
| + from_min, |
| |
1521
| + from_max, |
| |
1522
| + to_min, |
| |
1523
| + to_max; |
| |
1524
| + |
| |
1525
| + if (o.type === "single") { |
| |
1526
| + if (o.from_shadow && (is_from_min || is_from_max)) { |
| |
1527
| + from_min = this.convertToPercent(is_from_min ? o.from_min : o.min); |
| |
1528
| + from_max = this.convertToPercent(is_from_max ? o.from_max : o.max) - from_min; |
| |
1529
| + from_min = this.toFixed(from_min - (this.coords.p_handle / 100 * from_min)); |
| |
1530
| + from_max = this.toFixed(from_max - (this.coords.p_handle / 100 * from_max)); |
| |
1531
| + from_min = from_min + (this.coords.p_handle / 2); |
| |
1532
| + |
| |
1533
| + c.shad_single[0].style.display = "block"; |
| |
1534
| + c.shad_single[0].style.left = from_min + "%"; |
| |
1535
| + c.shad_single[0].style.width = from_max + "%"; |
| |
1536
| + } else { |
| |
1537
| + c.shad_single[0].style.display = "none"; |
| |
1538
| + } |
| |
1539
| + } else { |
| |
1540
| + if (o.from_shadow && (is_from_min || is_from_max)) { |
| |
1541
| + from_min = this.convertToPercent(is_from_min ? o.from_min : o.min); |
| |
1542
| + from_max = this.convertToPercent(is_from_max ? o.from_max : o.max) - from_min; |
| |
1543
| + from_min = this.toFixed(from_min - (this.coords.p_handle / 100 * from_min)); |
| |
1544
| + from_max = this.toFixed(from_max - (this.coords.p_handle / 100 * from_max)); |
| |
1545
| + from_min = from_min + (this.coords.p_handle / 2); |
| |
1546
| + |
| |
1547
| + c.shad_from[0].style.display = "block"; |
| |
1548
| + c.shad_from[0].style.left = from_min + "%"; |
| |
1549
| + c.shad_from[0].style.width = from_max + "%"; |
| |
1550
| + } else { |
| |
1551
| + c.shad_from[0].style.display = "none"; |
| |
1552
| + } |
| |
1553
| + |
| |
1554
| + if (o.to_shadow && (is_to_min || is_to_max)) { |
| |
1555
| + to_min = this.convertToPercent(is_to_min ? o.to_min : o.min); |
| |
1556
| + to_max = this.convertToPercent(is_to_max ? o.to_max : o.max) - to_min; |
| |
1557
| + to_min = this.toFixed(to_min - (this.coords.p_handle / 100 * to_min)); |
| |
1558
| + to_max = this.toFixed(to_max - (this.coords.p_handle / 100 * to_max)); |
| |
1559
| + to_min = to_min + (this.coords.p_handle / 2); |
| |
1560
| + |
| |
1561
| + c.shad_to[0].style.display = "block"; |
| |
1562
| + c.shad_to[0].style.left = to_min + "%"; |
| |
1563
| + c.shad_to[0].style.width = to_max + "%"; |
| |
1564
| + } else { |
| |
1565
| + c.shad_to[0].style.display = "none"; |
| |
1566
| + } |
| |
1567
| + } |
| |
1568
| + }, |
| |
1569
| + |
| |
1570
| + |
| |
1571
| + |
| |
1572
| + // ============================================================================================================= |
| |
1573
| + // Callbacks |
| |
1574
| + |
| |
1575
| + callOnStart: function () { |
| |
1576
| + if (this.options.onStart && typeof this.options.onStart === "function") { |
| |
1577
| + this.options.onStart(this.result); |
| |
1578
| + } |
| |
1579
| + }, |
| |
1580
| + callOnChange: function () { |
| |
1581
| + if (this.options.onChange && typeof this.options.onChange === "function") { |
| |
1582
| + this.options.onChange(this.result); |
| |
1583
| + } |
| |
1584
| + }, |
| |
1585
| + callOnFinish: function () { |
| |
1586
| + if (this.options.onFinish && typeof this.options.onFinish === "function") { |
| |
1587
| + this.options.onFinish(this.result); |
| |
1588
| + } |
| |
1589
| + }, |
| |
1590
| + callOnUpdate: function () { |
| |
1591
| + if (this.options.onUpdate && typeof this.options.onUpdate === "function") { |
| |
1592
| + this.options.onUpdate(this.result); |
| |
1593
| + } |
| |
1594
| + }, |
| |
1595
| + |
| |
1596
| + |
| |
1597
| + |
| |
1598
| + // ============================================================================================================= |
| |
1599
| + // Service methods |
| |
1600
| + |
| |
1601
| + toggleInput: function () { |
| |
1602
| + this.$cache.input.toggleClass("irs-hidden-input"); |
| |
1603
| + }, |
| |
1604
| + |
| |
1605
| + /** |
| |
1606
| + * Convert real value to percent |
| |
1607
| + * |
| |
1608
| + * @param value {Number} X in real |
| |
1609
| + * @param no_min {boolean=} don't use min value |
| |
1610
| + * @returns {Number} X in percent |
| |
1611
| + */ |
| |
1612
| + convertToPercent: function (value, no_min) { |
| |
1613
| + var diapason = this.options.max - this.options.min, |
| |
1614
| + one_percent = diapason / 100, |
| |
1615
| + val, percent; |
| |
1616
| + |
| |
1617
| + if (!diapason) { |
| |
1618
| + this.no_diapason = true; |
| |
1619
| + return 0; |
| |
1620
| + } |
| |
1621
| + |
| |
1622
| + if (no_min) { |
| |
1623
| + val = value; |
| |
1624
| + } else { |
| |
1625
| + val = value - this.options.min; |
| |
1626
| + } |
| |
1627
| + |
| |
1628
| + percent = val / one_percent; |
| |
1629
| + |
| |
1630
| + return this.toFixed(percent); |
| |
1631
| + }, |
| |
1632
| + |
| |
1633
| + /** |
| |
1634
| + * Convert percent to real values |
| |
1635
| + * |
| |
1636
| + * @param percent {Number} X in percent |
| |
1637
| + * @returns {Number} X in real |
| |
1638
| + */ |
| |
1639
| + convertToValue: function (percent) { |
| |
1640
| + var min = this.options.min, |
| |
1641
| + max = this.options.max, |
| |
1642
| + min_decimals = min.toString().split(".")[1], |
| |
1643
| + max_decimals = max.toString().split(".")[1], |
| |
1644
| + min_length, max_length, |
| |
1645
| + avg_decimals = 0, |
| |
1646
| + abs = 0; |
| |
1647
| + |
| |
1648
| + if (percent === 0) { |
| |
1649
| + return this.options.min; |
| |
1650
| + } |
| |
1651
| + if (percent === 100) { |
| |
1652
| + return this.options.max; |
| |
1653
| + } |
| |
1654
| + |
| |
1655
| + |
| |
1656
| + if (min_decimals) { |
| |
1657
| + min_length = min_decimals.length; |
| |
1658
| + avg_decimals = min_length; |
| |
1659
| + } |
| |
1660
| + if (max_decimals) { |
| |
1661
| + max_length = max_decimals.length; |
| |
1662
| + avg_decimals = max_length; |
| |
1663
| + } |
| |
1664
| + if (min_length && max_length) { |
| |
1665
| + avg_decimals = (min_length >= max_length) ? min_length : max_length; |
| |
1666
| + } |
| |
1667
| + |
| |
1668
| + if (min < 0) { |
| |
1669
| + abs = Math.abs(min); |
| |
1670
| + min = +(min + abs).toFixed(avg_decimals); |
| |
1671
| + max = +(max + abs).toFixed(avg_decimals); |
| |
1672
| + } |
| |
1673
| + |
| |
1674
| + var number = ((max - min) / 100 * percent) + min, |
| |
1675
| + string = this.options.step.toString().split(".")[1], |
| |
1676
| + result; |
| |
1677
| + |
| |
1678
| + if (string) { |
| |
1679
| + number = +number.toFixed(string.length); |
| |
1680
| + } else { |
| |
1681
| + number = number / this.options.step; |
| |
1682
| + number = number * this.options.step; |
| |
1683
| + |
| |
1684
| + number = +number.toFixed(0); |
| |
1685
| + } |
| |
1686
| + |
| |
1687
| + if (abs) { |
| |
1688
| + number -= abs; |
| |
1689
| + } |
| |
1690
| + |
| |
1691
| + if (string) { |
| |
1692
| + result = +number.toFixed(string.length); |
| |
1693
| + } else { |
| |
1694
| + result = this.toFixed(number); |
| |
1695
| + } |
| |
1696
| + |
| |
1697
| + if (result < this.options.min) { |
| |
1698
| + result = this.options.min; |
| |
1699
| + } else if (result > this.options.max) { |
| |
1700
| + result = this.options.max; |
| |
1701
| + } |
| |
1702
| + |
| |
1703
| + return result; |
| |
1704
| + }, |
| |
1705
| + |
| |
1706
| + /** |
| |
1707
| + * Round percent value with step |
| |
1708
| + * |
| |
1709
| + * @param percent {Number} |
| |
1710
| + * @returns percent {Number} rounded |
| |
1711
| + */ |
| |
1712
| + calcWithStep: function (percent) { |
| |
1713
| + var rounded = Math.round(percent / this.coords.p_step) * this.coords.p_step; |
| |
1714
| + |
| |
1715
| + if (rounded > 100) { |
| |
1716
| + rounded = 100; |
| |
1717
| + } |
| |
1718
| + if (percent === 100) { |
| |
1719
| + rounded = 100; |
| |
1720
| + } |
| |
1721
| + |
| |
1722
| + return this.toFixed(rounded); |
| |
1723
| + }, |
| |
1724
| + |
| |
1725
| + checkMinInterval: function (p_current, p_next, type) { |
| |
1726
| + var o = this.options, |
| |
1727
| + current, |
| |
1728
| + next; |
| |
1729
| + |
| |
1730
| + if (!o.min_interval) { |
| |
1731
| + return p_current; |
| |
1732
| + } |
| |
1733
| + |
| |
1734
| + current = this.convertToValue(p_current); |
| |
1735
| + next = this.convertToValue(p_next); |
| |
1736
| + |
| |
1737
| + if (type === "from") { |
| |
1738
| + |
| |
1739
| + if (next - current < o.min_interval) { |
| |
1740
| + current = next - o.min_interval; |
| |
1741
| + } |
| |
1742
| + |
| |
1743
| + } else { |
| |
1744
| + |
| |
1745
| + if (current - next < o.min_interval) { |
| |
1746
| + current = next + o.min_interval; |
| |
1747
| + } |
| |
1748
| + |
| |
1749
| + } |
| |
1750
| + |
| |
1751
| + return this.convertToPercent(current); |
| |
1752
| + }, |
| |
1753
| + |
| |
1754
| + checkMaxInterval: function (p_current, p_next, type) { |
| |
1755
| + var o = this.options, |
| |
1756
| + current, |
| |
1757
| + next; |
| |
1758
| + |
| |
1759
| + if (!o.max_interval) { |
| |
1760
| + return p_current; |
| |
1761
| + } |
| |
1762
| + |
| |
1763
| + current = this.convertToValue(p_current); |
| |
1764
| + next = this.convertToValue(p_next); |
| |
1765
| + |
| |
1766
| + if (type === "from") { |
| |
1767
| + |
| |
1768
| + if (next - current > o.max_interval) { |
| |
1769
| + current = next - o.max_interval; |
| |
1770
| + } |
| |
1771
| + |
| |
1772
| + } else { |
| |
1773
| + |
| |
1774
| + if (current - next > o.max_interval) { |
| |
1775
| + current = next + o.max_interval; |
| |
1776
| + } |
| |
1777
| + |
| |
1778
| + } |
| |
1779
| + |
| |
1780
| + return this.convertToPercent(current); |
| |
1781
| + }, |
| |
1782
| + |
| |
1783
| + checkDiapason: function (p_num, min, max) { |
| |
1784
| + var num = this.convertToValue(p_num), |
| |
1785
| + o = this.options; |
| |
1786
| + |
| |
1787
| + if (typeof min !== "number") { |
| |
1788
| + min = o.min; |
| |
1789
| + } |
| |
1790
| + |
| |
1791
| + if (typeof max !== "number") { |
| |
1792
| + max = o.max; |
| |
1793
| + } |
| |
1794
| + |
| |
1795
| + if (num < min) { |
| |
1796
| + num = min; |
| |
1797
| + } |
| |
1798
| + |
| |
1799
| + if (num > max) { |
| |
1800
| + num = max; |
| |
1801
| + } |
| |
1802
| + |
| |
1803
| + return this.convertToPercent(num); |
| |
1804
| + }, |
| |
1805
| + |
| |
1806
| + toFixed: function (num) { |
| |
1807
| + num = num.toFixed(9); |
| |
1808
| + return +num; |
| |
1809
| + }, |
| |
1810
| + |
| |
1811
| + _prettify: function (num) { |
| |
1812
| + if (!this.options.prettify_enabled) { |
| |
1813
| + return num; |
| |
1814
| + } |
| |
1815
| + |
| |
1816
| + if (this.options.prettify && typeof this.options.prettify === "function") { |
| |
1817
| + return this.options.prettify(num); |
| |
1818
| + } else { |
| |
1819
| + return this.prettify(num); |
| |
1820
| + } |
| |
1821
| + }, |
| |
1822
| + |
| |
1823
| + prettify: function (num) { |
| |
1824
| + var n = num.toString(); |
| |
1825
| + return n.replace(/(\d{1,3}(?=(?:\d\d\d)+(?!\d)))/g, "$1" + this.options.prettify_separator); |
| |
1826
| + }, |
| |
1827
| + |
| |
1828
| + checkEdges: function (left, width) { |
| |
1829
| + if (!this.options.force_edges) { |
| |
1830
| + return this.toFixed(left); |
| |
1831
| + } |
| |
1832
| + |
| |
1833
| + if (left < 0) { |
| |
1834
| + left = 0; |
| |
1835
| + } else if (left > 100 - width) { |
| |
1836
| + left = 100 - width; |
| |
1837
| + } |
| |
1838
| + |
| |
1839
| + return this.toFixed(left); |
| |
1840
| + }, |
| |
1841
| + |
| |
1842
| + validate: function () { |
| |
1843
| + var o = this.options, |
| |
1844
| + r = this.result, |
| |
1845
| + v = o.values, |
| |
1846
| + vl = v.length, |
| |
1847
| + value, |
| |
1848
| + i; |
| |
1849
| + |
| |
1850
| + if (typeof o.min === "string") o.min = +o.min; |
| |
1851
| + if (typeof o.max === "string") o.max = +o.max; |
| |
1852
| + if (typeof o.from === "string") o.from = +o.from; |
| |
1853
| + if (typeof o.to === "string") o.to = +o.to; |
| |
1854
| + if (typeof o.step === "string") o.step = +o.step; |
| |
1855
| + |
| |
1856
| + if (typeof o.from_min === "string") o.from_min = +o.from_min; |
| |
1857
| + if (typeof o.from_max === "string") o.from_max = +o.from_max; |
| |
1858
| + if (typeof o.to_min === "string") o.to_min = +o.to_min; |
| |
1859
| + if (typeof o.to_max === "string") o.to_max = +o.to_max; |
| |
1860
| + |
| |
1861
| + if (typeof o.keyboard_step === "string") o.keyboard_step = +o.keyboard_step; |
| |
1862
| + if (typeof o.grid_num === "string") o.grid_num = +o.grid_num; |
| |
1863
| + |
| |
1864
| + if (o.max < o.min) { |
| |
1865
| + o.max = o.min; |
| |
1866
| + } |
| |
1867
| + |
| |
1868
| + if (vl) { |
| |
1869
| + o.p_values = []; |
| |
1870
| + o.min = 0; |
| |
1871
| + o.max = vl - 1; |
| |
1872
| + o.step = 1; |
| |
1873
| + o.grid_num = o.max; |
| |
1874
| + o.grid_snap = true; |
| |
1875
| + |
| |
1876
| + |
| |
1877
| + for (i = 0; i < vl; i++) { |
| |
1878
| + value = +v[i]; |
| |
1879
| + |
| |
1880
| + if (!isNaN(value)) { |
| |
1881
| + v[i] = value; |
| |
1882
| + value = this._prettify(value); |
| |
1883
| + } else { |
| |
1884
| + value = v[i]; |
| |
1885
| + } |
| |
1886
| + |
| |
1887
| + o.p_values.push(value); |
| |
1888
| + } |
| |
1889
| + } |
| |
1890
| + |
| |
1891
| + if (typeof o.from !== "number" || isNaN(o.from)) { |
| |
1892
| + o.from = o.min; |
| |
1893
| + } |
| |
1894
| + |
| |
1895
| + if (typeof o.to !== "number" || isNaN(o.from)) { |
| |
1896
| + o.to = o.max; |
| |
1897
| + } |
| |
1898
| + |
| |
1899
| + if (o.type === "single") { |
| |
1900
| + |
| |
1901
| + if (o.from < o.min) { |
| |
1902
| + o.from = o.min; |
| |
1903
| + } |
| |
1904
| + |
| |
1905
| + if (o.from > o.max) { |
| |
1906
| + o.from = o.max; |
| |
1907
| + } |
| |
1908
| + |
| |
1909
| + } else { |
| |
1910
| + |
| |
1911
| + if (o.from < o.min || o.from > o.max) { |
| |
1912
| + o.from = o.min; |
| |
1913
| + } |
| |
1914
| + if (o.to > o.max || o.to < o.min) { |
| |
1915
| + o.to = o.max; |
| |
1916
| + } |
| |
1917
| + if (o.from > o.to) { |
| |
1918
| + o.from = o.to; |
| |
1919
| + } |
| |
1920
| + |
| |
1921
| + } |
| |
1922
| + |
| |
1923
| + if (typeof o.step !== "number" || isNaN(o.step) || !o.step || o.step < 0) { |
| |
1924
| + o.step = 1; |
| |
1925
| + } |
| |
1926
| + |
| |
1927
| + if (typeof o.keyboard_step !== "number" || isNaN(o.keyboard_step) || !o.keyboard_step || o.keyboard_step < 0) { |
| |
1928
| + o.keyboard_step = 5; |
| |
1929
| + } |
| |
1930
| + |
| |
1931
| + if (typeof o.from_min === "number" && o.from < o.from_min) { |
| |
1932
| + o.from = o.from_min; |
| |
1933
| + } |
| |
1934
| + |
| |
1935
| + if (typeof o.from_max === "number" && o.from > o.from_max) { |
| |
1936
| + o.from = o.from_max; |
| |
1937
| + } |
| |
1938
| + |
| |
1939
| + if (typeof o.to_min === "number" && o.to < o.to_min) { |
| |
1940
| + o.to = o.to_min; |
| |
1941
| + } |
| |
1942
| + |
| |
1943
| + if (typeof o.to_max === "number" && o.from > o.to_max) { |
| |
1944
| + o.to = o.to_max; |
| |
1945
| + } |
| |
1946
| + |
| |
1947
| + if (r) { |
| |
1948
| + if (r.min !== o.min) { |
| |
1949
| + r.min = o.min; |
| |
1950
| + } |
| |
1951
| + |
| |
1952
| + if (r.max !== o.max) { |
| |
1953
| + r.max = o.max; |
| |
1954
| + } |
| |
1955
| + |
| |
1956
| + if (r.from < r.min || r.from > r.max) { |
| |
1957
| + r.from = o.from; |
| |
1958
| + } |
| |
1959
| + |
| |
1960
| + if (r.to < r.min || r.to > r.max) { |
| |
1961
| + r.to = o.to; |
| |
1962
| + } |
| |
1963
| + } |
| |
1964
| + |
| |
1965
| + if (typeof o.min_interval !== "number" || isNaN(o.min_interval) || !o.min_interval || o.min_interval < 0) { |
| |
1966
| + o.min_interval = 0; |
| |
1967
| + } |
| |
1968
| + |
| |
1969
| + if (typeof o.max_interval !== "number" || isNaN(o.max_interval) || !o.max_interval || o.max_interval < 0) { |
| |
1970
| + o.max_interval = 0; |
| |
1971
| + } |
| |
1972
| + |
| |
1973
| + if (o.min_interval && o.min_interval > o.max - o.min) { |
| |
1974
| + o.min_interval = o.max - o.min; |
| |
1975
| + } |
| |
1976
| + |
| |
1977
| + if (o.max_interval && o.max_interval > o.max - o.min) { |
| |
1978
| + o.max_interval = o.max - o.min; |
| |
1979
| + } |
| |
1980
| + }, |
| |
1981
| + |
| |
1982
| + decorate: function (num, original) { |
| |
1983
| + var decorated = "", |
| |
1984
| + o = this.options; |
| |
1985
| + |
| |
1986
| + if (o.prefix) { |
| |
1987
| + decorated += o.prefix; |
| |
1988
| + } |
| |
1989
| + |
| |
1990
| + decorated += num; |
| |
1991
| + |
| |
1992
| + if (o.max_postfix) { |
| |
1993
| + if (o.values.length && num === o.p_values[o.max]) { |
| |
1994
| + decorated += o.max_postfix; |
| |
1995
| + if (o.postfix) { |
| |
1996
| + decorated += " "; |
| |
1997
| + } |
| |
1998
| + } else if (original === o.max) { |
| |
1999
| + decorated += o.max_postfix; |
| |
2000
| + if (o.postfix) { |
| |
2001
| + decorated += " "; |
| |
2002
| + } |
| |
2003
| + } |
| |
2004
| + } |
| |
2005
| + |
| |
2006
| + if (o.postfix) { |
| |
2007
| + decorated += o.postfix; |
| |
2008
| + } |
| |
2009
| + |
| |
2010
| + return decorated; |
| |
2011
| + }, |
| |
2012
| + |
| |
2013
| + updateFrom: function () { |
| |
2014
| + this.result.from = this.options.from; |
| |
2015
| + this.result.from_percent = this.convertToPercent(this.result.from); |
| |
2016
| + if (this.options.values) { |
| |
2017
| + this.result.from_value = this.options.values[this.result.from]; |
| |
2018
| + } |
| |
2019
| + }, |
| |
2020
| + |
| |
2021
| + updateTo: function () { |
| |
2022
| + this.result.to = this.options.to; |
| |
2023
| + this.result.to_percent = this.convertToPercent(this.result.to); |
| |
2024
| + if (this.options.values) { |
| |
2025
| + this.result.to_value = this.options.values[this.result.to]; |
| |
2026
| + } |
| |
2027
| + }, |
| |
2028
| + |
| |
2029
| + updateResult: function () { |
| |
2030
| + this.result.min = this.options.min; |
| |
2031
| + this.result.max = this.options.max; |
| |
2032
| + this.updateFrom(); |
| |
2033
| + this.updateTo(); |
| |
2034
| + }, |
| |
2035
| + |
| |
2036
| + |
| |
2037
| + // ============================================================================================================= |
| |
2038
| + // Grid |
| |
2039
| + |
| |
2040
| + appendGrid: function () { |
| |
2041
| + if (!this.options.grid) { |
| |
2042
| + return; |
| |
2043
| + } |
| |
2044
| + |
| |
2045
| + var o = this.options, |
| |
2046
| + i, z, |
| |
2047
| + |
| |
2048
| + total = o.max - o.min, |
| |
2049
| + big_num = o.grid_num, |
| |
2050
| + big_p = 0, |
| |
2051
| + big_w = 0, |
| |
2052
| + |
| |
2053
| + small_max = 4, |
| |
2054
| + local_small_max, |
| |
2055
| + small_p, |
| |
2056
| + small_w = 0, |
| |
2057
| + |
| |
2058
| + result, |
| |
2059
| + html = ''; |
| |
2060
| + |
| |
2061
| + |
| |
2062
| + |
| |
2063
| + this.calcGridMargin(); |
| |
2064
| + |
| |
2065
| + if (o.grid_snap) { |
| |
2066
| + big_num = total / o.step; |
| |
2067
| + big_p = this.toFixed(o.step / (total / 100)); |
| |
2068
| + } else { |
| |
2069
| + big_p = this.toFixed(100 / big_num); |
| |
2070
| + } |
| |
2071
| + |
| |
2072
| + if (big_num > 4) { |
| |
2073
| + small_max = 3; |
| |
2074
| + } |
| |
2075
| + if (big_num > 7) { |
| |
2076
| + small_max = 2; |
| |
2077
| + } |
| |
2078
| + if (big_num > 14) { |
| |
2079
| + small_max = 1; |
| |
2080
| + } |
| |
2081
| + if (big_num > 28) { |
| |
2082
| + small_max = 0; |
| |
2083
| + } |
| |
2084
| + |
| |
2085
| + for (i = 0; i < big_num + 1; i++) { |
| |
2086
| + local_small_max = small_max; |
| |
2087
| + |
| |
2088
| + big_w = this.toFixed(big_p * i); |
| |
2089
| + |
| |
2090
| + if (big_w > 100) { |
| |
2091
| + big_w = 100; |
| |
2092
| + |
| |
2093
| + local_small_max -= 2; |
| |
2094
| + if (local_small_max < 0) { |
| |
2095
| + local_small_max = 0; |
| |
2096
| + } |
| |
2097
| + } |
| |
2098
| + this.coords.big[i] = big_w; |
| |
2099
| + |
| |
2100
| + small_p = (big_w - (big_p * (i - 1))) / (local_small_max + 1); |
| |
2101
| + |
| |
2102
| + for (z = 1; z <= local_small_max; z++) { |
| |
2103
| + if (big_w === 0) { |
| |
2104
| + break; |
| |
2105
| + } |
| |
2106
| + |
| |
2107
| + small_w = this.toFixed(big_w - (small_p * z)); |
| |
2108
| + |
| |
2109
| + html += '<span class="irs-grid-pol small" style="left: ' + small_w + '%"></span>'; |
| |
2110
| + } |
| |
2111
| + |
| |
2112
| + html += '<span class="irs-grid-pol" style="left: ' + big_w + '%"></span>'; |
| |
2113
| + |
| |
2114
| + result = this.convertToValue(big_w); |
| |
2115
| + if (o.values.length) { |
| |
2116
| + result = o.p_values[result]; |
| |
2117
| + } else { |
| |
2118
| + result = this._prettify(result); |
| |
2119
| + } |
| |
2120
| + |
| |
2121
| + html += '<span class="irs-grid-text js-grid-text-' + i + '" style="left: ' + big_w + '%">' + result + '</span>'; |
| |
2122
| + } |
| |
2123
| + this.coords.big_num = Math.ceil(big_num + 1); |
| |
2124
| + |
| |
2125
| + |
| |
2126
| + |
| |
2127
| + this.$cache.cont.addClass("irs-with-grid"); |
| |
2128
| + this.$cache.grid.html(html); |
| |
2129
| + this.cacheGridLabels(); |
| |
2130
| + }, |
| |
2131
| + |
| |
2132
| + cacheGridLabels: function () { |
| |
2133
| + var $label, i, |
| |
2134
| + num = this.coords.big_num; |
| |
2135
| + |
| |
2136
| + for (i = 0; i < num; i++) { |
| |
2137
| + $label = this.$cache.grid.find(".js-grid-text-" + i); |
| |
2138
| + this.$cache.grid_labels.push($label); |
| |
2139
| + } |
| |
2140
| + |
| |
2141
| + this.calcGridLabels(); |
| |
2142
| + }, |
| |
2143
| + |
| |
2144
| + calcGridLabels: function () { |
| |
2145
| + var i, label, start = [], finish = [], |
| |
2146
| + num = this.coords.big_num; |
| |
2147
| + |
| |
2148
| + for (i = 0; i < num; i++) { |
| |
2149
| + this.coords.big_w[i] = this.$cache.grid_labels[i].outerWidth(false); |
| |
2150
| + this.coords.big_p[i] = this.toFixed(this.coords.big_w[i] / this.coords.w_rs * 100); |
| |
2151
| + this.coords.big_x[i] = this.toFixed(this.coords.big_p[i] / 2); |
| |
2152
| + |
| |
2153
| + start[i] = this.toFixed(this.coords.big[i] - this.coords.big_x[i]); |
| |
2154
| + finish[i] = this.toFixed(start[i] + this.coords.big_p[i]); |
| |
2155
| + } |
| |
2156
| + |
| |
2157
| + if (this.options.force_edges) { |
| |
2158
| + if (start[0] < -this.coords.grid_gap) { |
| |
2159
| + start[0] = -this.coords.grid_gap; |
| |
2160
| + finish[0] = this.toFixed(start[0] + this.coords.big_p[0]); |
| |
2161
| + |
| |
2162
| + this.coords.big_x[0] = this.coords.grid_gap; |
| |
2163
| + } |
| |
2164
| + |
| |
2165
| + if (finish[num - 1] > 100 + this.coords.grid_gap) { |
| |
2166
| + finish[num - 1] = 100 + this.coords.grid_gap; |
| |
2167
| + start[num - 1] = this.toFixed(finish[num - 1] - this.coords.big_p[num - 1]); |
| |
2168
| + |
| |
2169
| + this.coords.big_x[num - 1] = this.toFixed(this.coords.big_p[num - 1] - this.coords.grid_gap); |
| |
2170
| + } |
| |
2171
| + } |
| |
2172
| + |
| |
2173
| + this.calcGridCollision(2, start, finish); |
| |
2174
| + this.calcGridCollision(4, start, finish); |
| |
2175
| + |
| |
2176
| + for (i = 0; i < num; i++) { |
| |
2177
| + label = this.$cache.grid_labels[i][0]; |
| |
2178
| + label.style.marginLeft = -this.coords.big_x[i] + "%"; |
| |
2179
| + } |
| |
2180
| + }, |
| |
2181
| + |
| |
2182
| + // Collisions Calc Beta |
| |
2183
| + // TODO: Refactor then have plenty of time |
| |
2184
| + calcGridCollision: function (step, start, finish) { |
| |
2185
| + var i, next_i, label, |
| |
2186
| + num = this.coords.big_num; |
| |
2187
| + |
| |
2188
| + for (i = 0; i < num; i += step) { |
| |
2189
| + next_i = i + (step / 2); |
| |
2190
| + if (next_i >= num) { |
| |
2191
| + break; |
| |
2192
| + } |
| |
2193
| + |
| |
2194
| + label = this.$cache.grid_labels[next_i][0]; |
| |
2195
| + |
| |
2196
| + if (finish[i] <= start[next_i]) { |
| |
2197
| + label.style.visibility = "visible"; |
| |
2198
| + } else { |
| |
2199
| + label.style.visibility = "hidden"; |
| |
2200
| + } |
| |
2201
| + } |
| |
2202
| + }, |
| |
2203
| + |
| |
2204
| + calcGridMargin: function () { |
| |
2205
| + if (!this.options.grid_margin) { |
| |
2206
| + return; |
| |
2207
| + } |
| |
2208
| + |
| |
2209
| + this.coords.w_rs = this.$cache.rs.outerWidth(false); |
| |
2210
| + if (!this.coords.w_rs) { |
| |
2211
| + return; |
| |
2212
| + } |
| |
2213
| + |
| |
2214
| + if (this.options.type === "single") { |
| |
2215
| + this.coords.w_handle = this.$cache.s_single.outerWidth(false); |
| |
2216
| + } else { |
| |
2217
| + this.coords.w_handle = this.$cache.s_from.outerWidth(false); |
| |
2218
| + } |
| |
2219
| + this.coords.p_handle = this.toFixed(this.coords.w_handle / this.coords.w_rs * 100); |
| |
2220
| + this.coords.grid_gap = this.toFixed((this.coords.p_handle / 2) - 0.1); |
| |
2221
| + |
| |
2222
| + this.$cache.grid[0].style.width = this.toFixed(100 - this.coords.p_handle) + "%"; |
| |
2223
| + this.$cache.grid[0].style.left = this.coords.grid_gap + "%"; |
| |
2224
| + }, |
| |
2225
| + |
| |
2226
| + |
| |
2227
| + |
| |
2228
| + // ============================================================================================================= |
| |
2229
| + // Public methods |
| |
2230
| + |
| |
2231
| + update: function (options) { |
| |
2232
| + if (!this.input) { |
| |
2233
| + return; |
| |
2234
| + } |
| |
2235
| + |
| |
2236
| + this.is_update = true; |
| |
2237
| + |
| |
2238
| + this.options.from = this.result.from; |
| |
2239
| + this.options.to = this.result.to; |
| |
2240
| + |
| |
2241
| + this.options = $.extend(this.options, options); |
| |
2242
| + this.validate(); |
| |
2243
| + this.updateResult(options); |
| |
2244
| + |
| |
2245
| + this.toggleInput(); |
| |
2246
| + this.remove(); |
| |
2247
| + this.init(true); |
| |
2248
| + }, |
| |
2249
| + |
| |
2250
| + reset: function () { |
| |
2251
| + if (!this.input) { |
| |
2252
| + return; |
| |
2253
| + } |
| |
2254
| + |
| |
2255
| + this.updateResult(); |
| |
2256
| + this.update(); |
| |
2257
| + }, |
| |
2258
| + |
| |
2259
| + destroy: function () { |
| |
2260
| + if (!this.input) { |
| |
2261
| + return; |
| |
2262
| + } |
| |
2263
| + |
| |
2264
| + this.toggleInput(); |
| |
2265
| + this.$cache.input.prop("readonly", false); |
| |
2266
| + $.data(this.input, "ionRangeSlider", null); |
| |
2267
| + |
| |
2268
| + this.remove(); |
| |
2269
| + this.input = null; |
| |
2270
| + this.options = null; |
| |
2271
| + } |
| |
2272
| + }; |
| |
2273
| + |
| |
2274
| + $.fn.ionRangeSlider = function (options) { |
| |
2275
| + return this.each(function() { |
| |
2276
| + if (!$.data(this, "ionRangeSlider")) { |
| |
2277
| + $.data(this, "ionRangeSlider", new IonRangeSlider(this, options, plugin_count++)); |
| |
2278
| + } |
| |
2279
| + }); |
| |
2280
| + }; |
| |
2281
| + |
| |
2282
| + |
| |
2283
| + |
| |
2284
| + // ================================================================================================================= |
| |
2285
| + // http://paulirish.com/2011/requestanimationframe-for-smart-animating/ |
| |
2286
| + // http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating |
| |
2287
| + |
| |
2288
| + // requestAnimationFrame polyfill by Erik Möller. fixes from Paul Irish and Tino Zijdel |
| |
2289
| + |
| |
2290
| + // MIT license |
| |
2291
| + |
| |
2292
| + (function() { |
| |
2293
| + var lastTime = 0; |
| |
2294
| + var vendors = ['ms', 'moz', 'webkit', 'o']; |
| |
2295
| + for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { |
| |
2296
| + window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame']; |
| |
2297
| + window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame'] |
| |
2298
| + || window[vendors[x]+'CancelRequestAnimationFrame']; |
| |
2299
| + } |
| |
2300
| + |
| |
2301
| + if (!window.requestAnimationFrame) |
| |
2302
| + window.requestAnimationFrame = function(callback, element) { |
| |
2303
| + var currTime = new Date().getTime(); |
| |
2304
| + var timeToCall = Math.max(0, 16 - (currTime - lastTime)); |
| |
2305
| + var id = window.setTimeout(function() { callback(currTime + timeToCall); }, |
| |
2306
| + timeToCall); |
| |
2307
| + lastTime = currTime + timeToCall; |
| |
2308
| + return id; |
| |
2309
| + }; |
| |
2310
| + |
| |
2311
| + if (!window.cancelAnimationFrame) |
| |
2312
| + window.cancelAnimationFrame = function(id) { |
| |
2313
| + clearTimeout(id); |
| |
2314
| + }; |
| |
2315
| + }()); |
| |
2316
| + |
| |
2317
| +})); |