/hippo/src/main/webapp/yui/slider/slider.js

http://hdbc.googlecode.com/ · JavaScript · 2061 lines · 863 code · 288 blank · 910 comment · 155 complexity · 45389cd364aaa1719af38cddc9385088 MD5 · raw file

Large files are truncated click here to view the full file

  1. /*
  2. Copyright (c) 2009, Yahoo! Inc. All rights reserved.
  3. Code licensed under the BSD License:
  4. http://developer.yahoo.net/yui/license.txt
  5. version: 2.7.0
  6. */
  7. /**
  8. * The Slider component is a UI control that enables the user to adjust
  9. * values in a finite range along one or two axes. Typically, the Slider
  10. * control is used in a web application as a rich, visual replacement
  11. * for an input box that takes a number as input. The Slider control can
  12. * also easily accommodate a second dimension, providing x,y output for
  13. * a selection point chosen from a rectangular region.
  14. *
  15. * @module slider
  16. * @title Slider Widget
  17. * @namespace YAHOO.widget
  18. * @requires yahoo,dom,dragdrop,event
  19. * @optional animation
  20. */
  21. (function () {
  22. var getXY = YAHOO.util.Dom.getXY,
  23. Event = YAHOO.util.Event,
  24. _AS = Array.prototype.slice;
  25. /**
  26. * A DragDrop implementation that can be used as a background for a
  27. * slider. It takes a reference to the thumb instance
  28. * so it can delegate some of the events to it. The goal is to make the
  29. * thumb jump to the location on the background when the background is
  30. * clicked.
  31. *
  32. * @class Slider
  33. * @extends YAHOO.util.DragDrop
  34. * @uses YAHOO.util.EventProvider
  35. * @constructor
  36. * @param {String} id The id of the element linked to this instance
  37. * @param {String} sGroup The group of related DragDrop items
  38. * @param {SliderThumb} oThumb The thumb for this slider
  39. * @param {String} sType The type of slider (horiz, vert, region)
  40. */
  41. function Slider(sElementId, sGroup, oThumb, sType) {
  42. Slider.ANIM_AVAIL = (!YAHOO.lang.isUndefined(YAHOO.util.Anim));
  43. if (sElementId) {
  44. this.init(sElementId, sGroup, true);
  45. this.initSlider(sType);
  46. this.initThumb(oThumb);
  47. }
  48. }
  49. YAHOO.lang.augmentObject(Slider,{
  50. /**
  51. * Factory method for creating a horizontal slider
  52. * @method YAHOO.widget.Slider.getHorizSlider
  53. * @static
  54. * @param {String} sBGElId the id of the slider's background element
  55. * @param {String} sHandleElId the id of the thumb element
  56. * @param {int} iLeft the number of pixels the element can move left
  57. * @param {int} iRight the number of pixels the element can move right
  58. * @param {int} iTickSize optional parameter for specifying that the element
  59. * should move a certain number pixels at a time.
  60. * @return {Slider} a horizontal slider control
  61. */
  62. getHorizSlider :
  63. function (sBGElId, sHandleElId, iLeft, iRight, iTickSize) {
  64. return new Slider(sBGElId, sBGElId,
  65. new YAHOO.widget.SliderThumb(sHandleElId, sBGElId,
  66. iLeft, iRight, 0, 0, iTickSize), "horiz");
  67. },
  68. /**
  69. * Factory method for creating a vertical slider
  70. * @method YAHOO.widget.Slider.getVertSlider
  71. * @static
  72. * @param {String} sBGElId the id of the slider's background element
  73. * @param {String} sHandleElId the id of the thumb element
  74. * @param {int} iUp the number of pixels the element can move up
  75. * @param {int} iDown the number of pixels the element can move down
  76. * @param {int} iTickSize optional parameter for specifying that the element
  77. * should move a certain number pixels at a time.
  78. * @return {Slider} a vertical slider control
  79. */
  80. getVertSlider :
  81. function (sBGElId, sHandleElId, iUp, iDown, iTickSize) {
  82. return new Slider(sBGElId, sBGElId,
  83. new YAHOO.widget.SliderThumb(sHandleElId, sBGElId, 0, 0,
  84. iUp, iDown, iTickSize), "vert");
  85. },
  86. /**
  87. * Factory method for creating a slider region like the one in the color
  88. * picker example
  89. * @method YAHOO.widget.Slider.getSliderRegion
  90. * @static
  91. * @param {String} sBGElId the id of the slider's background element
  92. * @param {String} sHandleElId the id of the thumb element
  93. * @param {int} iLeft the number of pixels the element can move left
  94. * @param {int} iRight the number of pixels the element can move right
  95. * @param {int} iUp the number of pixels the element can move up
  96. * @param {int} iDown the number of pixels the element can move down
  97. * @param {int} iTickSize optional parameter for specifying that the element
  98. * should move a certain number pixels at a time.
  99. * @return {Slider} a slider region control
  100. */
  101. getSliderRegion :
  102. function (sBGElId, sHandleElId, iLeft, iRight, iUp, iDown, iTickSize) {
  103. return new Slider(sBGElId, sBGElId,
  104. new YAHOO.widget.SliderThumb(sHandleElId, sBGElId, iLeft, iRight,
  105. iUp, iDown, iTickSize), "region");
  106. },
  107. /**
  108. * Constant for valueChangeSource, indicating that the user clicked or
  109. * dragged the slider to change the value.
  110. * @property Slider.SOURCE_UI_EVENT
  111. * @final
  112. * @static
  113. * @default 1
  114. */
  115. SOURCE_UI_EVENT : 1,
  116. /**
  117. * Constant for valueChangeSource, indicating that the value was altered
  118. * by a programmatic call to setValue/setRegionValue.
  119. * @property Slider.SOURCE_SET_VALUE
  120. * @final
  121. * @static
  122. * @default 2
  123. */
  124. SOURCE_SET_VALUE : 2,
  125. /**
  126. * Constant for valueChangeSource, indicating that the value was altered
  127. * by hitting any of the supported keyboard characters.
  128. * @property Slider.SOURCE_KEY_EVENT
  129. * @final
  130. * @static
  131. * @default 2
  132. */
  133. SOURCE_KEY_EVENT : 3,
  134. /**
  135. * By default, animation is available if the animation utility is detected.
  136. * @property Slider.ANIM_AVAIL
  137. * @static
  138. * @type boolean
  139. */
  140. ANIM_AVAIL : false
  141. },true);
  142. YAHOO.extend(Slider, YAHOO.util.DragDrop, {
  143. /**
  144. * Tracks the state of the mouse button to aid in when events are fired.
  145. *
  146. * @property _mouseDown
  147. * @type boolean
  148. * @default false
  149. * @private
  150. */
  151. _mouseDown : false,
  152. /**
  153. * Override the default setting of dragOnly to true.
  154. * @property dragOnly
  155. * @type boolean
  156. * @default true
  157. */
  158. dragOnly : true,
  159. /**
  160. * Initializes the slider. Executed in the constructor
  161. * @method initSlider
  162. * @param {string} sType the type of slider (horiz, vert, region)
  163. */
  164. initSlider: function(sType) {
  165. /**
  166. * The type of the slider (horiz, vert, region)
  167. * @property type
  168. * @type string
  169. */
  170. this.type = sType;
  171. //this.removeInvalidHandleType("A");
  172. /**
  173. * Event the fires when the value of the control changes. If
  174. * the control is animated the event will fire every point
  175. * along the way.
  176. * @event change
  177. * @param {int} newOffset|x the new offset for normal sliders, or the new
  178. * x offset for region sliders
  179. * @param {int} y the number of pixels the thumb has moved on the y axis
  180. * (region sliders only)
  181. */
  182. this.createEvent("change", this);
  183. /**
  184. * Event that fires at the beginning of a slider thumb move.
  185. * @event slideStart
  186. */
  187. this.createEvent("slideStart", this);
  188. /**
  189. * Event that fires at the end of a slider thumb move
  190. * @event slideEnd
  191. */
  192. this.createEvent("slideEnd", this);
  193. /**
  194. * Overrides the isTarget property in YAHOO.util.DragDrop
  195. * @property isTarget
  196. * @private
  197. */
  198. this.isTarget = false;
  199. /**
  200. * Flag that determines if the thumb will animate when moved
  201. * @property animate
  202. * @type boolean
  203. */
  204. this.animate = Slider.ANIM_AVAIL;
  205. /**
  206. * Set to false to disable a background click thumb move
  207. * @property backgroundEnabled
  208. * @type boolean
  209. */
  210. this.backgroundEnabled = true;
  211. /**
  212. * Adjustment factor for tick animation, the more ticks, the
  213. * faster the animation (by default)
  214. * @property tickPause
  215. * @type int
  216. */
  217. this.tickPause = 40;
  218. /**
  219. * Enables the arrow, home and end keys, defaults to true.
  220. * @property enableKeys
  221. * @type boolean
  222. */
  223. this.enableKeys = true;
  224. /**
  225. * Specifies the number of pixels the arrow keys will move the slider.
  226. * Default is 20.
  227. * @property keyIncrement
  228. * @type int
  229. */
  230. this.keyIncrement = 20;
  231. /**
  232. * moveComplete is set to true when the slider has moved to its final
  233. * destination. For animated slider, this value can be checked in
  234. * the onChange handler to make it possible to execute logic only
  235. * when the move is complete rather than at all points along the way.
  236. * Deprecated because this flag is only useful when the background is
  237. * clicked and the slider is animated. If the user drags the thumb,
  238. * the flag is updated when the drag is over ... the final onDrag event
  239. * fires before the mouseup the ends the drag, so the implementer will
  240. * never see it.
  241. *
  242. * @property moveComplete
  243. * @type Boolean
  244. * @deprecated use the slideEnd event instead
  245. */
  246. this.moveComplete = true;
  247. /**
  248. * If animation is configured, specifies the length of the animation
  249. * in seconds.
  250. * @property animationDuration
  251. * @type int
  252. * @default 0.2
  253. */
  254. this.animationDuration = 0.2;
  255. /**
  256. * Constant for valueChangeSource, indicating that the user clicked or
  257. * dragged the slider to change the value.
  258. * @property SOURCE_UI_EVENT
  259. * @final
  260. * @default 1
  261. * @deprecated use static Slider.SOURCE_UI_EVENT
  262. */
  263. this.SOURCE_UI_EVENT = 1;
  264. /**
  265. * Constant for valueChangeSource, indicating that the value was altered
  266. * by a programmatic call to setValue/setRegionValue.
  267. * @property SOURCE_SET_VALUE
  268. * @final
  269. * @default 2
  270. * @deprecated use static Slider.SOURCE_SET_VALUE
  271. */
  272. this.SOURCE_SET_VALUE = 2;
  273. /**
  274. * When the slider value changes, this property is set to identify where
  275. * the update came from. This will be either 1, meaning the slider was
  276. * clicked or dragged, or 2, meaning that it was set via a setValue() call.
  277. * This can be used within event handlers to apply some of the logic only
  278. * when dealing with one source or another.
  279. * @property valueChangeSource
  280. * @type int
  281. * @since 2.3.0
  282. */
  283. this.valueChangeSource = 0;
  284. /**
  285. * Indicates whether or not events will be supressed for the current
  286. * slide operation
  287. * @property _silent
  288. * @type boolean
  289. * @private
  290. */
  291. this._silent = false;
  292. /**
  293. * Saved offset used to protect against NaN problems when slider is
  294. * set to display:none
  295. * @property lastOffset
  296. * @type [int, int]
  297. */
  298. this.lastOffset = [0,0];
  299. },
  300. /**
  301. * Initializes the slider's thumb. Executed in the constructor.
  302. * @method initThumb
  303. * @param {YAHOO.widget.SliderThumb} t the slider thumb
  304. */
  305. initThumb: function(t) {
  306. var self = this;
  307. /**
  308. * A YAHOO.widget.SliderThumb instance that we will use to
  309. * reposition the thumb when the background is clicked
  310. * @property thumb
  311. * @type YAHOO.widget.SliderThumb
  312. */
  313. this.thumb = t;
  314. t.cacheBetweenDrags = true;
  315. if (t._isHoriz && t.xTicks && t.xTicks.length) {
  316. this.tickPause = Math.round(360 / t.xTicks.length);
  317. } else if (t.yTicks && t.yTicks.length) {
  318. this.tickPause = Math.round(360 / t.yTicks.length);
  319. }
  320. // delegate thumb methods
  321. t.onAvailable = function() {
  322. return self.setStartSliderState();
  323. };
  324. t.onMouseDown = function () {
  325. self._mouseDown = true;
  326. return self.focus();
  327. };
  328. t.startDrag = function() {
  329. self._slideStart();
  330. };
  331. t.onDrag = function() {
  332. self.fireEvents(true);
  333. };
  334. t.onMouseUp = function() {
  335. self.thumbMouseUp();
  336. };
  337. },
  338. /**
  339. * Executed when the slider element is available
  340. * @method onAvailable
  341. */
  342. onAvailable: function() {
  343. this._bindKeyEvents();
  344. },
  345. /**
  346. * Sets up the listeners for keydown and key press events.
  347. *
  348. * @method _bindKeyEvents
  349. * @protected
  350. */
  351. _bindKeyEvents : function () {
  352. Event.on(this.id, "keydown", this.handleKeyDown, this, true);
  353. Event.on(this.id, "keypress", this.handleKeyPress, this, true);
  354. },
  355. /**
  356. * Executed when a keypress event happens with the control focused.
  357. * Prevents the default behavior for navigation keys. The actual
  358. * logic for moving the slider thumb in response to a key event
  359. * happens in handleKeyDown.
  360. * @param {Event} e the keypress event
  361. */
  362. handleKeyPress: function(e) {
  363. if (this.enableKeys) {
  364. var kc = Event.getCharCode(e);
  365. switch (kc) {
  366. case 0x25: // left
  367. case 0x26: // up
  368. case 0x27: // right
  369. case 0x28: // down
  370. case 0x24: // home
  371. case 0x23: // end
  372. Event.preventDefault(e);
  373. break;
  374. default:
  375. }
  376. }
  377. },
  378. /**
  379. * Executed when a keydown event happens with the control focused.
  380. * Updates the slider value and display when the keypress is an
  381. * arrow key, home, or end as long as enableKeys is set to true.
  382. * @param {Event} e the keydown event
  383. */
  384. handleKeyDown: function(e) {
  385. if (this.enableKeys) {
  386. var kc = Event.getCharCode(e),
  387. t = this.thumb,
  388. h = this.getXValue(),
  389. v = this.getYValue(),
  390. changeValue = true;
  391. switch (kc) {
  392. // left
  393. case 0x25: h -= this.keyIncrement; break;
  394. // up
  395. case 0x26: v -= this.keyIncrement; break;
  396. // right
  397. case 0x27: h += this.keyIncrement; break;
  398. // down
  399. case 0x28: v += this.keyIncrement; break;
  400. // home
  401. case 0x24: h = t.leftConstraint;
  402. v = t.topConstraint;
  403. break;
  404. // end
  405. case 0x23: h = t.rightConstraint;
  406. v = t.bottomConstraint;
  407. break;
  408. default: changeValue = false;
  409. }
  410. if (changeValue) {
  411. if (t._isRegion) {
  412. this._setRegionValue(Slider.SOURCE_KEY_EVENT, h, v, true);
  413. } else {
  414. this._setValue(Slider.SOURCE_KEY_EVENT,
  415. (t._isHoriz ? h : v), true);
  416. }
  417. Event.stopEvent(e);
  418. }
  419. }
  420. },
  421. /**
  422. * Initialization that sets up the value offsets once the elements are ready
  423. * @method setStartSliderState
  424. */
  425. setStartSliderState: function() {
  426. this.setThumbCenterPoint();
  427. /**
  428. * The basline position of the background element, used
  429. * to determine if the background has moved since the last
  430. * operation.
  431. * @property baselinePos
  432. * @type [int, int]
  433. */
  434. this.baselinePos = getXY(this.getEl());
  435. this.thumb.startOffset = this.thumb.getOffsetFromParent(this.baselinePos);
  436. if (this.thumb._isRegion) {
  437. if (this.deferredSetRegionValue) {
  438. this._setRegionValue.apply(this, this.deferredSetRegionValue);
  439. this.deferredSetRegionValue = null;
  440. } else {
  441. this.setRegionValue(0, 0, true, true, true);
  442. }
  443. } else {
  444. if (this.deferredSetValue) {
  445. this._setValue.apply(this, this.deferredSetValue);
  446. this.deferredSetValue = null;
  447. } else {
  448. this.setValue(0, true, true, true);
  449. }
  450. }
  451. },
  452. /**
  453. * When the thumb is available, we cache the centerpoint of the element so
  454. * we can position the element correctly when the background is clicked
  455. * @method setThumbCenterPoint
  456. */
  457. setThumbCenterPoint: function() {
  458. var el = this.thumb.getEl();
  459. if (el) {
  460. /**
  461. * The center of the slider element is stored so we can
  462. * place it in the correct position when the background is clicked.
  463. * @property thumbCenterPoint
  464. * @type {"x": int, "y": int}
  465. */
  466. this.thumbCenterPoint = {
  467. x: parseInt(el.offsetWidth/2, 10),
  468. y: parseInt(el.offsetHeight/2, 10)
  469. };
  470. }
  471. },
  472. /**
  473. * Locks the slider, overrides YAHOO.util.DragDrop
  474. * @method lock
  475. */
  476. lock: function() {
  477. this.thumb.lock();
  478. this.locked = true;
  479. },
  480. /**
  481. * Unlocks the slider, overrides YAHOO.util.DragDrop
  482. * @method unlock
  483. */
  484. unlock: function() {
  485. this.thumb.unlock();
  486. this.locked = false;
  487. },
  488. /**
  489. * Handles mouseup event on the thumb
  490. * @method thumbMouseUp
  491. * @private
  492. */
  493. thumbMouseUp: function() {
  494. this._mouseDown = false;
  495. if (!this.isLocked() && !this.moveComplete) {
  496. this.endMove();
  497. }
  498. },
  499. onMouseUp: function() {
  500. this._mouseDown = false;
  501. if (this.backgroundEnabled && !this.isLocked() && !this.moveComplete) {
  502. this.endMove();
  503. }
  504. },
  505. /**
  506. * Returns a reference to this slider's thumb
  507. * @method getThumb
  508. * @return {SliderThumb} this slider's thumb
  509. */
  510. getThumb: function() {
  511. return this.thumb;
  512. },
  513. /**
  514. * Try to focus the element when clicked so we can add
  515. * accessibility features
  516. * @method focus
  517. * @private
  518. */
  519. focus: function() {
  520. this.valueChangeSource = Slider.SOURCE_UI_EVENT;
  521. // Focus the background element if possible
  522. var el = this.getEl();
  523. if (el.focus) {
  524. try {
  525. el.focus();
  526. } catch(e) {
  527. // Prevent permission denied unhandled exception in FF that can
  528. // happen when setting focus while another element is handling
  529. // the blur. @TODO this is still writing to the error log
  530. // (unhandled error) in FF1.5 with strict error checking on.
  531. }
  532. }
  533. this.verifyOffset();
  534. return !this.isLocked();
  535. },
  536. /**
  537. * Event that fires when the value of the slider has changed
  538. * @method onChange
  539. * @param {int} firstOffset the number of pixels the thumb has moved
  540. * from its start position. Normal horizontal and vertical sliders will only
  541. * have the firstOffset. Regions will have both, the first is the horizontal
  542. * offset, the second the vertical.
  543. * @param {int} secondOffset the y offset for region sliders
  544. * @deprecated use instance.subscribe("change") instead
  545. */
  546. onChange: function (firstOffset, secondOffset) {
  547. /* override me */
  548. },
  549. /**
  550. * Event that fires when the at the beginning of the slider thumb move
  551. * @method onSlideStart
  552. * @deprecated use instance.subscribe("slideStart") instead
  553. */
  554. onSlideStart: function () {
  555. /* override me */
  556. },
  557. /**
  558. * Event that fires at the end of a slider thumb move
  559. * @method onSliderEnd
  560. * @deprecated use instance.subscribe("slideEnd") instead
  561. */
  562. onSlideEnd: function () {
  563. /* override me */
  564. },
  565. /**
  566. * Returns the slider's thumb offset from the start position
  567. * @method getValue
  568. * @return {int} the current value
  569. */
  570. getValue: function () {
  571. return this.thumb.getValue();
  572. },
  573. /**
  574. * Returns the slider's thumb X offset from the start position
  575. * @method getXValue
  576. * @return {int} the current horizontal offset
  577. */
  578. getXValue: function () {
  579. return this.thumb.getXValue();
  580. },
  581. /**
  582. * Returns the slider's thumb Y offset from the start position
  583. * @method getYValue
  584. * @return {int} the current vertical offset
  585. */
  586. getYValue: function () {
  587. return this.thumb.getYValue();
  588. },
  589. /**
  590. * Provides a way to set the value of the slider in code.
  591. *
  592. * @method setValue
  593. * @param {int} newOffset the number of pixels the thumb should be
  594. * positioned away from the initial start point
  595. * @param {boolean} skipAnim set to true to disable the animation
  596. * for this move action (but not others).
  597. * @param {boolean} force ignore the locked setting and set value anyway
  598. * @param {boolean} silent when true, do not fire events
  599. * @return {boolean} true if the move was performed, false if it failed
  600. */
  601. setValue: function() {
  602. var args = _AS.call(arguments);
  603. args.unshift(Slider.SOURCE_SET_VALUE);
  604. return this._setValue.apply(this,args);
  605. },
  606. /**
  607. * Worker function to execute the value set operation. Accepts type of
  608. * set operation in addition to the usual setValue params.
  609. *
  610. * @method _setValue
  611. * @param source {int} what triggered the set (e.g. Slider.SOURCE_SET_VALUE)
  612. * @param {int} newOffset the number of pixels the thumb should be
  613. * positioned away from the initial start point
  614. * @param {boolean} skipAnim set to true to disable the animation
  615. * for this move action (but not others).
  616. * @param {boolean} force ignore the locked setting and set value anyway
  617. * @param {boolean} silent when true, do not fire events
  618. * @return {boolean} true if the move was performed, false if it failed
  619. * @protected
  620. */
  621. _setValue: function(source, newOffset, skipAnim, force, silent) {
  622. var t = this.thumb, newX, newY;
  623. if (!t.available) {
  624. this.deferredSetValue = arguments;
  625. return false;
  626. }
  627. if (this.isLocked() && !force) {
  628. return false;
  629. }
  630. if ( isNaN(newOffset) ) {
  631. return false;
  632. }
  633. if (t._isRegion) {
  634. return false;
  635. }
  636. this._silent = silent;
  637. this.valueChangeSource = source || Slider.SOURCE_SET_VALUE;
  638. t.lastOffset = [newOffset, newOffset];
  639. this.verifyOffset(true);
  640. this._slideStart();
  641. if (t._isHoriz) {
  642. newX = t.initPageX + newOffset + this.thumbCenterPoint.x;
  643. this.moveThumb(newX, t.initPageY, skipAnim);
  644. } else {
  645. newY = t.initPageY + newOffset + this.thumbCenterPoint.y;
  646. this.moveThumb(t.initPageX, newY, skipAnim);
  647. }
  648. return true;
  649. },
  650. /**
  651. * Provides a way to set the value of the region slider in code.
  652. * @method setRegionValue
  653. * @param {int} newOffset the number of pixels the thumb should be
  654. * positioned away from the initial start point (x axis for region)
  655. * @param {int} newOffset2 the number of pixels the thumb should be
  656. * positioned away from the initial start point (y axis for region)
  657. * @param {boolean} skipAnim set to true to disable the animation
  658. * for this move action (but not others).
  659. * @param {boolean} force ignore the locked setting and set value anyway
  660. * @param {boolean} silent when true, do not fire events
  661. * @return {boolean} true if the move was performed, false if it failed
  662. */
  663. setRegionValue : function () {
  664. var args = _AS.call(arguments);
  665. args.unshift(Slider.SOURCE_SET_VALUE);
  666. return this._setRegionValue.apply(this,args);
  667. },
  668. /**
  669. * Worker function to execute the value set operation. Accepts type of
  670. * set operation in addition to the usual setValue params.
  671. *
  672. * @method _setRegionValue
  673. * @param source {int} what triggered the set (e.g. Slider.SOURCE_SET_VALUE)
  674. * @param {int} newOffset the number of pixels the thumb should be
  675. * positioned away from the initial start point (x axis for region)
  676. * @param {int} newOffset2 the number of pixels the thumb should be
  677. * positioned away from the initial start point (y axis for region)
  678. * @param {boolean} skipAnim set to true to disable the animation
  679. * for this move action (but not others).
  680. * @param {boolean} force ignore the locked setting and set value anyway
  681. * @param {boolean} silent when true, do not fire events
  682. * @return {boolean} true if the move was performed, false if it failed
  683. * @protected
  684. */
  685. _setRegionValue: function(source, newOffset, newOffset2, skipAnim, force, silent) {
  686. var t = this.thumb, newX, newY;
  687. if (!t.available) {
  688. this.deferredSetRegionValue = arguments;
  689. return false;
  690. }
  691. if (this.isLocked() && !force) {
  692. return false;
  693. }
  694. if ( isNaN(newOffset) ) {
  695. return false;
  696. }
  697. if (!t._isRegion) {
  698. return false;
  699. }
  700. this._silent = silent;
  701. this.valueChangeSource = source || Slider.SOURCE_SET_VALUE;
  702. t.lastOffset = [newOffset, newOffset2];
  703. this.verifyOffset(true);
  704. this._slideStart();
  705. newX = t.initPageX + newOffset + this.thumbCenterPoint.x;
  706. newY = t.initPageY + newOffset2 + this.thumbCenterPoint.y;
  707. this.moveThumb(newX, newY, skipAnim);
  708. return true;
  709. },
  710. /**
  711. * Checks the background position element position. If it has moved from the
  712. * baseline position, the constraints for the thumb are reset
  713. * @param checkPos {boolean} check the position instead of using cached value
  714. * @method verifyOffset
  715. * @return {boolean} True if the offset is the same as the baseline.
  716. */
  717. verifyOffset: function(checkPos) {
  718. var xy = getXY(this.getEl()),
  719. t = this.thumb;
  720. if (!this.thumbCenterPoint || !this.thumbCenterPoint.x) {
  721. this.setThumbCenterPoint();
  722. }
  723. if (xy) {
  724. if (xy[0] != this.baselinePos[0] || xy[1] != this.baselinePos[1]) {
  725. // Reset background
  726. this.setInitPosition();
  727. this.baselinePos = xy;
  728. // Reset thumb
  729. t.initPageX = this.initPageX + t.startOffset[0];
  730. t.initPageY = this.initPageY + t.startOffset[1];
  731. t.deltaSetXY = null;
  732. this.resetThumbConstraints();
  733. return false;
  734. }
  735. }
  736. return true;
  737. },
  738. /**
  739. * Move the associated slider moved to a timeout to try to get around the
  740. * mousedown stealing moz does when I move the slider element between the
  741. * cursor and the background during the mouseup event
  742. * @method moveThumb
  743. * @param {int} x the X coordinate of the click
  744. * @param {int} y the Y coordinate of the click
  745. * @param {boolean} skipAnim don't animate if the move happend onDrag
  746. * @param {boolean} midMove set to true if this is not terminating
  747. * the slider movement
  748. * @private
  749. */
  750. moveThumb: function(x, y, skipAnim, midMove) {
  751. var t = this.thumb,
  752. self = this,
  753. p,_p,anim;
  754. if (!t.available) {
  755. return;
  756. }
  757. t.setDelta(this.thumbCenterPoint.x, this.thumbCenterPoint.y);
  758. _p = t.getTargetCoord(x, y);
  759. p = [Math.round(_p.x), Math.round(_p.y)];
  760. if (this.animate && t._graduated && !skipAnim) {
  761. this.lock();
  762. // cache the current thumb pos
  763. this.curCoord = getXY(this.thumb.getEl());
  764. this.curCoord = [Math.round(this.curCoord[0]), Math.round(this.curCoord[1])];
  765. setTimeout( function() { self.moveOneTick(p); }, this.tickPause );
  766. } else if (this.animate && Slider.ANIM_AVAIL && !skipAnim) {
  767. this.lock();
  768. anim = new YAHOO.util.Motion(
  769. t.id, { points: { to: p } },
  770. this.animationDuration,
  771. YAHOO.util.Easing.easeOut );
  772. anim.onComplete.subscribe( function() {
  773. self.unlock();
  774. if (!self._mouseDown) {
  775. self.endMove();
  776. }
  777. });
  778. anim.animate();
  779. } else {
  780. t.setDragElPos(x, y);
  781. if (!midMove && !this._mouseDown) {
  782. this.endMove();
  783. }
  784. }
  785. },
  786. _slideStart: function() {
  787. if (!this._sliding) {
  788. if (!this._silent) {
  789. this.onSlideStart();
  790. this.fireEvent("slideStart");
  791. }
  792. this._sliding = true;
  793. }
  794. },
  795. _slideEnd: function() {
  796. if (this._sliding && this.moveComplete) {
  797. // Reset state before firing slideEnd
  798. var silent = this._silent;
  799. this._sliding = false;
  800. this._silent = false;
  801. this.moveComplete = false;
  802. if (!silent) {
  803. this.onSlideEnd();
  804. this.fireEvent("slideEnd");
  805. }
  806. }
  807. },
  808. /**
  809. * Move the slider one tick mark towards its final coordinate. Used
  810. * for the animation when tick marks are defined
  811. * @method moveOneTick
  812. * @param {int[]} the destination coordinate
  813. * @private
  814. */
  815. moveOneTick: function(finalCoord) {
  816. var t = this.thumb,
  817. self = this,
  818. nextCoord = null,
  819. tmpX, tmpY;
  820. if (t._isRegion) {
  821. nextCoord = this._getNextX(this.curCoord, finalCoord);
  822. tmpX = (nextCoord !== null) ? nextCoord[0] : this.curCoord[0];
  823. nextCoord = this._getNextY(this.curCoord, finalCoord);
  824. tmpY = (nextCoord !== null) ? nextCoord[1] : this.curCoord[1];
  825. nextCoord = tmpX !== this.curCoord[0] || tmpY !== this.curCoord[1] ?
  826. [ tmpX, tmpY ] : null;
  827. } else if (t._isHoriz) {
  828. nextCoord = this._getNextX(this.curCoord, finalCoord);
  829. } else {
  830. nextCoord = this._getNextY(this.curCoord, finalCoord);
  831. }
  832. if (nextCoord) {
  833. // cache the position
  834. this.curCoord = nextCoord;
  835. // move to the next coord
  836. this.thumb.alignElWithMouse(t.getEl(), nextCoord[0] + this.thumbCenterPoint.x, nextCoord[1] + this.thumbCenterPoint.y);
  837. // check if we are in the final position, if not make a recursive call
  838. if (!(nextCoord[0] == finalCoord[0] && nextCoord[1] == finalCoord[1])) {
  839. setTimeout(function() { self.moveOneTick(finalCoord); },
  840. this.tickPause);
  841. } else {
  842. this.unlock();
  843. if (!this._mouseDown) {
  844. this.endMove();
  845. }
  846. }
  847. } else {
  848. this.unlock();
  849. if (!this._mouseDown) {
  850. this.endMove();
  851. }
  852. }
  853. },
  854. /**
  855. * Returns the next X tick value based on the current coord and the target coord.
  856. * @method _getNextX
  857. * @private
  858. */
  859. _getNextX: function(curCoord, finalCoord) {
  860. var t = this.thumb,
  861. thresh,
  862. tmp = [],
  863. nextCoord = null;
  864. if (curCoord[0] > finalCoord[0]) {
  865. thresh = t.tickSize - this.thumbCenterPoint.x;
  866. tmp = t.getTargetCoord( curCoord[0] - thresh, curCoord[1] );
  867. nextCoord = [tmp.x, tmp.y];
  868. } else if (curCoord[0] < finalCoord[0]) {
  869. thresh = t.tickSize + this.thumbCenterPoint.x;
  870. tmp = t.getTargetCoord( curCoord[0] + thresh, curCoord[1] );
  871. nextCoord = [tmp.x, tmp.y];
  872. } else {
  873. // equal, do nothing
  874. }
  875. return nextCoord;
  876. },
  877. /**
  878. * Returns the next Y tick value based on the current coord and the target coord.
  879. * @method _getNextY
  880. * @private
  881. */
  882. _getNextY: function(curCoord, finalCoord) {
  883. var t = this.thumb,
  884. thresh,
  885. tmp = [],
  886. nextCoord = null;
  887. if (curCoord[1] > finalCoord[1]) {
  888. thresh = t.tickSize - this.thumbCenterPoint.y;
  889. tmp = t.getTargetCoord( curCoord[0], curCoord[1] - thresh );
  890. nextCoord = [tmp.x, tmp.y];
  891. } else if (curCoord[1] < finalCoord[1]) {
  892. thresh = t.tickSize + this.thumbCenterPoint.y;
  893. tmp = t.getTargetCoord( curCoord[0], curCoord[1] + thresh );
  894. nextCoord = [tmp.x, tmp.y];
  895. } else {
  896. // equal, do nothing
  897. }
  898. return nextCoord;
  899. },
  900. /**
  901. * Resets the constraints before moving the thumb.
  902. * @method b4MouseDown
  903. * @private
  904. */
  905. b4MouseDown: function(e) {
  906. if (!this.backgroundEnabled) {
  907. return false;
  908. }
  909. this.thumb.autoOffset();
  910. this.resetThumbConstraints();
  911. },
  912. /**
  913. * Handles the mousedown event for the slider background
  914. * @method onMouseDown
  915. * @private
  916. */
  917. onMouseDown: function(e) {
  918. if (!this.backgroundEnabled || this.isLocked()) {
  919. return false;
  920. }
  921. this._mouseDown = true;
  922. var x = Event.getPageX(e),
  923. y = Event.getPageY(e);
  924. this.focus();
  925. this._slideStart();
  926. this.moveThumb(x, y);
  927. },
  928. /**
  929. * Handles the onDrag event for the slider background
  930. * @method onDrag
  931. * @private
  932. */
  933. onDrag: function(e) {
  934. if (this.backgroundEnabled && !this.isLocked()) {
  935. var x = Event.getPageX(e),
  936. y = Event.getPageY(e);
  937. this.moveThumb(x, y, true, true);
  938. this.fireEvents();
  939. }
  940. },
  941. /**
  942. * Fired when the slider movement ends
  943. * @method endMove
  944. * @private
  945. */
  946. endMove: function () {
  947. this.unlock();
  948. this.fireEvents();
  949. this.moveComplete = true;
  950. this._slideEnd();
  951. },
  952. /**
  953. * Resets the X and Y contraints for the thumb. Used in lieu of the thumb
  954. * instance's inherited resetConstraints because some logic was not
  955. * applicable.
  956. * @method resetThumbConstraints
  957. * @protected
  958. */
  959. resetThumbConstraints: function () {
  960. var t = this.thumb;
  961. t.setXConstraint(t.leftConstraint, t.rightConstraint, t.xTickSize);
  962. t.setYConstraint(t.topConstraint, t.bottomConstraint, t.xTickSize);
  963. },
  964. /**
  965. * Fires the change event if the value has been changed. Ignored if we are in
  966. * the middle of an animation as the event will fire when the animation is
  967. * complete
  968. * @method fireEvents
  969. * @param {boolean} thumbEvent set to true if this event is fired from an event
  970. * that occurred on the thumb. If it is, the state of the
  971. * thumb dd object should be correct. Otherwise, the event
  972. * originated on the background, so the thumb state needs to
  973. * be refreshed before proceeding.
  974. * @private
  975. */
  976. fireEvents: function (thumbEvent) {
  977. var t = this.thumb, newX, newY, newVal;
  978. if (!thumbEvent) {
  979. t.cachePosition();
  980. }
  981. if (! this.isLocked()) {
  982. if (t._isRegion) {
  983. newX = t.getXValue();
  984. newY = t.getYValue();
  985. if (newX != this.previousX || newY != this.previousY) {
  986. if (!this._silent) {
  987. this.onChange(newX, newY);
  988. this.fireEvent("change", { x: newX, y: newY });
  989. }
  990. }
  991. this.previousX = newX;
  992. this.previousY = newY;
  993. } else {
  994. newVal = t.getValue();
  995. if (newVal != this.previousVal) {
  996. if (!this._silent) {
  997. this.onChange( newVal );
  998. this.fireEvent("change", newVal);
  999. }
  1000. }
  1001. this.previousVal = newVal;
  1002. }
  1003. }
  1004. },
  1005. /**
  1006. * Slider toString
  1007. * @method toString
  1008. * @return {string} string representation of the instance
  1009. */
  1010. toString: function () {
  1011. return ("Slider (" + this.type +") " + this.id);
  1012. }
  1013. });
  1014. YAHOO.lang.augmentProto(Slider, YAHOO.util.EventProvider);
  1015. YAHOO.widget.Slider = Slider;
  1016. })();
  1017. /**
  1018. * A drag and drop implementation to be used as the thumb of a slider.
  1019. * @class SliderThumb
  1020. * @extends YAHOO.util.DD
  1021. * @constructor
  1022. * @param {String} id the id of the slider html element
  1023. * @param {String} sGroup the group of related DragDrop items
  1024. * @param {int} iLeft the number of pixels the element can move left
  1025. * @param {int} iRight the number of pixels the element can move right
  1026. * @param {int} iUp the number of pixels the element can move up
  1027. * @param {int} iDown the number of pixels the element can move down
  1028. * @param {int} iTickSize optional parameter for specifying that the element
  1029. * should move a certain number pixels at a time.
  1030. */
  1031. YAHOO.widget.SliderThumb = function(id, sGroup, iLeft, iRight, iUp, iDown, iTickSize) {
  1032. if (id) {
  1033. YAHOO.widget.SliderThumb.superclass.constructor.call(this, id, sGroup);
  1034. /**
  1035. * The id of the thumbs parent HTML element (the slider background
  1036. * element).
  1037. * @property parentElId
  1038. * @type string
  1039. */
  1040. this.parentElId = sGroup;
  1041. }
  1042. /**
  1043. * Overrides the isTarget property in YAHOO.util.DragDrop
  1044. * @property isTarget
  1045. * @private
  1046. */
  1047. this.isTarget = false;
  1048. /**
  1049. * The tick size for this slider
  1050. * @property tickSize
  1051. * @type int
  1052. * @private
  1053. */
  1054. this.tickSize = iTickSize;
  1055. /**
  1056. * Informs the drag and drop util that the offsets should remain when
  1057. * resetting the constraints. This preserves the slider value when
  1058. * the constraints are reset
  1059. * @property maintainOffset
  1060. * @type boolean
  1061. * @private
  1062. */
  1063. this.maintainOffset = true;
  1064. this.initSlider(iLeft, iRight, iUp, iDown, iTickSize);
  1065. /**
  1066. * Turns off the autoscroll feature in drag and drop
  1067. * @property scroll
  1068. * @private
  1069. */
  1070. this.scroll = false;
  1071. };
  1072. YAHOO.extend(YAHOO.widget.SliderThumb, YAHOO.util.DD, {
  1073. /**
  1074. * The (X and Y) difference between the thumb location and its parent
  1075. * (the slider background) when the control is instantiated.
  1076. * @property startOffset
  1077. * @type [int, int]
  1078. */
  1079. startOffset: null,
  1080. /**
  1081. * Override the default setting of dragOnly to true.
  1082. * @property dragOnly
  1083. * @type boolean
  1084. * @default true
  1085. */
  1086. dragOnly : true,
  1087. /**
  1088. * Flag used to figure out if this is a horizontal or vertical slider
  1089. * @property _isHoriz
  1090. * @type boolean
  1091. * @private
  1092. */
  1093. _isHoriz: false,
  1094. /**
  1095. * Cache the last value so we can check for change
  1096. * @property _prevVal
  1097. * @type int
  1098. * @private
  1099. */
  1100. _prevVal: 0,
  1101. /**
  1102. * The slider is _graduated if there is a tick interval defined
  1103. * @property _graduated
  1104. * @type boolean
  1105. * @private
  1106. */
  1107. _graduated: false,
  1108. /**
  1109. * Returns the difference between the location of the thumb and its parent.
  1110. * @method getOffsetFromParent
  1111. * @param {[int, int]} parentPos Optionally accepts the position of the parent
  1112. * @type [int, int]
  1113. */
  1114. getOffsetFromParent0: function(parentPos) {
  1115. var myPos = YAHOO.util.Dom.getXY(this.getEl()),
  1116. ppos = parentPos || YAHOO.util.Dom.getXY(this.parentElId);
  1117. return [ (myPos[0] - ppos[0]), (myPos[1] - ppos[1]) ];
  1118. },
  1119. getOffsetFromParent: function(parentPos) {
  1120. var el = this.getEl(), newOffset,
  1121. myPos,ppos,l,t,deltaX,deltaY,newLeft,newTop;
  1122. if (!this.deltaOffset) {
  1123. myPos = YAHOO.util.Dom.getXY(el);
  1124. ppos = parentPos || YAHOO.util.Dom.getXY(this.parentElId);
  1125. newOffset = [ (myPos[0] - ppos[0]), (myPos[1] - ppos[1]) ];
  1126. l = parseInt( YAHOO.util.Dom.getStyle(el, "left"), 10 );
  1127. t = parseInt( YAHOO.util.Dom.getStyle(el, "top" ), 10 );
  1128. deltaX = l - newOffset[0];
  1129. deltaY = t - newOffset[1];
  1130. if (isNaN(deltaX) || isNaN(deltaY)) {
  1131. } else {
  1132. this.deltaOffset = [deltaX, deltaY];
  1133. }
  1134. } else {
  1135. newLeft = parseInt( YAHOO.util.Dom.getStyle(el, "left"), 10 );
  1136. newTop = parseInt( YAHOO.util.Dom.getStyle(el, "top" ), 10 );
  1137. newOffset = [newLeft + this.deltaOffset[0], newTop + this.deltaOffset[1]];
  1138. }
  1139. return newOffset;
  1140. },
  1141. /**
  1142. * Set up the slider, must be called in the constructor of all subclasses
  1143. * @method initSlider
  1144. * @param {int} iLeft the number of pixels the element can move left
  1145. * @param {int} iRight the number of pixels the element can move right
  1146. * @param {int} iUp the number of pixels the element can move up
  1147. * @param {int} iDown the number of pixels the element can move down
  1148. * @param {int} iTickSize the width of the tick interval.
  1149. */
  1150. initSlider: function (iLeft, iRight, iUp, iDown, iTickSize) {
  1151. this.initLeft = iLeft;
  1152. this.initRight = iRight;
  1153. this.initUp = iUp;
  1154. this.initDown = iDown;
  1155. this.setXConstraint(iLeft, iRight, iTickSize);
  1156. this.setYConstraint(iUp, iDown, iTickSize);
  1157. if (iTickSize && iTickSize > 1) {
  1158. this._graduated = true;
  1159. }
  1160. this._isHoriz = (iLeft || iRight);
  1161. this._isVert = (iUp || iDown);
  1162. this._isRegion = (this._isHoriz && this._isVert);
  1163. },
  1164. /**
  1165. * Clear's the slider's ticks
  1166. * @method clearTicks
  1167. */
  1168. clearTicks: function () {
  1169. YAHOO.widget.SliderThumb.superclass.clearTicks.call(this);
  1170. this.tickSize = 0;
  1171. this._graduated = false;
  1172. },
  1173. /**
  1174. * Gets the current offset from the element's start position in
  1175. * pixels.
  1176. * @method getValue
  1177. * @return {int} the number of pixels (positive or negative) the
  1178. * slider has moved from the start position.
  1179. */
  1180. getValue: function () {
  1181. return (this._isHoriz) ? this.getXValue() : this.getYValue();
  1182. },
  1183. /**
  1184. * Gets the current X offset from the element's start position in
  1185. * pixels.
  1186. * @method getXValue
  1187. * @return {int} the number of pixels (positive or negative) the
  1188. * slider has moved horizontally from the start position.
  1189. */
  1190. getXValue: function () {
  1191. if (!this.available) {
  1192. return 0;
  1193. }
  1194. var newOffset = this.getOffsetFromParent();
  1195. if (YAHOO.lang.isNumber(newOffset[0])) {
  1196. this.lastOffset = newOffset;
  1197. return (newOffset[0] - this.startOffset[0]);
  1198. } else {
  1199. return (this.lastOffset[0] - this.startOffset[0]);
  1200. }
  1201. },
  1202. /**
  1203. * Gets the current Y offset from the element's start position in
  1204. * pixels.
  1205. * @method getYValue
  1206. * @return {int} the number of pixels (positive or negative) the
  1207. * slider has moved vertically from the start position.
  1208. */
  1209. getYValue: function () {
  1210. if (!this.available) {
  1211. return 0;
  1212. }
  1213. var newOffset = this.getOffsetFromParent();
  1214. if (YAHOO.lang.isNumber(newOffset[1])) {
  1215. this.lastOffset = newOffset;
  1216. return (newOffset[1] - this.startOffset[1]);
  1217. } else {
  1218. return (this.lastOffset[1] - this.startOffset[1]);
  1219. }
  1220. },
  1221. /**
  1222. * Thumb toString
  1223. * @method toString
  1224. * @return {string} string representation of the instance
  1225. */
  1226. toString: function () {
  1227. return "SliderThumb " + this.id;
  1228. },
  1229. /**
  1230. * The onchange event for the handle/thumb is delegated to the YAHOO.widget.Slider
  1231. * instance it belongs to.
  1232. * @method onChange
  1233. * @private
  1234. */
  1235. onChange: function (x, y) {
  1236. }
  1237. });
  1238. /**
  1239. * A slider with two thumbs, one that represents the min value and
  1240. * the other the max. Actually a composition of two sliders, both with
  1241. * the same background. The constraints for each slider are adjusted
  1242. * dynamically so that the min value of the max slider is equal or greater
  1243. * to the current value of the min slider, and the max value of the min
  1244. * slider is the current value of the max slider.
  1245. * Constructor assumes both thumbs are positioned absolutely at the 0 mark on
  1246. * the background.
  1247. *
  1248. * @namespace YAHOO.widget
  1249. * @class DualSlider
  1250. * @uses YAHOO.util.EventProvider
  1251. * @constructor
  1252. * @param {Slider} minSlider The Slider instance used for the min value thumb
  1253. * @param {Slider} maxSlider The Slider instance used for the max value thumb
  1254. * @param {int} range The number of pixels the thumbs may move within
  1255. * @param {Array} initVals (optional) [min,max] Initial thumb placement
  1256. */
  1257. (function () {
  1258. var Event = YAHOO.util.Event,
  1259. YW = YAHOO.widget;
  1260. function DualSlider(minSlider, maxSlider, range, initVals) {
  1261. var self = this,
  1262. ready = { min : false, max : false },
  1263. minThumbOnMouseDown, maxThumbOnMouseDown;
  1264. /**
  1265. * A slider instance that keeps track of the lower value of the range.
  1266. * <strong>read only</strong>
  1267. * @property minSlider
  1268. * @type Slider
  1269. */
  1270. this.minSlider = minSlider;
  1271. /**
  1272. * A slider instance that keeps track of the upper value of the range.
  1273. * <strong>read only</strong>
  1274. * @property maxSlider
  1275. * @type Slider
  1276. */
  1277. this.maxSlider = maxSlider;
  1278. /**
  1279. * The currently active slider (min or max). <strong>read only</strong>
  1280. * @property activeSlider
  1281. * @type Slider
  1282. */
  1283. this.activeSlider = minSlider;
  1284. /**
  1285. * Is the DualSlider oriented horizontally or vertically?
  1286. * <strong>read only</strong>
  1287. * @property isHoriz
  1288. * @type boolean
  1289. */
  1290. this.isHoriz = minSlider.thumb._isHoriz;
  1291. //FIXME: this is horrible
  1292. minThumbOnMouseDown = this.minSlider.thumb.onMouseDown;
  1293. maxThumbOnMouseDown = this.maxSlider.thumb.onMouseDown;
  1294. this.minSlider.thumb.onMouseDown = function() {
  1295. self.activeSlider = self.minSlider;
  1296. minThumbOnMouseDown.apply(this,arguments);
  1297. };
  1298. this.maxSlider.thumb.onMouseDown = function () {
  1299. self.activeSlider = self.maxSlider;
  1300. maxThumbOnMouseDown.apply(this,arguments);
  1301. };
  1302. this.minSlider.thumb.onAvailable = function () {
  1303. minSlider.setStartSliderState();
  1304. ready.min = true;
  1305. if (ready.max) {
  1306. self.fireEvent('ready',self);
  1307. }
  1308. };
  1309. this.maxSlider.thumb.onAvailable = function () {
  1310. maxSlider.setStartSliderState();
  1311. ready.max = true;
  1312. if (ready.min) {
  1313. self.fireEvent('ready',self);
  1314. }
  1315. };
  1316. // dispatch mousedowns to the active slider
  1317. minSlider.onMouseDown =
  1318. maxSlider.onMouseDown = function(e) {
  1319. return this.backgroundEnabled && self._handleMouseDown(e);
  1320. };
  1321. // Fix the drag behavior so that only the active slider
  1322. // follows the drag
  1323. minSlider.onDrag =
  1324. maxSlider.onDrag = function(e) {
  1325. self._handleDrag(e);
  1326. };
  1327. // Likely only the minSlider's onMouseUp will be executed, but both are
  1328. // overridden just to be safe
  1329. minSlider.onMouseUp =
  1330. maxSlider.onMouseUp = function (e) {
  1331. self._handleMouseUp(e);
  1332. };
  1333. // Replace the _bindKeyEvents for the minSlider and remove that for the
  1334. // maxSlider since they share the same bg element.
  1335. minSlider._bindKeyEvents = function () {
  1336. self._bindKeyEvents(this);
  1337. };
  1338. maxSlider._bindKeyEvents = function () {};
  1339. // The core events for each slider are handled so we can expose a single
  1340. // event for when the event happens on either slider
  1341. minSlider.subscribe("change", this._handleMinChange, minSlider, this);
  1342. minSlider.subscribe("slideStart", this._handleSlideStart, minSlider, this);
  1343. minSlider.subscribe("slideEnd", this._handleSlideEnd, minSlider, this);
  1344. maxSlider.subscribe("change", this._handleMaxChange, maxSlider, this);
  1345. maxSlider.subscribe("slideStart", this._handleSlideStart, maxSlider, this);
  1346. maxSlider.subscribe("slideEnd", this._handleSlideEnd, maxSlider, this);
  1347. /**
  1348. * Event that fires when the slider is finished setting up
  1349. * @event ready
  1350. * @param {DualSlider} dualslider the DualSlider instance
  1351. */
  1352. this.createEvent("ready", this);
  1353. /**
  1354. * Event that fires when either the min or max value changes
  1355. * @event change
  1356. * @param {DualSlider} dualslider the DualSlider instance
  1357. */
  1358. this.createEvent("change", this);
  1359. /**
  1360. * Event that fires when one of the thumbs begins to move
  1361. * @event slideStart
  1362. * @param {Slider} activeSlider the moving slider
  1363. */
  1364. this.createEvent("slideStart", this);
  1365. /**
  1366. * Event that fires when one of the thumbs finishes moving
  1367. * @event slideEnd
  1368. * @param {Slider} activeSlider the moving slider
  1369. */
  1370. this.createEvent("slideEnd", this);
  1371. // Validate initial values
  1372. initVals = YAHOO.lang.isArray(initVals) ? initVals : [0,rang