scichart
Version:
Fast WebGL JavaScript Charting Library and Framework
195 lines (194 loc) • 11.3 kB
JavaScript
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null)
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.AnnotationHoverModifier = void 0;
var IAnnotation_1 = require("../../Charting/Visuals/Annotations/IAnnotation");
var ChartModifierType_1 = require("../../types/ChartModifierType");
var CursorStyle_1 = require("../../types/CursorStyle");
var PointerEventsMediatorModifier_1 = require("./PointerEventsMediatorModifier");
/**
* Enables hover detection on annotations.
* Accepts {@link IAnnotationHoverModifierOptions}
*
* ---
* 📚 Docs: {@link https://www.scichart.com/documentation/js/v4/2d-charts/chart-modifier-api/selection/annotation-hover/}
*/
var AnnotationHoverModifier = /** @class */ (function (_super) {
__extends(AnnotationHoverModifier, _super);
/**
* Creates an instance of the AnnotationHoverModifier
* @param options Optional parameters of type {@link IAnnotationHoverModifierOptions} used to configure the modifier
*
* ---
* 📚 Docs: {@link https://www.scichart.com/documentation/js/v4/2d-charts/chart-modifier-api/selection/annotation-hover/}
*/
function AnnotationHoverModifier(options) {
var _this = this;
var _a, _b;
_this = _super.call(this, options) || this;
_this.type = ChartModifierType_1.EChart2DModifierType.AnnotationHover;
_this.enableCursorProperty = true;
_this.idleCursorProperty = CursorStyle_1.ECursorStyle.Default;
_this.enableHoverProperty = true;
_this.enableCursorProperty = (_a = options === null || options === void 0 ? void 0 : options.enableCursor) !== null && _a !== void 0 ? _a : _this.enableCursorProperty;
_this.idleCursorProperty = (_b = options === null || options === void 0 ? void 0 : options.idleCursor) !== null && _b !== void 0 ? _b : _this.idleCursorProperty;
return _this;
}
/** @inheritDoc */
AnnotationHoverModifier.prototype.onAttach = function () {
_super.prototype.onAttach.call(this);
this.cursorHost = this.getCursorHost();
};
/** @inheritDoc */
AnnotationHoverModifier.prototype.onDetach = function () {
this.clearCursor();
this.cursorHost = undefined;
_super.prototype.onDetach.call(this);
};
/** @inheritDoc */
AnnotationHoverModifier.prototype.modifierMouseMove = function (args) {
if (!this.canReceiveMouseEvents) {
return;
}
if (this.isInteractionBypassActive()) {
this.clearHoverState(args);
this.applyCursor(this.idleCursorProperty);
return;
}
_super.prototype.modifierMouseMove.call(this, args);
this.updateCursor(args);
};
/** @inheritDoc */
AnnotationHoverModifier.prototype.modifierMouseDown = function (args) {
if (!this.canReceiveMouseEvents) {
return;
}
_super.prototype.modifierMouseDown.call(this, args);
this.updateCursor(args);
};
/** @inheritDoc */
AnnotationHoverModifier.prototype.modifierMouseUp = function (args) {
if (!this.canReceiveMouseEvents) {
return;
}
_super.prototype.modifierMouseUp.call(this, args);
this.updateCursor(args);
};
/** @inheritDoc */
AnnotationHoverModifier.prototype.modifierMouseLeave = function (args) {
_super.prototype.modifierMouseLeave.call(this, args);
this.clearCursor();
};
/** @inheritDoc */
AnnotationHoverModifier.prototype.toJSON = function () {
var json = _super.prototype.toJSON.call(this);
var options = {
enableCursor: this.enableCursorProperty,
idleCursor: this.idleCursorProperty
};
Object.assign(json.options, options);
return json;
};
AnnotationHoverModifier.prototype.getAllTargets = function () {
var visibleAnnotations = this.parentSurface.annotations.asArray().filter(function (annotation) { return !annotation.isHidden; });
var visibleDomAnnotations = visibleAnnotations.filter(function (annotation) { return annotation.isDomAnnotation; });
var svgAnnotations = visibleDomAnnotations.filter(function (annotation) { return annotation.isSvgAnnotation; });
var htmlAnnotations = visibleDomAnnotations.filter(function (annotation) { return !annotation.isSvgAnnotation; });
var renderContextAnnotations = visibleAnnotations.filter(function (annotation) { return !annotation.isSvgAnnotation; });
var htmlBackgroundAnnotations = htmlAnnotations.filter(function (annotation) { return annotation.annotationLayer === IAnnotation_1.EAnnotationLayer.Background; });
var htmlBelowChartAnnotations = htmlAnnotations.filter(function (annotation) { return annotation.annotationLayer === IAnnotation_1.EAnnotationLayer.BelowChart; });
var htmlForegroundAnnotations = htmlAnnotations.filter(function (annotation) { return annotation.annotationLayer === IAnnotation_1.EAnnotationLayer.AboveChart; });
var svgBackgroundAnnotations = svgAnnotations.filter(function (annotation) { return annotation.annotationLayer === IAnnotation_1.EAnnotationLayer.Background; });
var svgBelowChartAnnotations = svgAnnotations.filter(function (annotation) { return annotation.annotationLayer === IAnnotation_1.EAnnotationLayer.BelowChart; });
var svgForegroundAnnotations = svgAnnotations.filter(function (annotation) { return annotation.annotationLayer === IAnnotation_1.EAnnotationLayer.AboveChart; });
var renderContextBackgroundAnnotations = renderContextAnnotations.filter(function (annotation) { return annotation.annotationLayer === IAnnotation_1.EAnnotationLayer.Background; });
var renderContextAnnotationsBelowChart = renderContextAnnotations.filter(function (annotation) { return annotation.annotationLayer === IAnnotation_1.EAnnotationLayer.BelowChart; });
var renderContextAnnotationsAboveChart = renderContextAnnotations.filter(function (annotation) { return annotation.annotationLayer === IAnnotation_1.EAnnotationLayer.AboveChart; });
return __spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray([], htmlBackgroundAnnotations, true), svgBackgroundAnnotations, true), renderContextBackgroundAnnotations, true), renderContextAnnotationsBelowChart, true), renderContextAnnotationsAboveChart, true), svgBelowChartAnnotations, true), htmlBelowChartAnnotations, true), svgForegroundAnnotations, true), htmlForegroundAnnotations, true);
};
AnnotationHoverModifier.prototype.updateCursor = function (args) {
var _a, _b, _c, _d;
if (!this.enableCursorProperty) {
return;
}
var selectedAnnotation = (_b = (_a = this.parentSurface) === null || _a === void 0 ? void 0 : _a.adornerLayer) === null || _b === void 0 ? void 0 : _b.selectedAnnotation;
if (selectedAnnotation === null || selectedAnnotation === void 0 ? void 0 : selectedAnnotation.isDraggingStarted) {
this.applyCursor((_c = selectedAnnotation.resolveInteractionCursor(args.mousePoint)) !== null && _c !== void 0 ? _c : this.idleCursorProperty);
return;
}
var hoveredAnnotation = this.previousHoveredEntities[0];
if (hoveredAnnotation) {
this.applyCursor((_d = hoveredAnnotation.resolveInteractionCursor(args.mousePoint)) !== null && _d !== void 0 ? _d : this.idleCursorProperty);
return;
}
this.applyCursor(this.idleCursorProperty);
};
AnnotationHoverModifier.prototype.clearHoverState = function (args) {
var _this = this;
if (!this.previousHoveredEntities.length) {
return;
}
this.previousHoveredEntities.forEach(function (annotation) {
return annotation.hover({
args: args,
isHovered: false,
notifyOutEvent: _this.notifyOutEvent,
notifyPositionUpdate: false
});
});
this.previousHoveredEntities = [];
};
AnnotationHoverModifier.prototype.clearCursor = function () {
this.applyCursor(undefined);
};
AnnotationHoverModifier.prototype.applyCursor = function (cursor) {
var _a;
var host = (_a = this.cursorHost) !== null && _a !== void 0 ? _a : this.getCursorHost();
if (!host) {
this.lastAppliedCursor = undefined;
return;
}
var nextCursor = cursor !== null && cursor !== void 0 ? cursor : "";
if (this.lastAppliedCursor === nextCursor) {
return;
}
host.style.cursor = nextCursor;
this.lastAppliedCursor = nextCursor;
};
AnnotationHoverModifier.prototype.getCursorHost = function () {
var _a, _b, _c, _d;
return (_c = (_b = (_a = this.parentSurface) === null || _a === void 0 ? void 0 : _a.getMainCanvas) === null || _b === void 0 ? void 0 : _b.call(_a)) !== null && _c !== void 0 ? _c : (_d = this.parentSurface) === null || _d === void 0 ? void 0 : _d.domDivContainer;
};
// Ugly TS workaround because `MultiPointAnnotationPlacementModifier` and `FreehandDrawingModifier` are in a different npm packages now;
// TODO-andrei: cleanup
AnnotationHoverModifier.prototype.isInteractionBypassActive = function () {
var _a, _b, _c, _d;
var modifiers = (_d = (_c = (_b = (_a = this.parentSurface) === null || _a === void 0 ? void 0 : _a.chartModifiers) === null || _b === void 0 ? void 0 : _b.asArray) === null || _c === void 0 ? void 0 : _c.call(_b)) !== null && _d !== void 0 ? _d : [];
return modifiers.some(function (modifier) { return !!(modifier === null || modifier === void 0 ? void 0 : modifier.isAnnotationInteractionBypassActive); });
};
return AnnotationHoverModifier;
}(PointerEventsMediatorModifier_1.PointerEventsMediatorModifier));
exports.AnnotationHoverModifier = AnnotationHoverModifier;