architwin 1.14.15 → 1.15.0

package/lib/atwinui/components/toolbar/roomCreation/roomLayerListPane.d.ts

@@ -1,33 +0,0 @@
-import { RoomNode } from "../../../../types";
-/**
- * Renders and returns the HTML element for the room layer list pane.
- * @returns {HTMLElement} The HTML element representing the room layer list pane.
- */
-export declare function renderRoomLayerListPane(): HTMLElement;
-/**
- * Renders the UI for the Room tree structure.
- * @param rooms - Details of the rooms to construct the tree.
- */
-export declare function renderRoomTree(rooms: Array<RoomNode>): void;
-/**
- * Renders the UI for the specified room.
- * @param room - The details of the room to be rendered.
- */
-export declare function renderRoom(room: RoomNode): HTMLUListElement;
-/**
- * Renders the partitions for a specific room.
- * @param roomPartitions - The details of the room partitions to be rendered.
- * @param roomId - The identifier of the room to which the partitions belong.
- */
-export declare function renderPartitions(roomPartitions: RoomNode[], roomId: string): void;
-/**
- * Renders the items within a specific partition.
- * @param partitionItems - The details of the partition items to be rendered.
- */
-export declare function renderPartitionItems(partitionItems: any): string;
-export declare function updateParentVisibility(isPartition: boolean, currentBtn: HTMLElement): void;
-/**
- * Retrieves the current room data being edited.
- * @returns The current room node being edited.
- */
-export declare function getCurrentEditRoomData(): RoomNode;

package/lib/atwinui/components/toolbar/roomCreation/roomLayerListPane.js

@@ -1,447 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import { getBundleVersion, extractUUID } from "../../../../utils";
-import { batchAddEventListenerByClassName, handleRoomVisibility, toggleDisplayPane } from "../../../events";
-import i18n from "../i18n";
-import { setPartitionFormMode } from "./roomFormPane";
-import { _3DXObjects } from "../../../../architwin";
-let roomDataArray = [];
-let currentEditRoomData = null;
-/**
- * Renders and returns the HTML element for the room layer list pane.
- * @returns {HTMLElement} The HTML element representing the room layer list pane.
- */
-export function renderRoomLayerListPane() {
-    console.info("__@ renderRoomLayerListPane");
-    const element = document.createElement('div');
-    element.classList.add('at_container');
-    element.classList.add('at_w-12');
-    element.classList.add('at_h-full');
-    element.setAttribute('id', 'at-room-tree-pane');
-    element.setAttribute('data-cy', 'at-room-tree-pane');
-    element.innerHTML = `
-        <div class="at_panel_header">
-            <span>${i18n.t('RoomTree')}</span>
-        </div>
-
-        <div class="at_button_row at_justify_end">
-            <div class="at_button at_accent at_accent_active" id="at-all-display-btn" data-cy="at-all-display-btn">
-                <span>${i18n.t('ALL')}</span>
-            </div>
-            <div class="at_button at_accent" id="at-floor-display-btn" data-cy="at-floor-display-btn">
-                <span class="mdi mdi-perspective-less"></span>
-            </div>
-            <div class="at_button at_accent" id="at-wall-display-btn" data-cy="at-wall-display-btn">
-                <span class="mdi mdi-perspective-less at_rotate_minus_90"></span>
-            </div>
-        </div>
-
-        <div class="at_scrollable_container at_h-min-60" id="at-room-tree" data-cy="at-room-tree">
- 
-        </div>
-
-        <div class="at_button_row at_justify_between" >
-            <div class="at_button at_ghost"  id="at-partition-report-btn" data-cy="at-create-report-btn">
-                ${i18n.t('Report')}
-                <span class="mdi mdi-table-arrow-down"></span>
-            </div>
-            <div class="at_button at_ghost" id="at-draw-room-btn" data-cy="at-draw-room-btn" target-pane="at-room-form-pane">
-                ${i18n.t('AddRoom')}
-                <span class="mdi mdi-plus-circle-outline"></span>
-            </div>
-        </div>
-        <div class="at_flex at_justify_center at_price" id="at-bundle-version" data-cy="at-bundle-version">
-            <small class="at_text_xxs at_text_white at_opacity_5">${getBundleVersion()}</small>
-        </div>
-    `;
-    return element;
-}
-/**
- * Renders the UI for the Room tree structure.
- * @param rooms - Details of the rooms to construct the tree.
- */
-export function renderRoomTree(rooms) {
-    console.log("__@ renderRoomTree");
-    console.info("__@ Room tree _3DXObjects: ", _3DXObjects);
-    try {
-        // Target the at-room-tree container
-        const roomTreeContainer = document.getElementById('at-room-tree');
-        // Clear any existing content inside the container before appending new UI
-        roomTreeContainer.innerHTML = '';
-        // Create the root <ul> element
-        const rootUl = document.createElement('ul');
-        rootUl.classList.add('at_room_tree');
-        // Iterate over each room
-        rooms.forEach(room => {
-            const roomItem = renderRoom(room);
-            roomTreeContainer.appendChild(roomItem);
-            if (room.children.length > 0) {
-                // Render room partitions
-                renderPartitions(room.children, room.uuid);
-            }
-        });
-        // Append the root <ul> to the #at-room-tree container
-        roomTreeContainer.appendChild(rootUl);
-    }
-    catch (error) {
-        console.error("__@ Failed to render room tree: ", error);
-    }
-    toggleSelectedRoom();
-    setRoomData(rooms);
-}
-/**
- * Renders the UI for the specified room.
- * @param room - The details of the room to be rendered.
- */
-export function renderRoom(room) {
-    const element = document.createElement('ul');
-    element.classList.add('at_room_tree');
-    element.innerHTML = `
-        <li class="at_room_tree_parent">
-            <div class="at_flex at_space_between at_toggle">
-                <span class="toggle selectable" >▶ ${room.name}</span> 
-                <div>
-                    <span id="at-room-edit-${room.uuid}-btn" class="mdi mdi-pencil at_room_edit_btn" target-pane="at-room-form-pane"></span>
-                    <span id="at-room-visibility-${room.uuid}-btn" class="mdi mdi-eye at_room_visible_btn"></span>
-                </div>
-            </div>
-            <ul id="at-partition-container-${room.uuid}" class="hidden">
-            </ul>
-        </li>
-    `;
-    return element;
-}
-/**
- * Renders the partitions for a specific room.
- * @param roomPartitions - The details of the room partitions to be rendered.
- * @param roomId - The identifier of the room to which the partitions belong.
- */
-export function renderPartitions(roomPartitions, roomId) {
-    console.log("__@ roomPartitions: ", roomPartitions);
-    const partitionContainer = document.getElementById(`at-partition-container-${roomId}`);
-    if (partitionContainer) {
-        partitionContainer.innerHTML = '';
-        roomPartitions.forEach(partition => {
-            console.log("__@ room partition: ", partition);
-            const partitionItem = partition.name.split(' ');
-            // Append HTML to the container
-            let partitionHTML = `
-                <li class="at_room_tree_child">
-                    <div class="at_flex at_space_between at_toggle">
-                        <span class="toggle selectable">▶ ${i18n.t(`${partitionItem[0]}`)} ${partitionItem[1]}</span> 
-                        <div>
-                            <span id="at-partition-visibility-${partition.uuid}-btn" class="mdi mdi-eye at_room_visible_btn"></span>
-                        </div>
-                    </div>
-                    <ul id="at-partition-items-container-${partition.uuid}" class="hidden">
-            `;
-            const polygonJson = JSON.parse(partition.polygon_json);
-            console.log("artition polygon data: ", polygonJson);
-            if (polygonJson && polygonJson.floor && polygonJson.walls) {
-                // Render floor
-                partitionHTML += renderPartitionItems(polygonJson.floor);
-                // Render walls 
-                if (polygonJson.walls.length > 0) {
-                    partitionHTML += renderPartitionItems(polygonJson.walls);
-                }
-            }
-            partitionHTML += `</ul></li>`;
-            partitionContainer.innerHTML += partitionHTML;
-        });
-    }
-}
-/**
- * Renders the items within a specific partition.
- * @param partitionItems - The details of the partition items to be rendered.
- */
-export function renderPartitionItems(partitionItems) {
-    console.log("__@ partitionItems: ", partitionItems);
-    let itemsHTML = '';
-    // Check if item is an array, e.g.: walls
-    if (Array.isArray(partitionItems)) {
-        // This is for the walls
-        partitionItems.forEach(item => {
-            console.log("__@ partition item: ", item);
-            // Split wall name to localize
-            const match = item.name.match(/_wall-(\d+)$/);
-            itemsHTML += `
-                <li class="at_toggle">${i18n.t(`Wall`)} ${match[1]}
-                    <span id="at-partition-item-${item.uuid.substring(0, 6)}" class="mdi mdi-eye at_room_visible_btn at_pull_right"></span>
-                </li>
-            `;
-        });
-    }
-    else {
-        // This is for the floor
-        itemsHTML += `
-            <li class="at_toggle"> ${i18n.t(`${partitionItems.name}`)}
-                <span id="at-partition-item-${partitionItems.uuid.substring(0, 6)}" class="mdi mdi-eye at_room_visible_btn at_pull_right"></span>
-            </li>
-        `;
-    }
-    return itemsHTML;
-}
-/**
- * Toggles the selection state of a room.
- */
-function toggleSelectedRoom() {
-    console.log("__@ toggleSelectedRoom");
-    try {
-        document.querySelectorAll('.at_room_tree .toggle, .at_room_tree .selectable').forEach(function (item) {
-            item.addEventListener('click', function (event) {
-                // Prevent event from propagating to parent elements
-                event.stopPropagation();
-                // Find the parent div of the clicked toggle
-                const parentDiv = item.closest('div');
-                // Remove the 'selected' class from all items
-                document.querySelectorAll('.selected').forEach(function (el) {
-                    el.classList.remove('selected');
-                });
-                // Add the 'selected' class to the clicked item
-                item.classList.add('selected');
-                parentDiv.classList.add('selected');
-                // Toggle visibility of child items
-                let childList = parentDiv.nextElementSibling;
-                // If it's not a direct sibling (in case of nested elements like partitions), find the next <ul> at the right level
-                if (!childList || childList.tagName !== 'UL') {
-                    childList = item.nextElementSibling;
-                }
-                // Toggle visibility of the child list
-                if (childList) {
-                    childList.classList.toggle('hidden');
-                }
-                // Toggle the arrow without affecting #at-icons
-                if (item.textContent.trim().startsWith('▶')) {
-                    item.textContent = item.textContent.replace('▶', '▼');
-                }
-                else {
-                    item.textContent = item.textContent.replace('▼', '▶');
-                }
-            });
-        });
-    }
-    catch (error) {
-        console.error("__@ Failed to toggle selected room: ", error);
-    }
-    // Attach event listener
-    batchAddEventListenerByClassName('at_room_edit_btn', (event) => __awaiter(this, void 0, void 0, function* () {
-        console.log('Event', event);
-        // Prevent event from propagating up to parent elements
-        event.stopPropagation();
-        // Highlight selected item
-        highlightSelectedItem(event);
-        setPartitionFormMode("EDIT" /* FORM_MODE.EDIT */);
-        // @ts-ignore
-        setCurrentEditRoomData(event.target.id);
-        // @ts-ignore
-        toggleDisplayPane(event.target.id);
-    }));
-    batchAddEventListenerByClassName('at_room_visible_btn', (event) => __awaiter(this, void 0, void 0, function* () {
-        console.log('Event', event);
-        const target = event.target;
-        // Prevent event from propagating up to parent elements
-        event.stopPropagation();
-        // Highlight selected item
-        highlightSelectedItem(event);
-        // Handle visibility logic
-        handleRoomVisibility(target.id);
-    }));
-}
-/**
- * Highlights the selected item based on the triggered event.
- * @param event - The event object containing details about the selected item.
- */
-function highlightSelectedItem(event) {
-    const target = event.target;
-    if (target) {
-        // Find the closest div or li parent to apply the 'selected' class
-        const parentDiv = target.closest('.at_toggle');
-        // Remove the 'selected' class from all items
-        document.querySelectorAll('.selected').forEach((item) => {
-            item.classList.remove('selected');
-        });
-        // Add the 'selected' class to the clicked icon's parent div
-        if (parentDiv) {
-            parentDiv.classList.add('selected');
-        }
-    }
-}
-// export function updateParentVisibility(isPartition: boolean, childElement: HTMLElement) {
-//     const parent = childElement.closest('ul')?.closest('li');
-//     if (!parent) return;
-//     if (isPartition && parent) {
-//         const parentEyeIcon = parent.querySelector('.at_room_visible_btn') as HTMLElement;
-//         if (parentEyeIcon) {
-//             console.log("Parent Eye Icon Element:", parentEyeIcon);
-//             if (parentEyeIcon.classList.contains('mdi-eye-off')) {
-//                 parentEyeIcon.classList.remove('mdi-eye-off')
-//                 parentEyeIcon.classList.add('mdi-eye')
-//             }else{
-//                 parentEyeIcon.classList.remove('mdi-eye')
-//                 parentEyeIcon.classList.add('mdi-eye-off')
-//             }
-//         }
-//     }
-// }
-export function updateParentVisibility(isPartition, currentBtn) {
-    var _a, _b, _c, _d, _e, _f;
-    const parentId = isPartition
-        ? (_b = (_a = currentBtn.closest('.at_room_tree_child')) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.id
-        : (_d = (_c = currentBtn.closest('.at_room_tree_parent')) === null || _c === void 0 ? void 0 : _c.parentElement) === null || _d === void 0 ? void 0 : _d.id;
-    if (parentId) {
-        const parentVisibilityBtn = document.querySelector(`#${parentId} .mdi-eye, #${parentId} .mdi-eye-off`);
-        if (parentVisibilityBtn) {
-            // Check if all children of the parent are in the same visibility state
-            const allChildrenVisible = Array.from(((_e = parentVisibilityBtn.parentElement) === null || _e === void 0 ? void 0 : _e.querySelectorAll('.mdi-eye')) || []).length > 0;
-            const allChildrenHidden = Array.from(((_f = parentVisibilityBtn.parentElement) === null || _f === void 0 ? void 0 : _f.querySelectorAll('.mdi-eye-off')) || []).length > 0;
-            // Update the parent's visibility based on its children
-            if (allChildrenVisible && !allChildrenHidden) {
-                parentVisibilityBtn.classList.remove('mdi-eye-off');
-                parentVisibilityBtn.classList.add('mdi-eye');
-            }
-            else if (allChildrenHidden && !allChildrenVisible) {
-                parentVisibilityBtn.classList.remove('mdi-eye');
-                parentVisibilityBtn.classList.add('mdi-eye-off');
-            }
-        }
-    }
-}
-/**
- * Sets the room data for the application.
- * @param rooms - An array of room nodes to be stored.
- */
-function setRoomData(rooms) {
-    roomDataArray = rooms;
-}
-/**
- * Retrieves the stored room data.
- * @returns An array of room nodes.
- */
-function getRoomData() {
-    return roomDataArray;
-}
-/**
- * Sets the current room data being edited based on the provided ID.
- * @param id - The unique identifier of the room to be edited.
- */
-function setCurrentEditRoomData(id) {
-    const roomUUID = extractUUID(id);
-    currentEditRoomData = getRoomData().find(room => room.uuid === roomUUID);
-}
-/**
- * Retrieves the current room data being edited.
- * @returns The current room node being edited.
- */
-export function getCurrentEditRoomData() {
-    return currentEditRoomData;
-}
-// STATIC ROOM TREE UI
-//     <ul class="at_room_tree">
-//     <li class="at_room_tree_parent">
-//         <div class="at_flex at_space_between at_toggle">
-//             <span class="toggle selectable" >▶ Room 1</span> 
-//             <div>
-//                 <span id="at_edit_icon" class="mdi mdi-pencil at_edit_icon"></span>
-//                 <span id="at_visible_icon" class="mdi mdi-eye at_eye_icon"></span>
-//             </div>
-//         </div>
-//         <ul class="hidden">
-//             <li class="at_room_tree_child">
-// <div class="at_flex at_space_between at_toggle">
-//     <span class="toggle selectable" >▶ Partition 1</span> 
-//     <div>
-//         <span id="at_edit_icon" class="mdi mdi-pencil at_edit_icon"></span>
-//         <span id="at_visible_icon" class="mdi mdi-eye at_eye_icon"></span>
-//     </div>
-// </div>
-//                 <ul class="hidden">
-// <li class="at_toggle"> Floor 1
-//      <span id="at_visible_icon" class="mdi mdi-eye at_eye_icon at_pull_right"></span>
-// </li>
-//                     <li class="at_toggle"> Wall 1
-//                          <span id="at_visible_icon" class="mdi mdi-eye at_eye_icon at_pull_right"></span>
-//                     </li>
-//                     <li class="at_toggle"> Wall 2
-//                          <span id="at_visible_icon" class="mdi mdi-eye at_eye_icon at_pull_right"></span>
-//                     </li>
-//                 </ul>
-//             </li>
-//         </ul>
-//     </li>
-// </ul>
-// NOT USING INNERHTML
-// const roomElement = document.createElement('li');
-// roomElement.classList.add('at_room_tree_parent');
-// const roomDiv = document.createElement('div');
-// roomDiv.setAttribute('id', `at-room-${room.id}`)
-// roomDiv.classList.add('at_flex', 'at_space_between', 'at_toggle');
-// const roomTitle = document.createElement('span');
-// roomTitle.classList.add('toggle', 'selectable');
-// roomTitle.textContent = `▶ ${room.name}`;
-// const roomIcons = document.createElement('div');
-// // Edit icon
-// const pencilIcon = document.createElement('span');
-// pencilIcon.setAttribute('id', `at-room-edit-${room.id}-btn`)
-// pencilIcon.classList.add('mdi', 'mdi-pencil', 'at_room_edit_btn');
-// // Visibility icon
-// const eyeIcon = document.createElement('span');
-// eyeIcon.setAttribute('id', `at-room-visibility-${room.id}-btn`)
-// eyeIcon.classList.add('mdi', 'mdi-eye', 'at_room_visible_btn');
-// roomIcons.appendChild(pencilIcon);
-// roomIcons.appendChild(eyeIcon);
-// roomDiv.appendChild(roomTitle);
-// roomDiv.appendChild(roomIcons);
-// roomElement.appendChild(roomDiv);
-// // Create child partition list
-// const partitionList = document.createElement('ul');
-// partitionList.classList.add('hidden');
-// room.partitions.forEach(partition => {
-//     const partitionElement = document.createElement('li');
-//     partitionElement.setAttribute('id', `at-partition-${partition.id}`)
-//     partitionElement.classList.add('at_room_tree_child');
-//     const partitionDiv = document.createElement('div');
-//     partitionDiv.classList.add('at_flex', 'at_space_between', 'at_toggle');
-//     const partitionTitle = document.createElement('span');
-//     partitionTitle.classList.add('toggle', 'selectable');
-//     partitionTitle.textContent = `▶ ${partition.name}`;
-//     const partitionIcons = document.createElement('div');
-//     // Edit icon
-//     const partitionPencilIcon = document.createElement('span');
-//     partitionPencilIcon.setAttribute('id', `at-partition-edit-${partition.id}-btn`)
-//     partitionPencilIcon.classList.add('mdi', 'mdi-pencil', 'at_room_edit_btn');
-//     // Visibility icon
-//     const partitionEyeIcon = document.createElement('span');
-//     partitionEyeIcon.setAttribute('id', `at-partition-visibility-${partition.id}-btn`)
-//     partitionEyeIcon.classList.add('mdi', 'mdi-eye', 'at_room_visible_btn');
-//     partitionIcons.appendChild(partitionPencilIcon);
-//     partitionIcons.appendChild(partitionEyeIcon);
-//     partitionDiv.appendChild(partitionTitle);
-//     partitionDiv.appendChild(partitionIcons);
-//     partitionElement.appendChild(partitionDiv);
-//     // Create child items (floor, wall, etc.)
-//     const itemList = document.createElement('ul');
-//     itemList.classList.add('hidden');
-//     partition.items.forEach(item => {
-//         const itemElement = document.createElement('li');
-//         itemElement.setAttribute('id', `at-partition-item-${item.id}`)
-//         itemElement.classList.add('at_toggle');
-//         itemElement.textContent = item.name;
-//         // Visibility icon
-//         const eyeIconForItem = document.createElement('span');
-//         eyeIconForItem.setAttribute('id', `at-partition-item-${item.id}`)
-//         eyeIconForItem.classList.add('mdi', 'mdi-eye', 'at_room_visible_btn', 'at_pull_right');
-//         itemElement.appendChild(eyeIconForItem);
-//         itemList.appendChild(itemElement);
-//     });
-//     partitionElement.appendChild(itemList);
-//     partitionList.appendChild(partitionElement);
-// });
-// roomElement.appendChild(partitionList);
-// rootUl.appendChild(roomElement);

package/lib/atwinui/components/toolbar/tagIotForm.d.ts

@@ -1,20 +0,0 @@
-import { FORM_MODE, ITagIOTCategory, ITagIOTDevice } from '../../../types';
-export declare let iotTagFormMode: FORM_MODE;
-export declare function renderTagIOTForm(): HTMLDivElement;
-export declare function setIotCategoryOptions(): void;
-export declare function toggleIoTCategoryOptions(): void;
-export declare function toggleIoTDevicesOptions(): void;
-export declare function setSelectedIoTSystemRadio(payload: string): void;
-export declare function clearIoTDropdowns(): void;
-export declare function initIoTFormData(): void;
-export declare function renderIotCategoryDropdownOptions(elementId: string, items: Array<ITagIOTCategory>): void;
-export declare function setIotDeviceOptions(): void;
-export declare function renderIotDeviceDropdownOptions(elementId: string, items: Array<ITagIOTDevice>): void;
-export declare function getIotTagFormData(): {
-    tagName: string;
-    modelName: string;
-    serialName: string;
-    tagMf: string;
-    tagCategoryId: string;
-    systemLink?: string;
-};