| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457 |
- /**
- * DevExtreme (viz/range_selector/sliders_controller.js)
- * Version: 19.1.16
- * Build date: Tue Oct 18 2022
- *
- * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
- * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
- */
- "use strict";
- var noop = require("../../core/utils/common").noop;
- var commonModule = require("./common");
- var animationSettings = commonModule.utils.animationSettings;
- var emptySliderMarkerText = commonModule.consts.emptySliderMarkerText;
- var Slider = require("./slider");
- var _normalizeEnum = require("../core/utils").normalizeEnum;
- var typeUtils = require("../../core/utils/type");
- var isNumeric = typeUtils.isNumeric;
- var vizUtils = require("../core/utils");
- var adjust = require("../../core/utils/math").adjust;
- function buildRectPoints(left, top, right, bottom) {
- return [left, top, right, top, right, bottom, left, bottom]
- }
- function valueOf(value) {
- return value && value.valueOf()
- }
- function isLess(a, b) {
- return a < b
- }
- function isGreater(a, b) {
- return a > b
- }
- function selectClosestValue(target, values) {
- var start = 0;
- var end = values ? values.length - 1 : 0;
- var val = target;
- while (end - start > 1) {
- var middle = start + end >> 1;
- val = values[middle];
- if (val === target) {
- return target
- } else {
- if (target < val) {
- end = middle
- } else {
- start = middle
- }
- }
- }
- if (values) {
- val = values[target - values[start] <= values[end] - target ? start : end]
- }
- return val
- }
- function dummyProcessSelectionChanged() {
- this._lastSelectedRange = this.getSelectedRange();
- delete this._processSelectionChanged
- }
- function suppressSetSelectedRange(controller) {
- controller.setSelectedRange = noop;
- if (controller._processSelectionChanged === dummyProcessSelectionChanged) {
- controller._processSelectionChanged()
- }
- }
- function restoreSetSelectedRange(controller) {
- delete controller.setSelectedRange
- }
- function SlidersController(params) {
- var that = this;
- var sliderParams = {
- renderer: params.renderer,
- root: params.root,
- trackersGroup: params.trackersGroup,
- translator: params.translator
- };
- that._params = params;
- that._areaTracker = params.renderer.path(null, "area").attr({
- "class": "area-tracker",
- fill: "#000000",
- opacity: 1e-4
- }).append(params.trackersGroup);
- that._selectedAreaTracker = params.renderer.path(null, "area").attr({
- "class": "selected-area-tracker",
- fill: "#000000",
- opacity: 1e-4
- }).append(params.trackersGroup);
- that._shutter = params.renderer.path(null, "area").append(params.root);
- that._sliders = [new Slider(sliderParams, 0), new Slider(sliderParams, 1)];
- that._processSelectionChanged = dummyProcessSelectionChanged
- }
- SlidersController.prototype = {
- constructor: SlidersController,
- dispose: function() {
- this._sliders[0].dispose();
- this._sliders[1].dispose()
- },
- getTrackerTargets: function() {
- return {
- area: this._areaTracker,
- selectedArea: this._selectedAreaTracker,
- sliders: this._sliders
- }
- },
- _processSelectionChanged: function(e) {
- var that = this;
- var selectedRange = that.getSelectedRange();
- if (valueOf(selectedRange.startValue) !== valueOf(that._lastSelectedRange.startValue) || valueOf(selectedRange.endValue) !== valueOf(that._lastSelectedRange.endValue)) {
- that._params.updateSelectedRange(selectedRange, that._lastSelectedRange, e);
- that._lastSelectedRange = selectedRange
- }
- },
- update: function(verticalRange, behavior, isCompactMode, sliderHandleOptions, sliderMarkerOptions, shutterOptions, rangeBounds, fullTicks, selectedRangeColor) {
- var that = this;
- var screenRange = that._params.translator.getScreenRange();
- that._verticalRange = verticalRange;
- that._minRange = rangeBounds.minRange;
- that._maxRange = rangeBounds.maxRange;
- that._animationEnabled = behavior.animationEnabled && that._params.renderer.animationEnabled();
- that._allowSlidersSwap = behavior.allowSlidersSwap;
- that._sliders[0].update(verticalRange, sliderHandleOptions, sliderMarkerOptions);
- that._sliders[1].update(verticalRange, sliderHandleOptions, sliderMarkerOptions);
- that._sliders[0]._position = that._sliders[1]._position = screenRange[0];
- that._values = !that._params.translator.isValueProlonged && behavior.snapToTicks ? fullTicks : null;
- that._areaTracker.attr({
- points: buildRectPoints(screenRange[0], verticalRange[0], screenRange[1], verticalRange[1])
- });
- that._isCompactMode = isCompactMode;
- that._shutterOffset = sliderHandleOptions.width / 2;
- that._updateSelectedView(shutterOptions, selectedRangeColor);
- that._isOnMoving = "onmoving" === _normalizeEnum(behavior.callValueChanged);
- that._updateSelectedRange();
- that._applyTotalPosition(false)
- },
- _updateSelectedView: function(shutterOptions, selectedRangeColor) {
- var settings = {
- fill: null,
- "fill-opacity": null,
- stroke: null,
- "stroke-width": null
- };
- if (this._isCompactMode) {
- settings.stroke = selectedRangeColor;
- settings["stroke-width"] = 3;
- settings.sharp = "v"
- } else {
- settings.fill = shutterOptions.color;
- settings["fill-opacity"] = shutterOptions.opacity
- }
- this._shutter.attr(settings)
- },
- _updateSelectedRange: function() {
- var that = this;
- var sliders = that._sliders;
- sliders[0].cancelAnimation();
- sliders[1].cancelAnimation();
- that._shutter.stopAnimation();
- if (that._params.translator.getBusinessRange().isEmpty()) {
- sliders[0]._setText(emptySliderMarkerText);
- sliders[1]._setText(emptySliderMarkerText);
- sliders[0]._value = sliders[1]._value = void 0;
- sliders[0]._position = that._params.translator.getScreenRange()[0];
- sliders[1]._position = that._params.translator.getScreenRange()[1];
- that._applyTotalPosition(false);
- suppressSetSelectedRange(that)
- } else {
- restoreSetSelectedRange(that)
- }
- },
- _applyTotalPosition: function(isAnimated) {
- var sliders = this._sliders;
- isAnimated = this._animationEnabled && isAnimated;
- sliders[0].applyPosition(isAnimated);
- sliders[1].applyPosition(isAnimated);
- var areOverlapped = sliders[0].getCloudBorder() > sliders[1].getCloudBorder();
- sliders[0].setOverlapped(areOverlapped);
- sliders[1].setOverlapped(areOverlapped);
- this._applyAreaTrackersPosition();
- this._applySelectedRangePosition(isAnimated)
- },
- _applyAreaTrackersPosition: function() {
- var that = this;
- var position1 = that._sliders[0].getPosition();
- var position2 = that._sliders[1].getPosition();
- that._selectedAreaTracker.attr({
- points: buildRectPoints(position1, that._verticalRange[0], position2, that._verticalRange[1])
- }).css({
- cursor: Math.abs(that._params.translator.getScreenRange()[1] - that._params.translator.getScreenRange()[0] - position2 + position1) < .001 ? "default" : "pointer"
- })
- },
- _applySelectedRangePosition: function(isAnimated) {
- var that = this;
- var verticalRange = that._verticalRange;
- var pos1 = that._sliders[0].getPosition();
- var pos2 = that._sliders[1].getPosition();
- var points;
- if (that._isCompactMode) {
- points = [pos1 + Math.ceil(that._shutterOffset), (verticalRange[0] + verticalRange[1]) / 2, pos2 - Math.floor(that._shutterOffset), (verticalRange[0] + verticalRange[1]) / 2]
- } else {
- var screenRange = that._params.axis.getVisibleArea();
- points = [buildRectPoints(screenRange[0], verticalRange[0], Math.max(pos1 - Math.floor(that._shutterOffset), screenRange[0]), verticalRange[1]), buildRectPoints(screenRange[1], verticalRange[0], Math.min(pos2 + Math.ceil(that._shutterOffset), screenRange[1]), verticalRange[1])]
- }
- if (isAnimated) {
- that._shutter.animate({
- points: points
- }, animationSettings)
- } else {
- that._shutter.attr({
- points: points
- })
- }
- },
- getSelectedRange: function() {
- return {
- startValue: this._sliders[0].getValue(),
- endValue: this._sliders[1].getValue()
- }
- },
- setSelectedRange: function(visualRange, e) {
- visualRange = visualRange || {};
- var that = this;
- var translator = that._params.translator;
- var businessRange = translator.getBusinessRange();
- var compare = "discrete" === businessRange.axisType ? function(a, b) {
- return a < b
- } : function(a, b) {
- return a <= b
- };
- var _vizUtils$adjustVisua = vizUtils.adjustVisualRange({
- dataType: businessRange.dataType,
- axisType: businessRange.axisType,
- base: businessRange.base
- }, {
- startValue: translator.isValid(visualRange.startValue) ? translator.getCorrectValue(visualRange.startValue, 1) : void 0,
- endValue: translator.isValid(visualRange.endValue) ? translator.getCorrectValue(visualRange.endValue, -1) : void 0,
- length: visualRange.length
- }, {
- min: businessRange.minVisible,
- max: businessRange.maxVisible,
- categories: businessRange.categories
- }),
- startValue = _vizUtils$adjustVisua.startValue,
- endValue = _vizUtils$adjustVisua.endValue;
- startValue = isNumeric(startValue) ? adjust(startValue) : startValue;
- endValue = isNumeric(endValue) ? adjust(endValue) : endValue;
- var values = compare(translator.to(startValue, -1), translator.to(endValue, 1)) ? [startValue, endValue] : [endValue, startValue];
- that._sliders[0].setDisplayValue(values[0]);
- that._sliders[1].setDisplayValue(values[1]);
- that._sliders[0]._position = translator.to(values[0], -1);
- that._sliders[1]._position = translator.to(values[1], 1);
- that._applyTotalPosition(true);
- that._processSelectionChanged(e)
- },
- beginSelectedAreaMoving: function(initialPosition) {
- var that = this;
- var sliders = that._sliders;
- var offset = (sliders[0].getPosition() + sliders[1].getPosition()) / 2 - initialPosition;
- var currentPosition = initialPosition;
- move.complete = function(e) {
- that._dockSelectedArea(e)
- };
- return move;
- function move(position, e) {
- if (position !== currentPosition && position > currentPosition === position > (sliders[0].getPosition() + sliders[1].getPosition()) / 2 - offset) {
- that._moveSelectedArea(position + offset, false, e)
- }
- currentPosition = position
- }
- },
- _dockSelectedArea: function(e) {
- var translator = this._params.translator;
- var sliders = this._sliders;
- sliders[0]._position = translator.to(sliders[0].getValue(), -1);
- sliders[1]._position = translator.to(sliders[1].getValue(), 1);
- this._applyTotalPosition(true);
- this._processSelectionChanged(e)
- },
- moveSelectedArea: function(screenPosition, e) {
- this._moveSelectedArea(screenPosition, true, e);
- this._dockSelectedArea(e)
- },
- _moveSelectedArea: function(screenPosition, isAnimated, e) {
- var that = this;
- var translator = that._params.translator;
- var sliders = that._sliders;
- var interval = sliders[1].getPosition() - sliders[0].getPosition();
- var startPosition = screenPosition - interval / 2;
- var endPosition = screenPosition + interval / 2;
- if (startPosition < translator.getScreenRange()[0]) {
- startPosition = translator.getScreenRange()[0];
- endPosition = startPosition + interval
- }
- if (endPosition > translator.getScreenRange()[1]) {
- endPosition = translator.getScreenRange()[1];
- startPosition = endPosition - interval
- }
- var startValue = selectClosestValue(translator.from(startPosition, -1), that._values);
- sliders[0].setDisplayValue(startValue);
- sliders[1].setDisplayValue(selectClosestValue(translator.from(translator.to(startValue, -1) + interval, 1), that._values));
- sliders[0]._position = startPosition;
- sliders[1]._position = endPosition;
- that._applyTotalPosition(isAnimated);
- if (that._isOnMoving) {
- that._processSelectionChanged(e)
- }
- },
- placeSliderAndBeginMoving: function(firstPosition, secondPosition, e) {
- var that = this;
- var translator = that._params.translator;
- var sliders = that._sliders;
- var index = firstPosition < secondPosition ? 0 : 1;
- var dir = index > 0 ? 1 : -1;
- var compare = index > 0 ? isGreater : isLess;
- var antiCompare = index > 0 ? isLess : isGreater;
- var thresholdPosition;
- var positions = [];
- var values = [];
- values[index] = translator.from(firstPosition, dir);
- values[1 - index] = translator.from(secondPosition, -dir);
- positions[1 - index] = secondPosition;
- if (translator.isValueProlonged) {
- if (compare(firstPosition, translator.to(values[index], dir))) {
- values[index] = translator.from(firstPosition, -dir)
- }
- if (compare(secondPosition, translator.to(values[index], -dir))) {
- values[1 - index] = values[index]
- }
- }
- if (that._minRange) {
- thresholdPosition = translator.to(translator.add(selectClosestValue(values[index], that._values), that._minRange, -dir), -dir);
- if (compare(secondPosition, thresholdPosition)) {
- values[1 - index] = translator.add(values[index], that._minRange, -dir)
- }
- thresholdPosition = translator.to(translator.add(translator.getRange()[1 - index], that._minRange, dir), -dir);
- if (antiCompare(firstPosition, thresholdPosition)) {
- values[1 - index] = translator.getRange()[1 - index];
- values[index] = translator.add(values[1 - index], that._minRange, dir);
- positions[1 - index] = firstPosition
- }
- }
- values[0] = selectClosestValue(values[0], that._values);
- values[1] = selectClosestValue(values[1], that._values);
- positions[index] = translator.to(values[index], dir);
- sliders[0].setDisplayValue(values[0]);
- sliders[1].setDisplayValue(values[1]);
- sliders[0]._position = positions[0];
- sliders[1]._position = positions[1];
- that._applyTotalPosition(true);
- if (that._isOnMoving) {
- that._processSelectionChanged(e)
- }
- var handler = that.beginSliderMoving(1 - index, secondPosition);
- sliders[1 - index]._sliderGroup.stopAnimation();
- that._shutter.stopAnimation();
- handler(secondPosition);
- return handler
- },
- beginSliderMoving: function(initialIndex, initialPosition) {
- var that = this;
- var translator = that._params.translator;
- var sliders = that._sliders;
- var minPosition = translator.getScreenRange()[0];
- var maxPosition = translator.getScreenRange()[1];
- var index = initialIndex;
- var staticPosition = sliders[1 - index].getPosition();
- var currentPosition = initialPosition;
- var dir = index > 0 ? 1 : -1;
- var compareMin = index > 0 ? isLess : isGreater;
- var compareMax = index > 0 ? isGreater : isLess;
- var moveOffset = sliders[index].getPosition() - initialPosition;
- var swapOffset = compareMin(sliders[index].getPosition(), initialPosition) ? -moveOffset : moveOffset;
- move.complete = function(e) {
- sliders[index]._setValid(true);
- that._dockSelectedArea(e)
- };
- return move;
- function move(position, e) {
- var isValid;
- if (position !== currentPosition) {
- if (compareMin(position + swapOffset, staticPosition)) {
- isValid = that._allowSlidersSwap;
- if (isValid && !translator.isValueProlonged && that._minRange) {
- isValid = translator.isValid(translator.add(sliders[1 - index].getValue(), that._minRange, -dir))
- }
- if (isValid) {
- that._changeMovingSlider(index);
- index = 1 - index;
- dir = -dir;
- var temp = compareMin;
- compareMin = compareMax;
- compareMax = temp;
- moveOffset = -dir * Math.abs(moveOffset);
- swapOffset = -moveOffset
- }
- }
- if (compareMax(position + moveOffset, staticPosition)) {
- isValid = true;
- var slider = sliders[index];
- var value = sliders[1 - index].getValue();
- var pos = Math.max(Math.min(position + moveOffset, maxPosition), minPosition);
- if (isValid && translator.isValueProlonged) {
- isValid = !compareMin(pos, translator.to(value, dir))
- }
- if (isValid && that._minRange) {
- isValid = !compareMin(pos, translator.to(translator.add(value, that._minRange, dir), dir))
- }
- if (isValid && that._maxRange) {
- isValid = !compareMax(pos, translator.to(translator.add(value, that._maxRange, dir), dir))
- }
- slider._setValid(isValid);
- slider.setDisplayValue(isValid ? selectClosestValue(translator.from(pos, dir), that._values) : slider.getValue());
- slider._position = pos;
- that._applyTotalPosition(false);
- slider.toForeground();
- if (that._isOnMoving) {
- that._processSelectionChanged(e)
- }
- }
- }
- currentPosition = position
- }
- },
- _changeMovingSlider: function(index) {
- var that = this;
- var translator = that._params.translator;
- var sliders = that._sliders;
- var position = sliders[1 - index].getPosition();
- var dir = index > 0 ? 1 : -1;
- var newValue;
- sliders[index].setDisplayValue(selectClosestValue(translator.from(position, dir), that._values));
- newValue = translator.from(position, -dir);
- if (translator.isValueProlonged) {
- newValue = translator.from(position, dir)
- } else {
- if (that._minRange) {
- newValue = translator.add(newValue, that._minRange, -dir)
- }
- }
- sliders[1 - index].setDisplayValue(selectClosestValue(newValue, that._values));
- sliders[index]._setValid(true);
- sliders[index]._marker._update();
- sliders[0]._position = sliders[1]._position = position
- },
- foregroundSlider: function(index) {
- this._sliders[index].toForeground()
- }
- };
- exports.SlidersController = SlidersController;
|