API tools faq
paste
Herlitz

Dijit HorizontalSlider

Herlitz
Jan 1st, 2019
508
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 13.54 KB | None | 0 0
raw download clone embed print report
  1. require({
  2.     cache: {
  3.         "url:dijit/form/templates/HorizontalSlider.html": "<table class=\"dijit dijitReset dijitSlider dijitSliderH\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\" rules=\"none\" data-dojo-attach-event=\"onkeypress:_onKeyPress,onkeyup:_onKeyUp\"\n\trole=\"presentation\"\n\t><tr class=\"dijitReset\"\n\t\t><td class=\"dijitReset\" colspan=\"2\"></td\n\t\t><td data-dojo-attach-point=\"topDecoration\" class=\"dijitReset dijitSliderDecoration dijitSliderDecorationT dijitSliderDecorationH\"></td\n\t\t><td class=\"dijitReset\" colspan=\"2\"></td\n\t></tr\n\t><tr class=\"dijitReset\"\n\t\t><td class=\"dijitReset dijitSliderButtonContainer dijitSliderButtonContainerH\"\n\t\t\t><div class=\"dijitSliderDecrementIconH\" style=\"display:none\" data-dojo-attach-point=\"decrementButton\"><span class=\"dijitSliderButtonInner\">-</span></div\n\t\t></td\n\t\t><td class=\"dijitReset\"\n\t\t\t><div class=\"dijitSliderBar dijitSliderBumper dijitSliderBumperH dijitSliderLeftBumper\" data-dojo-attach-event=\"press:_onClkDecBumper\"></div\n\t\t></td\n\t\t><td class=\"dijitReset\"\n\t\t\t><input data-dojo-attach-point=\"valueNode\" type=\"hidden\" ${!nameAttrSetting}\n\t\t\t/><div class=\"dijitReset dijitSliderBarContainerH\" role=\"presentation\" data-dojo-attach-point=\"sliderBarContainer\"\n\t\t\t\t><div role=\"presentation\" data-dojo-attach-point=\"progressBar\" class=\"dijitSliderBar dijitSliderBarH dijitSliderProgressBar dijitSliderProgressBarH\" data-dojo-attach-event=\"press:_onBarClick\"\n\t\t\t\t\t><div class=\"dijitSliderMoveable dijitSliderMoveableH\"\n\t\t\t\t\t\t><div data-dojo-attach-point=\"sliderHandle,focusNode\" class=\"dijitSliderImageHandle dijitSliderImageHandleH\" data-dojo-attach-event=\"press:_onHandleClick\" role=\"slider\"></div\n\t\t\t\t\t></div\n\t\t\t\t></div\n\t\t\t\t><div role=\"presentation\" data-dojo-attach-point=\"remainingBar\" class=\"dijitSliderBar dijitSliderBarH dijitSliderRemainingBar dijitSliderRemainingBarH\" data-dojo-attach-event=\"press:_onBarClick\"></div\n\t\t\t></div\n\t\t></td\n\t\t><td class=\"dijitReset\"\n\t\t\t><div class=\"dijitSliderBar dijitSliderBumper dijitSliderBumperH dijitSliderRightBumper\" data-dojo-attach-event=\"press:_onClkIncBumper\"></div\n\t\t></td\n\t\t><td class=\"dijitReset dijitSliderButtonContainer dijitSliderButtonContainerH\"\n\t\t\t><div class=\"dijitSliderIncrementIconH\" style=\"display:none\" data-dojo-attach-point=\"incrementButton\"><span class=\"dijitSliderButtonInner\">+</span></div\n\t\t></td\n\t></tr\n\t><tr class=\"dijitReset\"\n\t\t><td class=\"dijitReset\" colspan=\"2\"></td\n\t\t><td data-dojo-attach-point=\"containerNode,bottomDecoration\" class=\"dijitReset dijitSliderDecoration dijitSliderDecorationB dijitSliderDecorationH\"></td\n\t\t><td class=\"dijitReset\" colspan=\"2\"></td\n\t></tr\n></table>\n"
  4.     }
  5. });
  6. define("dijit/form/HorizontalSlider", ["dojo/_base/array", "dojo/_base/declare", "dojo/dnd/move", "dojo/_base/event", "dojo/_base/fx", "dojo/dom-geometry", "dojo/dom-style", "dojo/keys", "dojo/_base/lang", "dojo/sniff", "dojo/dnd/Moveable", "dojo/dnd/Mover", "dojo/query", "dojo/mouse", "../registry", "../focus", "../typematic", "./Button", "./_FormValueWidget", "../_Container", "dojo/text!./templates/HorizontalSlider.html"], function(_1, _2, _3, _4, fx, _5, _6, _7, _8, _9, _a, _b, _c, _d, _e, _f, _10, _11, _12, _13, _14) {
  7.     var _15 = _2("dijit.form._SliderMover", _b, {
  8.         onMouseMove: function(e) {
  9.             var _16 = this.widget;
  10.             var _17 = _16._abspos;
  11.             if (!_17) {
  12.                 _17 = _16._abspos = _5.position(_16.sliderBarContainer, true);
  13.                 _16._setPixelValue_ = _8.hitch(_16, "_setPixelValue");
  14.                 _16._isReversed_ = _16._isReversed();
  15.             }
  16.             var _18 = e[_16._mousePixelCoord] - _17[_16._startingPixelCoord];
  17.             _16._setPixelValue_(_16._isReversed_ ? (_17[_16._pixelCount] - _18) : _18, _17[_16._pixelCount], false);
  18.         },
  19.         destroy: function(e) {
  20.             _b.prototype.destroy.apply(this, arguments);
  21.             var _19 = this.widget;
  22.             _19._abspos = null;
  23.             _19._setValueAttr(_19.value, true);
  24.         }
  25.     });
  26.     var _1a = _2("dijit.form.HorizontalSlider", [_12, _13], {
  27.         templateString: _14,
  28.         value: 0,
  29.         showButtons: true,
  30.         minimum: 0,
  31.         maximum: 100,
  32.         discreteValues: Infinity,
  33.         pageIncrement: 2,
  34.         clickSelect: true,
  35.         slideDuration: _e.defaultDuration,
  36.         _setIdAttr: "",
  37.         baseClass: "dijitSlider",
  38.         cssStateNodes: {
  39.             incrementButton: "dijitSliderIncrementButton",
  40.             decrementButton: "dijitSliderDecrementButton",
  41.             focusNode: "dijitSliderThumb"
  42.         },
  43.         _mousePixelCoord: "pageX",
  44.         _pixelCount: "w",
  45.         _startingPixelCoord: "x",
  46.         _handleOffsetCoord: "left",
  47.         _progressPixelSize: "width",
  48.         _onKeyUp: function(e) {
  49.             if (this.disabled || this.readOnly || e.altKey || e.ctrlKey || e.metaKey) {
  50.                 return;
  51.             }
  52.             this._setValueAttr(this.value, true);
  53.         },
  54.         _onKeyPress: function(e) {
  55.             if (this.disabled || this.readOnly || e.altKey || e.ctrlKey || e.metaKey) {
  56.                 return;
  57.             }
  58.             switch (e.charOrCode) {
  59.                 case _7.HOME:
  60.                     this._setValueAttr(this.minimum, false);
  61.                     break;
  62.                 case _7.END:
  63.                     this._setValueAttr(this.maximum, false);
  64.                     break;
  65.                 case ((this._descending || this.isLeftToRight()) ? _7.RIGHT_ARROW : _7.LEFT_ARROW):
  66.                 case (this._descending === false ? _7.DOWN_ARROW : _7.UP_ARROW):
  67.                 case (this._descending === false ? _7.PAGE_DOWN : _7.PAGE_UP):
  68.                     this.increment(e);
  69.                     break;
  70.                 case ((this._descending || this.isLeftToRight()) ? _7.LEFT_ARROW : _7.RIGHT_ARROW):
  71.                 case (this._descending === false ? _7.UP_ARROW : _7.DOWN_ARROW):
  72.                 case (this._descending === false ? _7.PAGE_UP : _7.PAGE_DOWN):
  73.                     this.decrement(e);
  74.                     break;
  75.                 default:
  76.                     return;
  77.             }
  78.             _4.stop(e);
  79.         },
  80.         _onHandleClick: function(e) {
  81.             if (this.disabled || this.readOnly) {
  82.                 return;
  83.             }
  84.             if (!_9("ie")) {
  85.                 _f.focus(this.sliderHandle);
  86.             }
  87.             _4.stop(e);
  88.         },
  89.         _isReversed: function() {
  90.             return !this.isLeftToRight();
  91.         },
  92.         _onBarClick: function(e) {
  93.             if (this.disabled || this.readOnly || !this.clickSelect) {
  94.                 return;
  95.             }
  96.             _f.focus(this.sliderHandle);
  97.             _4.stop(e);
  98.             var _1b = _5.position(this.sliderBarContainer, true);
  99.             var _1c = e[this._mousePixelCoord] - _1b[this._startingPixelCoord];
  100.             this._setPixelValue(this._isReversed() ? (_1b[this._pixelCount] - _1c) : _1c, _1b[this._pixelCount], true);
  101.             this._movable.onMouseDown(e);
  102.         },
  103.         _setPixelValue: function(_1d, _1e, _1f) {
  104.             if (this.disabled || this.readOnly) {
  105.                 return;
  106.             }
  107.             var _20 = this.discreteValues;
  108.             if (_20 <= 1 || _20 == Infinity) {
  109.                 _20 = _1e;
  110.             }
  111.             _20--;
  112.             var _21 = _1e / _20;
  113.             var _22 = Math.round(_1d / _21);
  114.             this._setValueAttr(Math.max(Math.min((this.maximum - this.minimum) * _22 / _20 + this.minimum, this.maximum), this.minimum), _1f);
  115.         },
  116.         _setValueAttr: function(_23, _24) {
  117.             this._set("value", _23);
  118.             this.valueNode.value = _23;
  119.             this.focusNode.setAttribute("aria-valuenow", _23);
  120.             this.inherited(arguments);
  121.             var _25 = (_23 - this.minimum) / (this.maximum - this.minimum);
  122.             var _26 = (this._descending === false) ? this.remainingBar : this.progressBar;
  123.             var _27 = (this._descending === false) ? this.progressBar : this.remainingBar;
  124.             if (this._inProgressAnim && this._inProgressAnim.status != "stopped") {
  125.                 this._inProgressAnim.stop(true);
  126.             }
  127.             if (_24 && this.slideDuration > 0 && _26.style[this._progressPixelSize]) {
  128.                 var _28 = this;
  129.                 var _29 = {};
  130.                 var _2a = parseFloat(_26.style[this._progressPixelSize]);
  131.                 var _2b = this.slideDuration * (_25 - _2a / 100);
  132.                 if (_2b == 0) {
  133.                     return;
  134.                 }
  135.                 if (_2b < 0) {
  136.                     _2b = 0 - _2b;
  137.                 }
  138.                 _29[this._progressPixelSize] = {
  139.                     start: _2a,
  140.                     end: _25 * 100,
  141.                     units: "%"
  142.                 };
  143.                 this._inProgressAnim = fx.animateProperty({
  144.                     node: _26,
  145.                     duration: _2b,
  146.                     onAnimate: function(v) {
  147.                         _27.style[_28._progressPixelSize] = (100 - parseFloat(v[_28._progressPixelSize])) + "%";
  148.                     },
  149.                     onEnd: function() {
  150.                         delete _28._inProgressAnim;
  151.                     },
  152.                     properties: _29
  153.                 });
  154.                 this._inProgressAnim.play();
  155.             } else {
  156.                 _26.style[this._progressPixelSize] = (_25 * 100) + "%";
  157.                 _27.style[this._progressPixelSize] = ((1 - _25) * 100) + "%";
  158.             }
  159.         },
  160.         _bumpValue: function(_2c, _2d) {
  161.             if (this.disabled || this.readOnly) {
  162.                 return;
  163.             }
  164.             var s = _6.getComputedStyle(this.sliderBarContainer);
  165.             var c = _5.getContentBox(this.sliderBarContainer, s);
  166.             var _2e = this.discreteValues;
  167.             if (_2e <= 1 || _2e == Infinity) {
  168.                 _2e = c[this._pixelCount];
  169.             }
  170.             _2e--;
  171.             var _2f = (this.value - this.minimum) * _2e / (this.maximum - this.minimum) + _2c;
  172.             if (_2f < 0) {
  173.                 _2f = 0;
  174.             }
  175.             if (_2f > _2e) {
  176.                 _2f = _2e;
  177.             }
  178.             _2f = _2f * (this.maximum - this.minimum) / _2e + this.minimum;
  179.             this._setValueAttr(_2f, _2d);
  180.         },
  181.         _onClkBumper: function(val) {
  182.             if (this.disabled || this.readOnly || !this.clickSelect) {
  183.                 return;
  184.             }
  185.             this._setValueAttr(val, true);
  186.         },
  187.         _onClkIncBumper: function() {
  188.             this._onClkBumper(this._descending === false ? this.minimum : this.maximum);
  189.         },
  190.         _onClkDecBumper: function() {
  191.             this._onClkBumper(this._descending === false ? this.maximum : this.minimum);
  192.         },
  193.         decrement: function(e) {
  194.             this._bumpValue(e.charOrCode == _7.PAGE_DOWN ? -this.pageIncrement : -1);
  195.         },
  196.         increment: function(e) {
  197.             this._bumpValue(e.charOrCode == _7.PAGE_UP ? this.pageIncrement : 1);
  198.         },
  199.         _mouseWheeled: function(evt) {
  200.             _4.stop(evt);
  201.             this._bumpValue(evt.wheelDelta < 0 ? -1 : 1, true);
  202.         },
  203.         startup: function() {
  204.             if (this._started) {
  205.                 return;
  206.             }
  207.             _1.forEach(this.getChildren(), function(_30) {
  208.                 if (this[_30.container] != this.containerNode) {
  209.                     this[_30.container].appendChild(_30.domNode);
  210.                 }
  211.             }, this);
  212.             this.inherited(arguments);
  213.         },
  214.         _typematicCallback: function(_31, _32, e) {
  215.             if (_31 == -1) {
  216.                 this._setValueAttr(this.value, true);
  217.             } else {
  218.                 this[(_32 == (this._descending ? this.incrementButton : this.decrementButton)) ? "decrement" : "increment"](e);
  219.             }
  220.         },
  221.         buildRendering: function() {
  222.             this.inherited(arguments);
  223.             if (this.showButtons) {
  224.                 this.incrementButton.style.display = "";
  225.                 this.decrementButton.style.display = "";
  226.             }
  227.             var _33 = _c("label[for=\"" + this.id + "\"]");
  228.             if (_33.length) {
  229.                 if (!_33[0].id) {
  230.                     _33[0].id = this.id + "_label";
  231.                 }
  232.                 this.focusNode.setAttribute("aria-labelledby", _33[0].id);
  233.             }
  234.             this.focusNode.setAttribute("aria-valuemin", this.minimum);
  235.             this.focusNode.setAttribute("aria-valuemax", this.maximum);
  236.         },
  237.         postCreate: function() {
  238.             this.inherited(arguments);
  239.             if (this.showButtons) {
  240.                 this.own(_10.addMouseListener(this.decrementButton, this, "_typematicCallback", 25, 500), _10.addMouseListener(this.incrementButton, this, "_typematicCallback", 25, 500));
  241.             }
  242.             this.connect(this.domNode, _d.wheel, "_mouseWheeled");
  243.             var _34 = _2(_15, {
  244.                 widget: this
  245.             });
  246.             this._movable = new _a(this.sliderHandle, {
  247.                 mover: _34
  248.             });
  249.             this._layoutHackIE7();
  250.         },
  251.         destroy: function() {
  252.             this._movable.destroy();
  253.             if (this._inProgressAnim && this._inProgressAnim.status != "stopped") {
  254.                 this._inProgressAnim.stop(true);
  255.             }
  256.             this.inherited(arguments);
  257.         }
  258.     });
  259.     _1a._Mover = _15;
  260.     return _1a;
  261. });
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!