@learn-hunger/visual-gestures/dist/app/cursor/vg-cursor.js

VisualGestures.js is a package that empowers users to effortlessly control the cursor, including actions such as hover, click, drag, and drop, through precise finger movements in the air.

import { DefaultConfig } from "../config/defalut-config";
import { cursorStyle } from "../utilities/vg-constants";
/**
 * Hanldes UI of the cursor element and container element
 */
class CursorDom {
    constructor(container = document.body) {
        this.container = container;
        this.cursor = document.createElement("img");
        this.cursor.setAttribute("id", "vg-cursor-container");
        this.cursor.src = DefaultConfig.instance.cursor.default.path;
        this.createDom();
    }
    createDom() {
        this.cursor.style.cssText = cursorStyle.replace(/\n/g, "");
    }
}
/**
 * It contains all the properties of the cursor element
 */
export class CursorObject extends CursorDom {
    constructor(container = DefaultConfig.instance.cursorContainer) {
        super(container);
        /**
         * protected from the external classes or developer usage
         * It initalises the sizes of the cursor and container
         * gets updated with resizing screens by resize event
         * @returns
         */
        this.initialiseSizes = () => {
            this.sizes = {
                container: {
                    clientWidth: this.container.clientWidth,
                    clientHeight: this.container.clientHeight,
                },
                cursor: {
                    clientWidth: this.cursor.clientWidth,
                    clientHeight: this.cursor.clientHeight,
                },
            };
            return this.sizes;
        };
        //TODO dynamically set the cursor from the parameters send from main class
        const cursor = DefaultConfig.instance.cursor;
        this._cursorPath = cursor.default.path;
        this._cursorScale = cursor.default.scale;
        this._showCursor = cursor.showCursor;
        this.toggleCursor();
        this.sizes = this.initialiseSizes();
        //removal is being handled AvgCommon class
        window.addEventListener("resize", this.initialiseSizes);
    }
    //setter to toggle visibility of cursor
    set showCursor(check) {
        this._showCursor = check;
        this.toggleCursor();
    }
    // set cursorPath(path: string) {
    //   this._cursorPath = path;
    //   this.cursor.src = path;
    // }
    // set cursorScale(scale: number) {
    //   this._cursorScale = scale;
    //   this.cursor.style.scale = scale.toString();
    // }
    /**
     * based on the _showCursor property change
     * the visibility of the cursor
     * @type {*}
     */
    toggleCursor() {
        // toggleCursor
        this._showCursor
            ? this.container.appendChild(this.cursor)
            : this.cursor.remove();
    }
}
//# sourceMappingURL=vg-cursor.js.map