viral-viewer-2 6.2.6 → 6.2.8

package/dist/const/colors.d.ts

@@ -0,0 +1,14 @@
+export declare const LightTheme: {
+    background: string;
+    primary: string;
+    secondary: string;
+    accent: string;
+    accent2: string;
+    hover: string;
+};
+export declare const DarkTheme: {
+    background: string;
+    primary: string;
+    secondary: string;
+    accent: string;
+};

package/dist/const/colors.js

@@ -0,0 +1,39 @@
+"use strict";
+// export const Colors = {
+//     primary: '#56674d',
+//     primaryNormal: '#86957d',
+//     primaryLight: '#e2e6dc',
+//     onHover: 'rgba(134,149,125,0.3)',
+//     lightNeutral:'#e2e6dc',
+// }
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DarkTheme = exports.LightTheme = void 0;
+const LightTheme1 = {
+    background: "#e2e6dc",
+    primary: "#2F4858",
+    secondary: "#6099A8",
+    accent: "#63A11B", //10
+};
+const DarkTheme1 = {
+    background: "#2F4858",
+    primary: "#e2e6dc",
+    secondary: "#63A11B",
+    accent: "#6099A8",
+};
+const LightTheme2 = {
+    background: "#e2e6dc",
+    primary: "#17312c",
+    secondary: "#56b77e",
+    accent: "#f2735b",
+    accent2: "#D7EF41",
+    hover: "rgba(134, 149 ,125, 0.3)"
+};
+const DarkTheme2 = {
+    background: "#17312c",
+    primary: "#fbfbfb",
+    secondary: "#56b77e",
+    accent: "#f2735b",
+};
+exports.LightTheme = LightTheme2;
+exports.DarkTheme = DarkTheme2;
+//# sourceMappingURL=colors.js.map

package/dist/const/colors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"colors.js","sourceRoot":"","sources":["../../src/const/colors.ts"],"names":[],"mappings":";AAAA,0BAA0B;AAC1B,0BAA0B;AAC1B,gCAAgC;AAChC,+BAA+B;AAC/B,wCAAwC;AACxC,8BAA8B;AAC9B,IAAI;;;AAEJ,MAAM,WAAW,GAAG;IAClB,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,SAAS;IAClB,SAAS,EAAE,SAAS;IACpB,MAAM,EAAE,SAAS,EAAE,IAAI;CACxB,CAAC;AAEF,MAAM,UAAU,GAAG;IACjB,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,SAAS;IAClB,SAAS,EAAE,SAAS;IACpB,MAAM,EAAE,SAAS;CAClB,CAAC;AAEF,MAAM,WAAW,GAAG;IAClB,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,SAAS;IAClB,SAAS,EAAE,SAAS;IACpB,MAAM,EAAE,SAAS;IACjB,OAAO,EAAE,SAAS;IAClB,KAAK,EAAC,0BAA0B;CACjC,CAAC;AAEF,MAAM,UAAU,GAAG;IACjB,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,SAAS;IAClB,SAAS,EAAE,SAAS;IACpB,MAAM,EAAE,SAAS;CAClB,CAAC;AAEW,QAAA,UAAU,GAAG,WAAW,CAAC;AACzB,QAAA,SAAS,GAAG,UAAU,CAAC"}

package/dist/const/fonts.d.ts

@@ -0,0 +1,7 @@
+export declare class FontIndentity {
+    importLink: string;
+    fontFamily: string;
+}
+export declare const fonts: {
+    [key: string]: FontIndentity;
+};

package/dist/const/fonts.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fonts = exports.FontIndentity = void 0;
+class FontIndentity {
+    constructor() {
+        this.importLink = "";
+        this.fontFamily = "";
+    }
+}
+exports.FontIndentity = FontIndentity;
+exports.fonts = {
+    QUICK_SAND: {
+        importLink: "https://fonts.googleapis.com/css2?family=Quicksand:wght@300&display=swap",
+        fontFamily: `Quicksand, sans-serif`,
+    },
+};
+//# sourceMappingURL=fonts.js.map

package/dist/const/fonts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fonts.js","sourceRoot":"","sources":["../../src/const/fonts.ts"],"names":[],"mappings":";;;AACA,MAAa,aAAa;IAA1B;QACE,eAAU,GAAW,EAAE,CAAC;QACxB,eAAU,GAAW,EAAE,CAAC;IAC1B,CAAC;CAAA;AAHD,sCAGC;AACY,QAAA,KAAK,GAAqC;IACrD,UAAU,EAAE;QACV,UAAU,EACR,0EAA0E;QAC5E,UAAU,EAAE,uBAAuB;KACpC;CACF,CAAC"}

package/dist/const/icons.d.ts

@@ -0,0 +1,7 @@
+export declare const Icons: {
+    showAll: (size?: number, color?: string) => string;
+    isolate: (size?: number, color?: string) => string;
+    hide: (size?: number, color?: string) => string;
+    focus: (size?: number, color?: string) => string;
+    properties: (size?: number, color?: string) => string;
+};

package/dist/const/icons.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Icons = void 0;
+exports.Icons = {
+    showAll: (size, color) => `<svg xmlns="http://www.w3.org/2000/svg" fill=${color ? color : ''} height=${size ? size : 24} viewBox="0 -960 960 960" width="24"><path d="M240-160q-33 0-56.5-23.5T160-240q0-33 23.5-56.5T240-320q33 0 56.5 23.5T320-240q0 33-23.5 56.5T240-160Zm240 0q-33 0-56.5-23.5T400-240q0-33 23.5-56.5T480-320q33 0 56.5 23.5T560-240q0 33-23.5 56.5T480-160Zm240 0q-33 0-56.5-23.5T640-240q0-33 23.5-56.5T720-320q33 0 56.5 23.5T800-240q0 33-23.5 56.5T720-160ZM240-400q-33 0-56.5-23.5T160-480q0-33 23.5-56.5T240-560q33 0 56.5 23.5T320-480q0 33-23.5 56.5T240-400Zm240 0q-33 0-56.5-23.5T400-480q0-33 23.5-56.5T480-560q33 0 56.5 23.5T560-480q0 33-23.5 56.5T480-400Zm240 0q-33 0-56.5-23.5T640-480q0-33 23.5-56.5T720-560q33 0 56.5 23.5T800-480q0 33-23.5 56.5T720-400ZM240-640q-33 0-56.5-23.5T160-720q0-33 23.5-56.5T240-800q33 0 56.5 23.5T320-720q0 33-23.5 56.5T240-640Zm240 0q-33 0-56.5-23.5T400-720q0-33 23.5-56.5T480-800q33 0 56.5 23.5T560-720q0 33-23.5 56.5T480-640Zm240 0q-33 0-56.5-23.5T640-720q0-33 23.5-56.5T720-800q33 0 56.5 23.5T800-720q0 33-23.5 56.5T720-640Z"/></svg>`,
+    isolate: (size, color) => `<svg xmlns="http://www.w3.org/2000/svg" fill=${color ? color : ''} height=${size ? size : 24} viewBox="0 -960 960 960" width="24"><path d="M440-760v-80h80v80h-80Zm0 640v-80h80v80h-80ZM280-760v-80h80v80h-80Zm0 640v-80h80v80h-80ZM120-760v-80h80v80h-80Zm0 160v-80h80v80h-80Zm0 160v-80h80v80h-80Zm0 160v-80h80v80h-80Zm0 160v-80h80v80h-80Zm480 0v-80h80v-560h-80v-80h240v80h-80v560h80v80H600Z"/></svg>`,
+    hide: (size, color) => `<svg xmlns="http://www.w3.org/2000/svg" fill=${color ? color : ''} height=${size ? size : 24} viewBox="0 -960 960 960" width="24"><path d="M200-120q-33 0-56.5-23.5T120-200h80v80Zm-80-160v-80h80v80h-80Zm0-160v-80h80v80h-80Zm0-160v-80h80v80h-80Zm0-160q0-33 23.5-56.5T200-840v80h-80Zm160 640v-80h80v80h-80Zm0-640v-80h80v80h-80Zm160 0v-80h80v80h-80Zm60 640-56-56 142-142-142-142 56-56 142 142 142-142 56 56-142 142 142 142-56 56-142-142-142 142Zm100-640v-80h80v80h-80Zm160 160v-80h80v80h-80Zm0-160v-80q33 0 56.5 23.5T840-760h-80Z"/></svg>`,
+    focus: (size, color) => `<svg xmlns="http://www.w3.org/2000/svg" fill=${color ? color : ''} height=${size ? size : 24} viewBox="0 -960 960 960" width="24"><path d="M120-120v-200h80v120h120v80H120Zm520 0v-80h120v-120h80v200H640ZM120-640v-200h200v80H200v120h-80Zm640 0v-120H640v-80h200v200h-80Z"/></svg>`,
+    properties: (size, color) => `<svg xmlns="http://www.w3.org/2000/svg" fill=${color ? color : ''} height=${size ? size : 24} viewBox="0 -960 960 960" width="24"><path d="M440-280h80v-240h-80v240Zm40-320q17 0 28.5-11.5T520-640q0-17-11.5-28.5T480-680q-17 0-28.5 11.5T440-640q0 17 11.5 28.5T480-600Zm0 520q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z"/></svg>`,
+};
+//# sourceMappingURL=icons.js.map

package/dist/const/icons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icons.js","sourceRoot":"","sources":["../../src/const/icons.ts"],"names":[],"mappings":";;;AAAa,QAAA,KAAK,GAAG;IACnB,OAAO,EAAE,CAAC,IAAY,EAAC,KAAa,EAAC,EAAE,CAAC,gDAAgD,KAAK,CAAA,CAAC,CAAC,KAAK,CAAA,CAAC,CAAA,EAAE,WAAW,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,CAAC,CAAA,EAAE,m8BAAm8B;IACnkC,OAAO,EAAE,CAAC,IAAY,EAAC,KAAa,EAAC,EAAE,CAAC,gDAAgD,KAAK,CAAA,CAAC,CAAC,KAAK,CAAA,CAAC,CAAA,EAAE,WAAW,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,CAAC,CAAA,EAAE,gTAAgT;IAChb,IAAI,EAAE,CAAC,IAAY,EAAC,KAAa,EAAC,EAAE,CAAC,gDAAgD,KAAK,CAAA,CAAC,CAAC,KAAK,CAAA,CAAC,CAAA,EAAE,WAAW,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,CAAC,CAAA,EAAE,2bAA2b;IACxjB,KAAK,EAAE,CAAC,IAAY,EAAC,KAAa,EAAC,EAAE,CAAC,gDAAgD,KAAK,CAAA,CAAC,CAAC,KAAK,CAAA,CAAC,CAAA,EAAE,WAAW,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,CAAC,CAAA,EAAE,yLAAyL;IACvT,UAAU,EAAE,CAAC,IAAY,EAAC,KAAa,EAAC,EAAE,CAAC,gDAAgD,KAAK,CAAA,CAAC,CAAC,KAAK,CAAA,CAAC,CAAA,EAAE,WAAW,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,CAAC,CAAA,EAAE,mdAAmd;CACvlB,CAAC"}

package/dist/gui/context-menu/viral-context-menu.d.ts

@@ -0,0 +1,17 @@
+import { ViralViewerApi } from "../../viral-viewer-api";
+export declare class ViralContextMenu {
+    viralViewerApi: ViralViewerApi;
+    private contextMenu;
+    private contextItems;
+    constructor(viralViewerApi: ViralViewerApi);
+    private injectContextMenu;
+    showContextMenu(top: number, left: number, itemKeys: number[]): void;
+    hideContextMenu(): void;
+    private initContent;
+    /**
+     *
+     * @param itemName
+     * @param resolve callback when user click
+     */
+    addContextItem(itemKey: number, itemName: string, itemIcon: string, resolve: (result: any) => void): void;
+}

package/dist/gui/context-menu/viral-context-menu.js

@@ -0,0 +1,78 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViralContextMenu = void 0;
+const colors_1 = require("../../const/colors");
+const html_1 = require("../../utils/html");
+class ViralContextMenu {
+    constructor(viralViewerApi) {
+        this.viralViewerApi = viralViewerApi;
+        this.contextMenu = null;
+        this.contextItems = [];
+        this.injectContextMenu();
+    }
+    injectContextMenu() {
+        const hoverEffect = `
+        .hover-element {
+            transition: background-color 0.3s ease;
+        }
+        .hover-element:hover {
+            background-color: ${colors_1.LightTheme.hover};
+
+        }`;
+        // Create a style element and append the keyframes animation
+        const style = document.createElement("style");
+        style.innerHTML = hoverEffect;
+        // Append the style element to the document head
+        document.head.appendChild(style);
+        if (this.viralViewerApi.targetElement) {
+            this.contextMenu = document.createElement("div");
+            //disable context menu
+            this.contextMenu.addEventListener("contextmenu", function (event) {
+                event.preventDefault(); // Prevent the default context menu
+            });
+            this.contextMenu.setAttribute("style", `position: absolute;top:0px;left:0px;background-color: ${colors_1.LightTheme.background};justify-content: center;display:none; z-index: 100; flex-direction:column; padding: 10px 0; border-radius:10px`);
+            this.viralViewerApi.targetElement.appendChild(this.contextMenu);
+        }
+    }
+    showContextMenu(top, left, itemKeys) {
+        if (this.contextMenu) {
+            this.initContent(itemKeys);
+            this.contextMenu.style.setProperty("display", "flex");
+            this.contextMenu.style.setProperty("top", `${top}px`);
+            this.contextMenu.style.setProperty("left", `${left}px`);
+        }
+    }
+    hideContextMenu() {
+        if (this.contextMenu) {
+            this.contextMenu.style.setProperty("display", "none");
+        }
+    }
+    initContent(itemKeys) {
+        var _a;
+        while (this.contextMenu && this.contextMenu.firstChild) {
+            this.contextMenu.removeChild(this.contextMenu.firstChild);
+        }
+        for (let index = 0; index < this.contextItems.length; index++) {
+            if (itemKeys.findIndex((x) => x == this.contextItems[index][0]) < 0) {
+                continue;
+            }
+            const [itemKey, itemName, itemicon, callbackResolve] = this.contextItems[index];
+            const item = html_1.HTMLUtil.createElementFromHTML(`<div class="hover-element" style="padding: 5px 10px; cursor: pointer; color:${colors_1.LightTheme.primary}; display:flex; align-items:center">${itemicon} <p style="margin:0px !important;padding-left:5px">${itemName}</p></div>`);
+            item.addEventListener("click", (ev) => {
+                ev.stopPropagation();
+                callbackResolve(ev);
+            });
+            (_a = this.contextMenu) === null || _a === void 0 ? void 0 : _a.appendChild(item);
+        }
+    }
+    /**
+     *
+     * @param itemName
+     * @param resolve callback when user click
+     */
+    addContextItem(itemKey, itemName, itemIcon, resolve) {
+        this.contextItems.push([itemKey, itemName, itemIcon, resolve]);
+    }
+}
+exports.ViralContextMenu = ViralContextMenu;
+//# sourceMappingURL=viral-context-menu.js.map

package/dist/gui/context-menu/viral-context-menu.js.map

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

package/dist/gui/draggable-modal/viral-draggable-modal.d.ts

@@ -0,0 +1,21 @@
+import { ViralViewerApi } from "../../viral-viewer-api";
+export declare class ViralDraggableModal {
+    viralViewerApi: ViralViewerApi;
+    private modal;
+    private modalTitle;
+    private modalBody;
+    private modalBodyLeft;
+    private modalBodyRight;
+    properties: any;
+    private rawModal;
+    private rawModalStyle;
+    isDragging: boolean;
+    offsetX: number;
+    offsetY: number;
+    constructor(viralViewerApi: ViralViewerApi);
+    inject(): void;
+    show(): void;
+    hide(): void;
+    updatePosition(clientX: number, clientY: number): void;
+    updateModalContent(uniqueId: number): void;
+}

package/dist/gui/draggable-modal/viral-draggable-modal.js

@@ -0,0 +1,167 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViralDraggableModal = void 0;
+const __1 = require("../..");
+const colors_1 = require("../../const/colors");
+class ViralDraggableModal {
+    constructor(viralViewerApi) {
+        this.viralViewerApi = viralViewerApi;
+        this.modal = null;
+        this.modalTitle = null;
+        this.modalBody = null;
+        this.modalBodyLeft = null;
+        this.modalBodyRight = null;
+        this.properties = {};
+        this.rawModal = `<div class="modal" id="myModal">
+    <div class="modal-content">
+        <div id="modal-header" style="
+      cursor: pointer;
+      border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+      padding-bottom: 5px;
+    ">
+            <span class="close" id="closeBtn">&times;</span>
+            <h2 style="margin: 0px !important;color:${colors_1.LightTheme.secondary}" id="modal-title">
+            </h2>
+        </div>
+        <div id="modal-body" style="max-height:80vh;overflow:auto;display:flex">
+          <div id="modal-body-left" style="flex:1;"></div>
+          <div id="modal-body-right" style="margin-left:10px"></div>
+        </div>
+    </div>
+</div>`;
+        this.rawModalStyle = `.modal {
+        display: none;
+        position: fixed;
+        z-index: 1;
+    }
+    
+    .modal-content {
+        background-color: ${colors_1.LightTheme.background};
+        border: 1px solid #ccc;
+        border-radius: 5px;
+        padding: 10px;
+    }
+    
+    .close {
+        float: right;
+        font-size: 20px;
+        cursor: pointer;
+    }
+    
+    .close:hover {
+        color: ${colors_1.LightTheme.accent};
+    }
+    ::-webkit-scrollbar {
+      width: 5px;
+      height: 5px
+  }
+  
+  
+  /* Track */
+  
+  ::-webkit-scrollbar-track {
+      background: transparent;
+  }
+  
+  
+  /* Handle */
+  
+  ::-webkit-scrollbar-thumb {
+      // background: #80d6da;
+      background: rgba(255, 255, 255, 0.5)
+  }
+  
+  
+  /* Handle on hover */
+  
+  ::-webkit-scrollbar-thumb:hover {
+      background: rgba(0, 0, 0, 0.5);
+  }
+    `;
+        this.isDragging = false;
+        this.offsetX = 0;
+        this.offsetY = 0;
+        this.inject();
+    }
+    inject() {
+        if (this.viralViewerApi.targetElement) {
+            // Create a style element and append the keyframes animation
+            const style = document.createElement("style");
+            style.innerHTML = this.rawModalStyle;
+            // Append the style element to the document head
+            document.head.appendChild(style);
+            this.modal = __1.HTMLUtil.createElementFromHTML(this.rawModal);
+            this.viralViewerApi.targetElement.appendChild(this.modal);
+            // Get the modal and the close button
+            const modalHeader = document.getElementById("modal-header");
+            this.modalTitle = document.getElementById("modal-title");
+            this.modalBody = document.getElementById("modal-body");
+            this.modalBodyLeft = document.getElementById("modal-body-left");
+            this.modalBodyRight = document.getElementById("modal-body-right");
+            const closeBtn = document.getElementById("closeBtn");
+            // Event listener to start dragging
+            modalHeader.addEventListener("mousedown", (e) => {
+                this.isDragging = true;
+                this.offsetX = e.clientX - this.modal.getBoundingClientRect().left;
+                this.offsetY = e.clientY - this.modal.getBoundingClientRect().top;
+                this.modal.style.zIndex = "2";
+            });
+            // Event listener for mousemove while dragging
+            this.viralViewerApi.targetElement.addEventListener("mousemove", (e) => {
+                if (this.isDragging) {
+                    this.modal.style.left = e.clientX - this.offsetX + "px";
+                    this.modal.style.top = e.clientY - this.offsetY + "px";
+                }
+            });
+            // Event listener to stop dragging
+            this.modal.addEventListener("mouseup", () => {
+                this.isDragging = false;
+                this.modal.style.zIndex = "1";
+            });
+            // Close the modal when the close button is clicked
+            closeBtn.addEventListener("click", () => {
+                this.modal.style.display = "none";
+            });
+        }
+    }
+    show() {
+        if (this.modal) {
+            this.modal.style.display = "block";
+        }
+    }
+    hide() {
+        if (this.modal) {
+            this.modal.style.display = "none";
+        }
+    }
+    updatePosition(clientX, clientY) {
+        if (this.isDragging) {
+            this.modal.style.left = clientX - this.offsetX + "px";
+            this.modal.style.top = clientY - this.offsetY + "px";
+        }
+    }
+    updateModalContent(uniqueId) {
+        var _a;
+        if (uniqueId) {
+            this.properties =
+                (_a = this.viralViewerApi) === null || _a === void 0 ? void 0 : _a.viralDataManager.elementData[uniqueId];
+            if (this.modalTitle) {
+                this.modalTitle.innerHTML = `${uniqueId}`;
+            }
+            if (this.modalBody &&
+                this.modalBodyLeft &&
+                this.modalBodyRight &&
+                this.properties) {
+                this.modalBodyLeft.innerHTML = ``;
+                this.modalBodyRight.innerHTML = ``;
+                for (var prop in this.properties) {
+                    let property = this.properties[prop];
+                    this.modalBodyLeft.innerHTML += `<p style="margin:0px !important;color:${colors_1.LightTheme.primary};font-weight:600;height:16px;font-size:14px">${property.name}</p>`;
+                    this.modalBodyRight.innerHTML += `<p style="margin:0px !important;color:${colors_1.LightTheme.primary};height:16px;font-size:14px">${property.value}</p>`;
+                }
+            }
+        }
+    }
+}
+exports.ViralDraggableModal = ViralDraggableModal;
+//# sourceMappingURL=viral-draggable-modal.js.map

package/dist/gui/draggable-modal/viral-draggable-modal.js.map

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

package/dist/gui/fonts/fonts.d.ts

@@ -0,0 +1,2 @@
+export declare const injectFonts: (fontKey: string) => void;
+export declare const applyFonts: (element: HTMLElement, fontKey: string) => void;

package/dist/gui/fonts/fonts.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.applyFonts = exports.injectFonts = void 0;
+const fonts_1 = require("../../const/fonts");
+const injectFonts = (fontKey) => {
+    // Create a style element and append the keyframes animation
+    const style = document.createElement("style");
+    style.innerHTML = `@import url(${fonts_1.fonts[fontKey]});`;
+    // Append the style element to the document head
+    document.head.appendChild(style);
+};
+exports.injectFonts = injectFonts;
+const applyFonts = (element, fontKey) => {
+    let fontIndentity = fonts_1.fonts[fontKey];
+    if (element && fontIndentity) {
+        element.style.fontFamily = fontIndentity.fontFamily;
+    }
+};
+exports.applyFonts = applyFonts;
+//# sourceMappingURL=fonts.js.map

package/dist/gui/fonts/fonts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fonts.js","sourceRoot":"","sources":["../../../src/gui/fonts/fonts.ts"],"names":[],"mappings":";;;AAAA,6CAA0C;AAEnC,MAAM,WAAW,GAAG,CAAC,OAAc,EAAE,EAAE;IAC5C,4DAA4D;IAC5D,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAC9C,KAAK,CAAC,SAAS,GAAG,eAAe,aAAK,CAAC,OAAO,CAAC,IAAI,CAAC;IACpD,gDAAgD;IAChD,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AACnC,CAAC,CAAC;AANW,QAAA,WAAW,eAMtB;AAEK,MAAM,UAAU,GAAG,CAAC,OAAoB,EAAE,OAAe,EAAE,EAAE;IAChE,IAAI,aAAa,GAAG,aAAK,CAAC,OAAO,CAAC,CAAA;IAClC,IAAG,OAAO,IAAI,aAAa,EAC3B;QACI,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,aAAa,CAAC,UAAU,CAAC;KACvD;AACL,CAAC,CAAC;AANW,QAAA,UAAU,cAMrB"}

package/dist/gui/navigation-cube/components/cube-camera.d.ts

@@ -0,0 +1,15 @@
+import CameraControls from "camera-controls";
+import { Vector3, PerspectiveCamera } from 'three';
+import { ViralNavigationCube } from "../viral-navigation-cube";
+export declare class CubeCamera {
+    viralNavigationCube: ViralNavigationCube;
+    camera: PerspectiveCamera | null;
+    cameraControls: CameraControls | null;
+    cameraControlOldPosition: Vector3;
+    cameraControlNewPosition: Vector3;
+    cameraControlHasMoved: boolean;
+    constructor(viralNavigationCube: ViralNavigationCube);
+    setupCamera(): void;
+    updateCubeCamera(): void;
+    setupHandle(): void;
+}

package/dist/gui/navigation-cube/components/cube-camera.js

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CubeCamera = void 0;
+const camera_controls_1 = require("camera-controls");
+const three_1 = require("three");
+const subsetOfTHREE = {
+    Vector2: three_1.Vector2,
+    Vector3: three_1.Vector3,
+    Vector4: three_1.Vector4,
+    Quaternion: three_1.Quaternion,
+    Matrix4: three_1.Matrix4,
+    Spherical: three_1.Spherical,
+    Box3: three_1.Box3,
+    Sphere: three_1.Sphere,
+    Raycaster: three_1.Raycaster,
+    MathUtils: three_1.MathUtils,
+};
+class CubeCamera {
+    constructor(viralNavigationCube) {
+        this.viralNavigationCube = viralNavigationCube;
+        this.camera = null;
+        this.cameraControls = null;
+        this.cameraControlOldPosition = new three_1.Vector3();
+        this.cameraControlNewPosition = new three_1.Vector3();
+        this.cameraControlHasMoved = false;
+        this.setupCamera();
+        this.setupHandle();
+    }
+    setupCamera() {
+        if (this.viralNavigationCube.targetElement && this.viralNavigationCube.cubeRenderer) {
+            const width = this.viralNavigationCube.targetElement.offsetWidth;
+            const height = this.viralNavigationCube.targetElement.offsetHeight;
+            this.camera = new three_1.PerspectiveCamera(60, width / height, 0.01, 100);
+            this.camera.position.set(0, 0, 2);
+            camera_controls_1.default.install({ THREE: subsetOfTHREE });
+            this.cameraControls = new camera_controls_1.default(this.camera, this.viralNavigationCube.cubeRenderer.renderer.domElement);
+            this.cameraControls.dollyToCursor = false;
+            this.cameraControls.infinityDolly = false;
+            this.cameraControls.setTarget(0, 0, 0);
+            this.cameraControls.polarRotateSpeed = 0.15;
+            this.cameraControls.azimuthRotateSpeed = 0.15;
+            this.cameraControls.mouseButtons.middle = camera_controls_1.default.ACTION.NONE;
+            this.cameraControls.mouseButtons.wheel = camera_controls_1.default.ACTION.NONE;
+        }
+    }
+    updateCubeCamera() {
+        var _a;
+        let cameraControlTarget = new three_1.Vector3();
+        this.viralNavigationCube.viralViewerApi.viralCamera.cameraControls.getTarget(cameraControlTarget);
+        let cameraControlPosition = new three_1.Vector3();
+        this.viralNavigationCube.viralViewerApi.viralCamera.cameraControls.getPosition(cameraControlPosition);
+        //Hieu 2 vector
+        let vector = cameraControlPosition.sub(cameraControlTarget);
+        //Chuan hoa
+        vector.normalize();
+        //Do lon vector bang 2
+        vector.multiplyScalar(2);
+        (_a = this.cameraControls) === null || _a === void 0 ? void 0 : _a.setPosition(vector.x, vector.y, vector.z);
+    }
+    setupHandle() {
+        function antiMoveOnDown(e) {
+            this.cameraControlHasMoved = false;
+        }
+        function antiMoveOnMove(e) {
+            this.cameraControlHasMoved = true;
+        }
+        window.addEventListener('mousedown', antiMoveOnDown, false);
+        window.addEventListener('mousemove', antiMoveOnMove, false);
+        window.addEventListener('touchstart', antiMoveOnDown, false);
+        window.addEventListener('touchmove', antiMoveOnMove, true);
+    }
+}
+exports.CubeCamera = CubeCamera;
+//# sourceMappingURL=cube-camera.js.map

package/dist/gui/navigation-cube/components/cube-camera.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cube-camera.js","sourceRoot":"","sources":["../../../../src/gui/navigation-cube/components/cube-camera.ts"],"names":[],"mappings":";;;AAAA,qDAA6C;AAC7C,iCAae;AAEf,MAAM,aAAa,GAAG;IAClB,OAAO,EAAE,eAAO;IAChB,OAAO,EAAE,eAAO;IAChB,OAAO,EAAE,eAAO;IAChB,UAAU,EAAE,kBAAU;IACtB,OAAO,EAAE,eAAO;IAChB,SAAS,EAAE,iBAAS;IACpB,IAAI,EAAE,YAAI;IACV,MAAM,EAAE,cAAM;IACd,SAAS,EAAE,iBAAS;IACpB,SAAS,EAAE,iBAAS;CACvB,CAAC;AAEF,MAAa,UAAU;IAMnB,YAAmB,mBAAwC;QAAxC,wBAAmB,GAAnB,mBAAmB,CAAqB;QAL3D,WAAM,GAA6B,IAAI,CAAC;QACxC,mBAAc,GAA0B,IAAI,CAAC;QAC7C,6BAAwB,GAAY,IAAI,eAAO,EAAE,CAAC;QAClD,6BAAwB,GAAY,IAAI,eAAO,EAAE,CAAC;QAClD,0BAAqB,GAAG,KAAK,CAAC;QAE1B,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,CAAC,WAAW,EAAE,CAAC;IAEvB,CAAC;IACM,WAAW;QACd,IAAI,IAAI,CAAC,mBAAmB,CAAC,aAAa,IAAI,IAAI,CAAC,mBAAmB,CAAC,YAAY,EAAE;YACjF,MAAM,KAAK,GAAG,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,WAAW,CAAC;YACjE,MAAM,MAAM,GAAG,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,YAAY,CAAC;YACnE,IAAI,CAAC,MAAM,GAAG,IAAI,yBAAiB,CAAC,EAAE,EAAE,KAAK,GAAG,MAAM,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC;YACnE,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;YAClC,yBAAc,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC,CAAC;YACjD,IAAI,CAAC,cAAc,GAAG,IAAI,yBAAc,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;YACjH,IAAI,CAAC,cAAc,CAAC,aAAa,GAAG,KAAK,CAAC;YAC1C,IAAI,CAAC,cAAc,CAAC,aAAa,GAAG,KAAK,CAAC;YAC1C,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;YACvC,IAAI,CAAC,cAAc,CAAC,gBAAgB,GAAG,IAAI,CAAC;YAC5C,IAAI,CAAC,cAAc,CAAC,kBAAkB,GAAG,IAAI,CAAC;YAC9C,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,MAAM,GAAG,yBAAc,CAAC,MAAM,CAAC,IAAI,CAAC;YACrE,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,KAAK,GAAG,yBAAc,CAAC,MAAM,CAAC,IAAI,CAAC;SACvE;IAEL,CAAC;IACM,gBAAgB;;QACnB,IAAI,mBAAmB,GAAG,IAAI,eAAO,EAAE,CAAC;QACxC,IAAI,CAAC,mBAAmB,CAAC,cAAe,CAAC,WAAY,CAAC,cAAe,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAA;QACpG,IAAI,qBAAqB,GAAG,IAAI,eAAO,EAAE,CAAC;QAC1C,IAAI,CAAC,mBAAmB,CAAC,cAAe,CAAC,WAAY,CAAC,cAAe,CAAC,WAAW,CAAC,qBAAqB,CAAC,CAAA;QACxG,eAAe;QACf,IAAI,MAAM,GAAG,qBAAqB,CAAC,GAAG,CAAC,mBAAmB,CAAC,CAAC;QAC5D,WAAW;QACX,MAAM,CAAC,SAAS,EAAE,CAAC;QACnB,sBAAsB;QACtB,MAAM,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;QACzB,MAAA,IAAI,CAAC,cAAc,0CAAE,WAAW,CAAC,MAAM,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC;IACnE,CAAC;IACM,WAAW;QACd,SAAS,cAAc,CAAC,CAAa;YACjC,IAAI,CAAC,qBAAqB,GAAG,KAAK,CAAC;QACvC,CAAC;QACD,SAAS,cAAc,CAAC,CAAa;YACjC,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC;QAEtC,CAAC;QAED,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,cAAc,EAAE,KAAK,CAAC,CAAC;QAC5D,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,cAAc,EAAE,KAAK,CAAC,CAAC;QAC5D,MAAM,CAAC,gBAAgB,CAAC,YAAY,EAAE,cAAc,EAAE,KAAK,CAAC,CAAC;QAC7D,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,cAAc,EAAE,IAAI,CAAC,CAAC;IAC/D,CAAC;CAEJ;AAzDD,gCAyDC"}

package/dist/gui/navigation-cube/components/cube-renderer.d.ts

@@ -0,0 +1,9 @@
+import { WebGLRenderer } from "three";
+import { ViralNavigationCube } from "../viral-navigation-cube";
+export declare class CubeRenderer {
+    viralNavigationCube: ViralNavigationCube;
+    renderer: WebGLRenderer;
+    constructor(viralNavigationCube: ViralNavigationCube);
+    setupRenderer(): void;
+    render(): void;
+}

package/dist/gui/navigation-cube/components/cube-renderer.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CubeRenderer = void 0;
+const three_1 = require("three");
+class CubeRenderer {
+    constructor(viralNavigationCube) {
+        this.viralNavigationCube = viralNavigationCube;
+        // clock: Clock = new Clock();
+        this.renderer = new three_1.WebGLRenderer({
+            alpha: true,
+            antialias: true,
+            logarithmicDepthBuffer: true,
+        });
+        this.setupRenderer();
+    }
+    setupRenderer() {
+        if (this.viralNavigationCube.targetElement) {
+            this.renderer.setClearColor(0x000000, 0);
+            this.renderer.setSize(this.viralNavigationCube.targetElement.offsetWidth, this.viralNavigationCube.targetElement.offsetHeight);
+            this.viralNavigationCube.targetElement.appendChild(this.renderer.domElement);
+        }
+    }
+    render() {
+        if (this.viralNavigationCube.cubeScene && this.viralNavigationCube.cubeCamera && this.viralNavigationCube.cubeCamera.camera) {
+            this.viralNavigationCube.cubeCamera.camera.updateMatrixWorld(true);
+            this.renderer.render(this.viralNavigationCube.cubeScene.scene, this.viralNavigationCube.cubeCamera.camera);
+        }
+    }
+}
+exports.CubeRenderer = CubeRenderer;
+//# sourceMappingURL=cube-renderer.js.map

package/dist/gui/navigation-cube/components/cube-renderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cube-renderer.js","sourceRoot":"","sources":["../../../../src/gui/navigation-cube/components/cube-renderer.ts"],"names":[],"mappings":";;;AAAA,iCAA6C;AAG7C,MAAa,YAAY;IAOrB,YAAmB,mBAAwC;QAAxC,wBAAmB,GAAnB,mBAAmB,CAAqB;QAN3D,8BAA8B;QAC9B,aAAQ,GAAkB,IAAI,qBAAa,CAAC;YACxC,KAAK,EAAE,IAAI;YACX,SAAS,EAAE,IAAI;YACf,sBAAsB,EAAE,IAAI;SAC/B,CAAC,CAAC;QAEC,IAAI,CAAC,aAAa,EAAE,CAAC;IACzB,CAAC;IACM,aAAa;QAChB,IAAI,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE;YACxC,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;YACzC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,WAAW,EAAE,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;YAC/H,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;SAEhF;IAEL,CAAC;IACM,MAAM;QACT,IAAI,IAAI,CAAC,mBAAmB,CAAC,SAAS,IAAI,IAAI,CAAC,mBAAmB,CAAC,UAAU,IAAI,IAAI,CAAC,mBAAmB,CAAC,UAAU,CAAC,MAAM,EAAE;YACzH,IAAI,CAAC,mBAAmB,CAAC,UAAU,CAAC,MAAM,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;YACnE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,mBAAmB,CAAC,SAAS,CAAC,KAAK,EAAE,IAAI,CAAC,mBAAmB,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;SAC9G;IAGL,CAAC;CAmBJ;AA7CD,oCA6CC"}

package/dist/gui/navigation-cube/components/cube-scene.d.ts

@@ -0,0 +1,13 @@
+import { Scene, Mesh, Object3D, MeshBasicMaterial, BufferGeometry } from 'three';
+import { ViralNavigationCube } from '../viral-navigation-cube';
+export declare class CubeScene {
+    viralNavigationCube: ViralNavigationCube;
+    scene: Scene;
+    objects: Object3D[];
+    cube: Mesh | null;
+    activePlane: Mesh<BufferGeometry, MeshBasicMaterial> | null;
+    constructor(viralNavigationCube: ViralNavigationCube);
+    addObject(object: Object3D): void;
+    addCube(): void;
+    addPlanes(): void;
+}