1/* ========================================================= 2 * bootstrap-slider.js v2.0.0 3 * http://www.eyecon.ro/bootstrap-slider 4 * ========================================================= 5 * Copyright 2012 Stefan Petre 6 * 7 * Licensed under the Apache License, Version 2.0 (the "License"); 8 * you may not use this file except in compliance with the License. 9 * You may obtain a copy of the License at 10 * 11 * http://www.apache.org/licenses/LICENSE-2.0 12 * 13 * Unless required by applicable law or agreed to in writing, software 14 * distributed under the License is distributed on an "AS IS" BASIS, 15 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 16 * See the License for the specific language governing permissions and 17 * limitations under the License. 18 * ========================================================= */ 19 20!function( $ ) { 21 22 var Slider = function(element, options) { 23 this.dragLocked = false; 24 this.limit = 100000; 25 this.element = $(element).hide(); 26 this.picker = $('<div class="slider">'+ 27 '<div class="slider-track">'+ 28 '<div class="slider-selection"></div>'+ 29 '<div class="slider-handle"></div>'+ 30 '<div class="slider-handle"></div>'+ 31 '</div>'+ 32 '<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'+ 33 '</div>') 34 .insertBefore(this.element) 35 .append(this.element); 36 this.id = this.element.data('slider-id')||options.id; 37 if (this.id) { 38 this.picker[0].id = this.id; 39 } 40 41 if (typeof Modernizr !== 'undefined' && Modernizr.touch) { 42 this.touchCapable = true; 43 } 44 45 var tooltip = this.element.data('slider-tooltip')||options.tooltip; 46 47 this.tooltip = this.picker.find('.tooltip'); 48 this.tooltipInner = this.tooltip.find('div.tooltip-inner'); 49 50 this.orientation = this.element.data('slider-orientation')||options.orientation; 51 switch(this.orientation) { 52 case 'vertical': 53 this.picker.addClass('slider-vertical'); 54 this.stylePos = 'top'; 55 this.mousePos = 'pageY'; 56 this.sizePos = 'offsetHeight'; 57 this.tooltip.addClass('right')[0].style.left = '100%'; 58 break; 59 default: 60 this.picker 61 .addClass('slider-horizontal') 62 .css('width', this.element.outerWidth()); 63 this.orientation = 'horizontal'; 64 this.stylePos = 'left'; 65 this.mousePos = 'pageX'; 66 this.sizePos = 'offsetWidth'; 67 this.tooltip.addClass('top')[0].style.top = -this.tooltip.outerHeight() - 14 + 'px'; 68 break; 69 } 70 71 this.min = this.element.data('slider-min')||options.min; 72 this.max = this.element.data('slider-max')||options.max; 73 this.step = this.element.data('slider-step')||options.step; 74 this.value = this.element.data('slider-value')||options.value; 75 if (this.value[1]) { 76 this.range = true; 77 } 78 79 this.selection = this.element.data('slider-selection')||options.selection; 80 this.selectionEl = this.picker.find('.slider-selection'); 81 if (this.selection === 'none') { 82 this.selectionEl.addClass('hide'); 83 } 84 this.selectionElStyle = this.selectionEl[0].style; 85 86 87 this.handle1 = this.picker.find('.slider-handle:first'); 88 this.handle1Stype = this.handle1[0].style; 89 this.handle2 = this.picker.find('.slider-handle:last'); 90 this.handle2Stype = this.handle2[0].style; 91 92 var handle = this.element.data('slider-handle')||options.handle; 93 switch(handle) { 94 case 'round': 95 this.handle1.addClass('round'); 96 this.handle2.addClass('round'); 97 break 98 case 'triangle': 99 this.handle1.addClass('triangle'); 100 this.handle2.addClass('triangle'); 101 break 102 } 103 104 if (this.range) { 105 this.value[0] = Math.max(this.min, Math.min(this.max, this.value[0])); 106 this.value[1] = Math.max(this.min, Math.min(this.max, this.value[1])); 107 } else { 108 this.value = [ Math.max(this.min, Math.min(this.max, this.value))]; 109 this.handle2.addClass('hide'); 110 if (this.selection == 'after') { 111 this.value[1] = this.max; 112 } else { 113 this.value[1] = this.min; 114 } 115 } 116 this.diff = this.max - this.min; 117 this.percentage = [ 118 (this.value[0]-this.min)*100/this.diff, 119 (this.value[1]-this.min)*100/this.diff, 120 this.step*100/this.diff 121 ]; 122 123 this.offset = this.picker.offset(); 124 this.size = this.picker[0][this.sizePos]; 125 126 this.formater = options.formater; 127 this.reversed = this.element.data('slider-reversed')||options.reversed; 128 129 this.layout(); 130 131 if (this.touchCapable) { 132 // Touch: Bind touch events: 133 this.picker.on({ 134 touchstart: $.proxy(this.mousedown, this) 135 }); 136 } else { 137 this.picker.on({ 138 mousedown: $.proxy(this.mousedown, this) 139 }); 140 } 141 142 if (tooltip === 'show') { 143 this.picker.on({ 144 mouseenter: $.proxy(this.showTooltip, this), 145 mouseleave: $.proxy(this.hideTooltip, this) 146 }); 147 } else { 148 this.tooltip.addClass('hide'); 149 } 150 }; 151 152 Slider.prototype = { 153 constructor: Slider, 154 155 over: false, 156 inDrag: false, 157 158 showTooltip: function(){ 159 this.tooltip.addClass('in'); 160 //var left = Math.round(this.percent*this.width); 161 //this.tooltip.css('left', left - this.tooltip.outerWidth()/2); 162 this.over = true; 163 }, 164 165 hideTooltip: function(){ 166 if (this.inDrag === false) { 167 this.tooltip.removeClass('in'); 168 } 169 this.over = false;
170 }, 171 172 layout: function(){ 173 var positionPercentages; 174 175 if(this.reversed) { 176 positionPercentages = [ this.percentage[1] - this.percentage[0], this.percentage[1] ]; 177 } else { 178 positionPercentages = [ this.percentage[0], this.percentage[1] ]; 179 } 180 181 this.handle1Stype[this.stylePos] = positionPercentages[0]+'%'; 182 this.handle2Stype[this.stylePos] = positionPercentages[1]+'%'; 183 if (this.orientation == 'vertical') { 184 this.selectionElStyle.top = Math.min(positionPercentages[0], positionPercentages[1]) +'%'; 185 this.selectionElStyle.height = Math.abs(positionPercentages[0] - positionPercentages[1]) +'%'; 186 } else { 187 this.selectionElStyle.left = Math.min(positionPercentages[0], positionPercentages[1]) +'%'; 188 this.selectionElStyle.width = Math.abs(positionPercentages[0] - positionPercentages[1]) +'%'; 189 } 190 191 if (this.range) { 192 this.tooltipInner.text( 193 this.formater(this.value[0]) + 194 ' : ' + 195 this.formater(this.value[1]) 196 ); 197 this.tooltip[0].style[this.stylePos] = this.size * (positionPercentages[0] + (positionPercentages[1] - positionPercentages[0])/2)/100 - (this.orientation === 'vertical' ? this.tooltip.outerHeight()/2 : this.tooltip.outerWidth()/2) +'px'; 198 } else { 199 this.tooltipInner.text( 200 this.formater(this.value[0]) 201 ); 202 this.tooltip[0].style[this.stylePos] = this.size * positionPercentages[0]/100 - (this.orientation === 'vertical' ? this.tooltip.outerHeight()/2 : this.tooltip.outerWidth()/2) +'px'; 203 } 204 }, 205 206 mousedown: function(ev) { 207 208 if (!this.dragLocked){ 209 // Touch: Get the original event: 210 if (this.touchCapable && ev.type === 'touchstart') { 211 ev = ev.originalEvent; 212 } 213 214 this.offset = this.picker.offset(); 215 this.size = this.picker[0][this.sizePos]; 216 217 var percentage = this.getPercentage(ev); 218 219 if (this.range) { 220 var diff1 = Math.abs(this.percentage[0] - percentage); 221 var diff2 = Math.abs(this.percentage[1] - percentage); 222 this.dragged = (diff1 < diff2) ? 0 : 1; 223 } else { 224 this.dragged = 0; 225 } 226 227 this.percentage[this.dragged] = this.reversed ? this.percentage[1] - percentage : percentage; 228 this.layout(); 229 230 if (this.touchCapable) { 231 // Touch: Bind touch events: 232 $(document).on({ 233 touchmove: $.proxy(this.mousemove, this), 234 touchend: $.proxy(this.mouseup, this) 235 }); 236 } else { 237 $(document).on({ 238 mousemove: $.proxy(this.mousemove, this), 239 mouseup: $.proxy(this.mouseup, this) 240 }); 241 } 242 243 this.inDrag = true; 244 var val = this.calculateValue(); 245 246 this.setValue(val); 247 this.element.trigger({ 248 type: 'slideStart', 249 value: val 250 }).trigger({ 251 type: 'slide', 252 value: val 253 }); 254 return false; 255 } 256 }, 257 258 mousemove: function(ev) { 259 // Touch: Get the original event: 260 if (!this.dragLocked){ 261 if (this.touchCapable && ev.type === 'touchmove') { 262 ev = ev.originalEvent; 263 } 264 265 var percentage = this.getPercentage(ev); 266 if (this.range) { 267 if (this.dragged === 0 && this.percentage[1] < percentage) { 268 this.percentage[0] = this.percentage[1]; 269 this.dragged = 1; 270 } else if (this.dragged === 1 && this.percentage[0] > percentage) { 271 this.percentage[1] = this.percentage[0]; 272 this.dragged = 0; 273 } 274 } 275 x = this.reversed ? this.percentage[1] - percentage : percentage; 276 if (x > this.limit) { 277 return ; 278 } 279 this.percentage[this.dragged] = x; 280 this.layout(); 281 var val = this.calculateValue(); 282 this.setValue(val); 283 284 this.element 285 .trigger({ 286 type: 'slide', 287 value: val 288 }) 289 .data('value', val) 290 .prop('value', val); 291 return false; 292 } 293 }, 294 295 mouseup: function(ev) { 296 if (this.touchCapable) { 297 // Touch: Bind touch events: 298 $(document).off({ 299 touchmove: this.mousemove, 300 touchend: this.mouseup 301 }); 302 } else { 303 $(document).off({ 304 mousemove: this.mousemove, 305 mouseup: this.mouseup 306 }); 307 } 308 309 this.inDrag = false; 310 if (this.over == false) { 311 this.hideTooltip(); 312 } 313 this.element; 314 var val = this.calculateValue(); 315 this.layout(); 316 this.element 317 .trigger({ 318 type: 'slideStop', 319 value: val 320 }) 321 .data('value', val) 322 .prop('value', val); 323 return false;
324 }, 325 326 calculateValue: function() { 327 var val; 328 if (this.range) { 329 val = [ 330 (this.min + Math.round((this.diff * this.percentage[0]/100)/this.step)*this.step), 331 (this.min + Math.round((this.diff * this.percentage[1]/100)/this.step)*this.step) 332 ]; 333 this.value = val; 334 } else { 335 val = (this.min + Math.round((this.diff * this.percentage[0]/100)/this.step)*this.step); 336 this.value = [val, this.value[1]]; 337 } 338 return val; 339 }, 340 341 getPercentage: function(ev) { 342 if (this.touchCapable) { 343 ev = ev.touches[0]; 344 } 345 var percentage = (ev[this.mousePos] - this.offset[this.stylePos])*100/this.size; 346 percentage = Math.round(percentage/this.percentage[2])*this.percentage[2]; 347 return Math.max(0, Math.min(100, percentage)); 348 }, 349 350 getValue: function() { 351 if (this.range) { 352 return this.value; 353 } 354 return this.value[0]; 355 }, 356 setLimit: function(val) { 357 this.limit = val; 358 }, 359 setDragLocked: function(val) { 360 this.dragLocked = val; 361 }, 362 getDragLocked: function(val) { 363 return this.dragLocked; 364 }, 365 setValue: function(val) { 366 this.value = val; 367 368 if (this.range) { 369 this.value[0] = Math.max(this.min, Math.min(this.max, this.value[0])); 370 this.value[1] = Math.max(this.min, Math.min(this.max, this.value[1])); 371 } else { 372 this.value = [ Math.max(this.min, Math.min(this.max, this.value))]; 373 this.handle2.addClass('hide'); 374 if (this.selection == 'after') { 375 this.value[1] = this.max; 376 } else { 377 this.value[1] = this.min; 378 } 379 } 380 this.diff = this.max - this.min; 381 this.percentage = [ 382 (this.value[0]-this.min)*100/this.diff, 383 (this.value[1]-this.min)*100/this.diff, 384 this.step*100/this.diff 385 ]; 386 this.layout(); 387 }, 388 destroy: function(){ 389 this.element.show().insertBefore(this.picker); 390 this.picker.remove(); 391 }, 392 }; 393 394 $.fn.slider = function ( option, val ) { 395 return this.each(function () { 396 var $this = $(this), 397 data = $this.data('slider'), 398 options = typeof option === 'object' && option; 399 if (!data) { 400 $this.data('slider', (data = new Slider(this, $.extend({}, $.fn.slider.defaults,options)))); 401 } 402 if (typeof option == 'string') { 403 data[option](val); 404 } 405 }) 406 }; 407 408 $.fn.slider.defaults = { 409 min: 0, 410 max: 10, 411 step: 1, 412 orientation: 'horizontal', 413 value: 5, 414 selection: 'before', 415 tooltip: 'show', 416 handle: 'round', 417 reversed : false, 418 limit: 100000, 419 dragLocked: false, 420 formater: function(value) { 421 return value; 422 } 423 }; 424 425 $.fn.slider.Constructor = Slider; 426 427}( window.jQuery );
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.