@ax-design/reveal-highlight 0.3.0-alpha.7 → 0.4.1

package/es/BaseConfig.js

@@ -0,0 +1,220 @@
+import { createStorage } from './ComputedStyleStorage.js';
+import { extractRGBValue } from './utils/extractRGBValue.js';
+import { isValidateBorderDecorationType } from './utils/isValidateBorderDecorationType.js';
+export class BaseConfig {
+    constructor(store, $canvas, $container) {
+        this.pxRatio = window.devicePixelRatio || 1;
+        this.paintedWidth = 0;
+        this.paintedHeight = 0;
+        this.currentFrameId = -1;
+        this.cachedBoundingRectFrameId = -2;
+        this.cachedBoundingRect = {
+            top: -1,
+            left: -1,
+            width: -1,
+            height: -1,
+        };
+        this.cachedStyleFrameId = -2;
+        this.cachedStyle = {
+            trueFillRadius: [0, 0],
+            color: '',
+            opacity: 1,
+            borderColor: '',
+            borderFillRadius: 0,
+            borderDecorationType: 'miter',
+            borderDecorationRadius: 0,
+            topLeftBorderDecorationRadius: 0,
+            topRightBorderDecorationRadius: 0,
+            bottomLeftBorderDecorationRadius: 0,
+            bottomRightBorderDecorationRadius: 0,
+            withLeftBorderFactor: 1,
+            withRightBorderFactor: 1,
+            withTopBorderFactor: 1,
+            withBottomBorderFactor: 1,
+            borderWidth: 1,
+            hoverLight: true,
+            hoverLightColor: '',
+            hoverLightFillMode: '',
+            hoverLightFillRadius: 0,
+            diffuse: true,
+            pressAnimation: true,
+            pressAnimationFillMode: '',
+            pressAnimationColor: '',
+            pressAnimationSpeed: 0,
+            releaseAnimationAccelerateRate: 0,
+        };
+        this.dirty = false;
+        this.shapeDirty = true;
+        this.fillDirty = true;
+        this.animationDirty = true;
+        /**
+         * If is cleaned up by `RevealBoundaryStore` during animation
+         * duration checkup.
+         */
+        this.cleanedUpForAnimation = false;
+        this.mouseUpClientX = null;
+        this.mouseUpClientY = null;
+        this.mouseDownAnimateStartFrame = null;
+        this.mouseDownAnimateCurrentFrame = null;
+        this.mouseDownAnimateReleasedFrame = null;
+        this.mouseDownAnimateLogicFrame = null;
+        this.mousePressed = false;
+        this.mouseReleased = false;
+        this.cacheBoundingRect = () => {
+            if (this.currentFrameId === this.cachedBoundingRectFrameId) {
+                return;
+            }
+            const boundingRect = this.container.getBoundingClientRect();
+            this.cachedBoundingRect.top = Math.floor(boundingRect.top);
+            this.cachedBoundingRect.left = Math.floor(boundingRect.left);
+            this.cachedBoundingRect.width = Math.floor(boundingRect.width);
+            this.cachedBoundingRect.height = Math.floor(boundingRect.height);
+            this.cachedBoundingRectFrameId = this.currentFrameId;
+        };
+        this.getTrueFillRadius = (trueFillRadius = [0, 0], fillMode = this.computedStyle.get('--reveal-hover-light-fill-radius-mode') || 'relative') => {
+            const b = this.cachedBoundingRect;
+            switch (fillMode) {
+                case 'relative':
+                    trueFillRadius[0] = Math.min(b.width, b.height);
+                    trueFillRadius[1] = Math.max(b.width, b.height);
+                    break;
+                case 'absolute':
+                    trueFillRadius[0] = -1;
+                    trueFillRadius[1] = -1;
+                    break;
+                default:
+                    throw new SyntaxError('The value of `--reveal-hover-light-fill-radius-mode` must be `relative`, `absolute`, but got `' + fillMode + '`!');
+            }
+            return trueFillRadius;
+        };
+        this.getPropFromMultipleSource = (domPropsName, cssPropsName) => {
+            const domProps = this.container.dataset[domPropsName];
+            if (domProps)
+                return domProps;
+            return this.computedStyle.get(cssPropsName);
+        };
+        this.getNumberPropFromMultipleSource = (domPropsName, cssPropsName) => {
+            const domProps = this.container.dataset[domPropsName];
+            if (domProps)
+                return Number.parseFloat(domProps);
+            return this.computedStyle.getNumber(cssPropsName);
+        };
+        this.cacheCanvasPaintingStyle = () => {
+            if (this.currentFrameId === this.cachedStyleFrameId) {
+                return;
+            }
+            if (this.computedStyle.size() === 0) {
+                return;
+            }
+            const parsedBaseColor = extractRGBValue(this.computedStyle.getColor('--reveal-color')) || '0, 0, 0';
+            const parsedBorderColor = extractRGBValue(this.computedStyle.getColor('--reveal-border-color')) || parsedBaseColor;
+            const parsedHoverLightColor = extractRGBValue(this.computedStyle.getColor('--reveal-hover-light-color')) || parsedBaseColor;
+            const parsedPressAnimationColor = extractRGBValue(this.computedStyle.getColor('--reveal-press-animation-color')) || parsedBaseColor;
+            const nextColor = parsedBaseColor;
+            const nextOpacity = this.computedStyle.getNumber('--reveal-opacity');
+            // Border related configurations
+            const nextBorderColor = parsedBorderColor;
+            const nextBorderFillRadius = this.computedStyle.getNumber('--reveal-border-fill-radius');
+            const nextBorderDecorationType = this.computedStyle.get('--reveal-border-decoration-type') || 'miter';
+            const nextBorderWidth = this.computedStyle.getNumber('--reveal-border-width');
+            const nextWithLeftBorderFactor = this.getPropFromMultipleSource('leftBorder', '--reveal-border-left-type') === 'line' ? 1 : 0;
+            const nextWithRightBorderFactor = this.getPropFromMultipleSource('rightBorder', '--reveal-border-right-type') === 'line' ? 1 : 0;
+            const nextWithTopBorderFactor = this.getPropFromMultipleSource('topBorder', '--reveal-border-top-type') === 'line' ? 1 : 0;
+            const nextWithBottomBorderFactor = this.getPropFromMultipleSource('bottomBorder', '--reveal-border-bottom-type') === 'line' ? 1 : 0;
+            // Hover light related configurations
+            const nextHoverLight = this.computedStyle.get('--reveal-hover-light') === 'true';
+            const nextHoverLightColor = parsedHoverLightColor;
+            const nextHoverLightFillRadius = this.computedStyle.getNumber('--reveal-hover-light-fill-radius');
+            const nextHoverLightFillMode = this.computedStyle.get('--reveal-hover-light-fill-radius-mode') || 'relative';
+            // Press animation related configurations
+            const nextDiffuse = this.computedStyle.get('--reveal-diffuse') === 'true';
+            const nextPressAnimation = this.computedStyle.get('--reveal-press-animation') === 'true';
+            const nextPressAnimationFillMode = this.computedStyle.get('--reveal-press-animation-radius-mode');
+            const nextPressAnimationColor = parsedPressAnimationColor;
+            const nextPressAnimationSpeed = this.computedStyle.getNumber('--reveal-press-animation-speed');
+            const nextReleaseAnimationAccelerateRate = this.computedStyle.getNumber('--reveal-release-animation-accelerate-rate');
+            // Border decoration related configurations
+            const r = this.computedStyle.getNumber('--reveal-border-decoration-radius');
+            const tl = this.getNumberPropFromMultipleSource('topLeftBorderRadius', '--reveal-border-decoration-top-left-radius');
+            const tr = this.getNumberPropFromMultipleSource('topRightBorderRadius', '--reveal-border-decoration-top-right-radius');
+            const bl = this.getNumberPropFromMultipleSource('bottomLeftBorderRadius', '--reveal-border-decoration-bottom-left-radius');
+            const br = this.getNumberPropFromMultipleSource('bottomRightBorderRadius', '--reveal-border-decoration-bottom-right-radius');
+            const nextTopLeftBorderDecorationRadius = tl >= 0 ? tl : r;
+            const nextTopRightBorderDecorationRadius = tr >= 0 ? tr : r;
+            const nextBottomLeftBorderDecorationRadius = bl >= 0 ? bl : r;
+            const nextBottomRightBorderDecorationRadius = br >= 0 ? br : r;
+            const c = this.cachedStyle;
+            this.fillDirty = this.fillDirty || c.color !== nextColor;
+            this.fillDirty = this.fillDirty || c.opacity !== nextOpacity;
+            this.fillDirty = this.fillDirty || c.borderColor !== nextBorderColor;
+            this.fillDirty = this.fillDirty || c.borderFillRadius !== nextBorderFillRadius;
+            this.fillDirty = this.fillDirty || c.hoverLightColor !== nextHoverLightColor;
+            this.fillDirty = this.fillDirty || c.hoverLightFillRadius !== nextHoverLightFillRadius;
+            this.fillDirty = this.fillDirty || c.hoverLightFillMode !== nextHoverLightFillMode;
+            this.shapeDirty = this.shapeDirty || c.borderDecorationType !== nextBorderDecorationType;
+            this.shapeDirty = this.shapeDirty || c.borderWidth !== nextBorderWidth;
+            this.shapeDirty = this.shapeDirty || c.withLeftBorderFactor !== nextWithLeftBorderFactor;
+            this.shapeDirty = this.shapeDirty || c.withRightBorderFactor !== nextWithRightBorderFactor;
+            this.shapeDirty = this.shapeDirty || c.withTopBorderFactor !== nextWithTopBorderFactor;
+            this.shapeDirty = this.shapeDirty || c.withBottomBorderFactor !== nextWithBottomBorderFactor;
+            this.shapeDirty = this.shapeDirty || c.topLeftBorderDecorationRadius !== nextTopLeftBorderDecorationRadius;
+            this.shapeDirty = this.shapeDirty || c.topRightBorderDecorationRadius !== nextTopRightBorderDecorationRadius;
+            this.shapeDirty = this.shapeDirty || c.bottomLeftBorderDecorationRadius !== nextBottomLeftBorderDecorationRadius;
+            this.shapeDirty = this.shapeDirty || c.bottomRightBorderDecorationRadius !== nextBottomRightBorderDecorationRadius;
+            this.animationDirty = this.animationDirty || c.pressAnimation !== nextPressAnimation;
+            this.animationDirty = this.animationDirty || c.pressAnimationFillMode !== nextPressAnimationFillMode;
+            this.animationDirty = this.animationDirty || c.pressAnimationColor !== nextPressAnimationColor;
+            this.animationDirty = this.animationDirty || c.pressAnimationSpeed !== nextPressAnimationSpeed;
+            this.animationDirty = this.animationDirty || c.releaseAnimationAccelerateRate !== nextReleaseAnimationAccelerateRate;
+            c.color = nextColor;
+            c.opacity = nextOpacity;
+            c.borderColor = nextBorderColor;
+            c.borderFillRadius = nextBorderFillRadius;
+            c.borderDecorationType = nextBorderDecorationType;
+            c.borderWidth = nextBorderWidth;
+            c.withLeftBorderFactor = nextWithLeftBorderFactor;
+            c.withRightBorderFactor = nextWithRightBorderFactor;
+            c.withTopBorderFactor = nextWithTopBorderFactor;
+            c.withBottomBorderFactor = nextWithBottomBorderFactor;
+            c.hoverLight = nextHoverLight;
+            c.hoverLightColor = nextHoverLightColor;
+            c.hoverLightFillRadius = nextHoverLightFillRadius;
+            c.hoverLightFillMode = nextHoverLightFillMode;
+            c.diffuse = nextDiffuse;
+            c.pressAnimation = nextPressAnimation;
+            c.pressAnimationFillMode = nextPressAnimationFillMode;
+            c.pressAnimationColor = nextPressAnimationColor;
+            c.pressAnimationSpeed = nextPressAnimationSpeed;
+            c.releaseAnimationAccelerateRate = nextReleaseAnimationAccelerateRate;
+            c.topLeftBorderDecorationRadius = nextTopLeftBorderDecorationRadius;
+            c.topRightBorderDecorationRadius = nextTopRightBorderDecorationRadius;
+            c.bottomLeftBorderDecorationRadius = nextBottomLeftBorderDecorationRadius;
+            c.bottomRightBorderDecorationRadius = nextBottomRightBorderDecorationRadius;
+            this.getTrueFillRadius(c.trueFillRadius, c.hoverLightFillMode);
+            if (!isValidateBorderDecorationType(c.borderDecorationType)) {
+                throw new SyntaxError('The value of `--reveal-border-decoration-type` must be `round`, `bevel` or `miter`!');
+            }
+            this.cachedStyleFrameId = this.currentFrameId;
+        };
+        this.mouseInCanvas = () => {
+            const b = this.cachedBoundingRect;
+            const relativeX = this._store.clientX - b.left;
+            const relativeY = this._store.clientY - b.top;
+            return relativeX > 0 && relativeY > 0 && relativeX < b.width && relativeY < b.height;
+        };
+        this.syncSizeToRevealRadius = (x, factor) => {
+            const { trueFillRadius } = this.cachedStyle;
+            const radius = trueFillRadius[1] || 1;
+            const size = radius * 2 * this.pxRatio * factor;
+            if (x.width !== size || x.height !== size) {
+                x.width = size;
+                x.height = size;
+            }
+        };
+        this._store = store;
+        this.container = $container;
+        this.element = $canvas;
+        this.computedStyle = createStorage($container);
+    }
+}
+//# sourceMappingURL=BaseConfig.js.map

package/es/BaseConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseConfig.js","sourceRoot":"","sources":["../src/BaseConfig.ts"],"names":[],"mappings":"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"}

package/es/CanvasConfig.d.ts

@@ -1,101 +1,16 @@
 import { RevealBoundaryStore } from './RevealBoundryStore.js';
-declare type BorderDecoration = 'round' | 'bevel' | 'miter';
-export interface CachedBoundingRect {
-    top: number;
-    left: number;
-    width: number;
-    height: number;
-}
-export interface CachedStyle {
-    color: string;
-    opacity: number;
-    trueFillRadius: [number, number];
-    borderStyle: string;
-    borderColor: string;
-    borderFillRadius: number;
-    borderDecorationType: BorderDecoration;
-    borderDecorationRadius: number;
-    topLeftBorderDecorationRadius: number;
-    topRightBorderDecorationRadius: number;
-    bottomLeftBorderDecorationRadius: number;
-    bottomRightBorderDecorationRadius: number;
-    withLeftBorderFactor: number;
-    withRightBorderFactor: number;
-    withTopBorderFactor: number;
-    withBottomBorderFactor: number;
-    borderWidth: number;
-    hoverLight: boolean;
-    hoverLightColor: string;
-    hoverLightFillMode: string;
-    hoverLightFillRadius: number;
-    diffuse: boolean;
-    pressAnimation: boolean;
-    pressAnimationFillMode: string;
-    pressAnimationColor: string;
-    pressAnimationSpeed: number;
-    releaseAnimationAccelerateRate: number;
-}
-interface CachedReveal {
-    radius: number;
-    radiusFactor: number;
-    color: string;
-    opacity: number;
-    pattern: CanvasPattern | null;
-}
-/**
- * Cached border and body pattern, for faster painting on the canvas.
- * @interface CachedRevealBitmap
- */
-export interface CachedRevealBitmap {
-    cachedReveal: {
-        borderReveal: CachedReveal;
-        fillReveal: CachedReveal;
-    };
-    cachedCanvas: {
-        borderReveal: HTMLCanvasElement;
-        fillReveal: HTMLCanvasElement;
-    };
-    cachedCtx: {
-        borderReveal: CanvasRenderingContext2D | null;
-        fillReveal: CanvasRenderingContext2D | null;
-    };
-}
-export declare class CanvasConfig {
-    protected _store: RevealBoundaryStore;
-    pxRatio: number;
-    readonly container: HTMLElement;
-    readonly canvas: HTMLCanvasElement;
+import type { CachedRevealBitmap } from './utils/types.js';
+import { BaseConfig } from './BaseConfig.js';
+export declare class CanvasConfig extends BaseConfig<HTMLCanvasElement> {
     ctx: CanvasRenderingContext2D | null;
-    private readonly computedStyle;
-    paintedWidth: number;
-    paintedHeight: number;
     protected cachedImg: CachedRevealBitmap;
-    currentFrameId: number;
-    cachedBoundingRectFrameId: number;
-    cachedBoundingRect: CachedBoundingRect;
-    cachedStyleFrameId: number;
-    cachedStyle: CachedStyle;
-    mouseUpClientX: number | null;
-    mouseUpClientY: number | null;
-    mouseDownAnimateStartFrame: number | null;
-    mouseDownAnimateCurrentFrame: number | null;
-    mouseDownAnimateReleasedFrame: number | null;
-    mouseDownAnimateLogicFrame: number | null;
-    mousePressed: boolean;
-    mouseReleased: boolean;
     constructor(store: RevealBoundaryStore, $canvas: HTMLCanvasElement, $container: HTMLElement);
-    cacheBoundingRect: () => void;
-    getTrueFillRadius: (trueFillRadius?: [number, number], fillMode?: string) => [number, number];
-    getPropFromMultipleSource: (domPropsName: string, cssPropsName: string) => string;
-    cacheCanvasPaintingStyle: () => void;
     updateCachedReveal: () => void;
     updateCachedBitmap: () => void;
-    mouseInCanvas: () => boolean;
-    syncSizeToElement: (x: HTMLCanvasElement) => void;
-    syncSizeToRevealRadius: (x: HTMLCanvasElement, factor: number) => void;
-    updateAnimateGrd: (frame: number, grd: CanvasGradient) => void;
+    private updateAnimateGrd;
     private drawShape;
-    paint: (force?: boolean | undefined, debug?: boolean | undefined) => boolean;
+    syncSizeToElement: (x: HTMLCanvasElement) => void;
+    clear: () => boolean;
+    paint: (skipSamePointerPositionCheck?: boolean | undefined) => boolean;
 }
-export {};
 //# sourceMappingURL=CanvasConfig.d.ts.map

package/es/CanvasConfig.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CanvasConfig.d.ts","sourceRoot":"","sources":["../src/CanvasConfig.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"CanvasConfig.d.ts","sourceRoot":"","sources":["../src/CanvasConfig.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAE9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAE3D,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAI7C,qBAAa,YAAa,SAAQ,UAAU,CAAC,iBAAiB,CAAC;IAC3D,GAAG,EAAE,wBAAwB,GAAG,IAAI,CAAC;IAErC,SAAS,CAAC,SAAS,EAAE,kBAAkB,CAAC;gBAE5B,KAAK,EAAE,mBAAmB,EAAE,OAAO,EAAE,iBAAiB,EAAE,UAAU,EAAE,WAAW;IAqC3F,kBAAkB,aA0DhB;IAEF,kBAAkB,aAGhB;IAEF,OAAO,CAAC,gBAAgB,CAgBtB;IAEF,OAAO,CAAC,SAAS,CA8Hf;IAEF,iBAAiB,MAAO,iBAAiB,UASvC;IAEF,KAAK,gBAeJ;IAED,KAAK,0DAA6C,OAAO,CA4HvD;CACL"}