architwin 1.15.2 → 1.15.4

package/lib/atwinui/components/toolbar/i18n.js

@@ -191,6 +191,8 @@ i18n
                 "Chemical": "Chemical",
                 "Submeter": "Submeter",
                 "Frequency": "Frequency",
+                "Camera": "Camera",
+                "Others": "Others",
                 "DeleteDevice": "Delete Device",
                 "ConfirmDeleteDevice": "Are you sure you want to delete this device? This action cannot be reversed",
                 "SuccessDeleteDevice": "Successfully deleted device",
@@ -272,7 +274,8 @@ i18n
                 "MoveTagCancelled": "Move Tag Cancelled",
                 "Window": "Window",
                 "CannotBackDrawingMode": "Cannot go back while drawing mode is active.",
-                "PleaseOffDrawingMode": "Action cannot be done, please turn off drawing mode."
+                "PleaseOffDrawingMode": "Action cannot be done, please turn off drawing mode.",
+                "IotCategoryRequired": "IoT Category is required"
             }
         },
         ja: {
@@ -464,6 +467,8 @@ i18n
                 "Chemical": "化学物質",
                 "Submeter": "サブメーター",
                 "Frequency": "周波数",
+                "Camera": "カメラ",
+                "Others": "その他",
                 "DeleteDevice": "デバイス削除",
                 "ConfirmDeleteDevice": "この操作は元に戻せません。このデバイスを削除しますか?",
                 "SuccessDeleteDevice": "デバイスを削除しました",
@@ -539,7 +544,8 @@ i18n
                 "Window": "建具",
                 "CannotBackDrawingMode": "描画モードがアクティブな間は戻ることができません。",
                 "PleaseOffDrawingMode": "操作を行う前に、描画モードをオフにしてください。",
-                "Successfully Deleted Tag": "タグを削除しました"
+                "Successfully Deleted Tag": "タグを削除しました",
+                "IotCategoryRequired": "IoTカテゴリは必須です"
             }
         }
     },

package/lib/atwinui/components/toolbar/spacePartition/roomFormPane.d.ts

@@ -1,4 +1,5 @@
 import { FORM_MODE, PartitionNode, PolygonData, IObjectData } from "../../../../types";
+export declare let isEditWindow: boolean;
 export declare function renderRoomFormPane(): HTMLDivElement;
 /**
  * Toggles the state of the partition drawing functionality.

package/lib/atwinui/components/toolbar/spacePartition/roomFormPane.js

@@ -41,7 +41,7 @@ let inputFloorMaterial;
 let floorMaterial = '';
 let inputWallMaterial;
 let wallMaterial = '';
-let isEditWindow = false;
+export let isEditWindow = false;
 let currentEditWindowIndex = null;
 let tempCurrentEditRoom = null;
 export function renderRoomFormPane() {
@@ -241,12 +241,14 @@ export function toggleDrawWindowButton() {
         isDrawing = true;
         drawingMode = 'window';
         // clearSelectedObject()
-        addDoorButton.classList.remove('at_add_window_door_btn');
-        addDoorButton.classList.add('at_add_window_door_btn_active');
-        addDoorButton.innerHTML = `
-            ${i18n.t('DoneDrawing')}
-            <span class="mdi mdi-check-bold"></span>
-        `;
+        if (!isEditWindow) {
+            addDoorButton.classList.remove('at_add_window_door_btn');
+            addDoorButton.classList.add('at_add_window_door_btn_active');
+            addDoorButton.innerHTML = `
+                ${i18n.t('DoneDrawing')}
+                <span class="mdi mdi-check-bold"></span>
+            `;
+        }
         const objectIndex = _3DXObjects.findIndex(obj => obj.object.id == currentObject.object.id);
         log.info("objectIndex", objectIndex);
         clearFloorBaseHeight();
@@ -941,16 +943,28 @@ function setupEditWindow(element, window) {
         inputName.focus();
         isEditWindow = true;
         currentEditWindowIndex = window.index;
-        // toggleDrawWindowButton()
+        drawingMode = 'window';
+        toggleDrawWindowButton();
+        log.info("currentObject ", currentObject);
+        setCurrentPolygon(currentObject);
+        const drawConfig = {
+            lineTypeComponentConfig: {
+                renderPolygonOnAdd: false,
+                drawingMode: drawingMode,
+                polygonData: currentObject.object.object_data.json_data,
+                targetUUID: currentWall.uuid,
+                targetIndex: currentEditWindowIndex
+            }
+        };
+        setDrawingConfig(drawConfig);
         // @ts-ignore
         const windowComponent = {
             inputs: {
                 path: window.path
             }
         };
-        log.info("currentObject ", currentObject);
-        // setCurrentPolygon(currentObject)
-        // enableVerticeControls(windowComponent)
+        enableVerticeControls(windowComponent);
+        isDrawing = true;
     });
     // // Confirm edit name and material
     confirmBtn.addEventListener("click", () => {
@@ -979,8 +993,11 @@ function setupEditWindow(element, window) {
                 }
             }));
         }
-        // toggleDrawWindowButton()
+        // cancelDraw()
+        toggleDrawWindowButton();
         saveWallChanges();
+        isDrawing = false;
+        isEditWindow = false;
     });
 }
 function saveWallChanges() {
@@ -1505,6 +1522,7 @@ export function setCurrentPartitionData() {
                 if (drawingMode === 'partition') {
                     displayFaceLists();
                     currentObject = currentObjectData;
+                    log.info("JAMES currentObject", currentObject);
                 }
             }, 50); // Check every 50ms
         });
@@ -1536,6 +1554,7 @@ export function setCurrentPartitionData() {
             }
             else if (drawingMode === 'window') {
                 // Update current edit wall display
+                currentObject.object.object_data.json_data = currentPolygonData;
                 currentWall = currentPolygonData.walls.find(wall => wall.uuid == currentWall.uuid);
                 log.info("current wall", currentWall, currentPolygonData);
                 const faceVertexContainer = document.getElementById('at-face-vertex-container');
@@ -1558,7 +1577,7 @@ export function setCurrentPartitionData() {
     });
 }
 function updatePartitionDataArray(payload, currentPartitionDataArray) {
-    log.info("updatePartitionDataArray", payload, currentPartitionDataArray);
+    log.info("updatePartitionDataArray", payload, currentPartitionDataArray, drawingMode);
     if (drawingMode === 'partition') {
         // Find the index of the partition with the same uuid
         const existingIndex = currentPartitionDataArray.findIndex((partition) => partition.uuid === payload.uuid);

package/lib/atwinui/components/toolbar/tagIotFormPane.js

@@ -23,7 +23,7 @@ export let selectedIotTag = undefined;
 let tagIotName, iotModelName, iotSerialNumber, iotMfrName, iotSystemLink;
 let selectedIoTCat;
 let linkedDevicesArray = [];
-let iotCategoryIconList = ['mdi-power', 'mdi-thermometer', 'mdi-water-percent', 'mdi-gauge', 'mdi-leak', 'mdi-water', 'mdi-lightbulb-on', 'mdi-gas-cylinder', 'mdi-flask', 'mdi-meter-electric', 'mdi-information-symbol', 'mdi-sine-wave'];
+let iotCategoryIconList = ['mdi-power', 'mdi-thermometer', 'mdi-water-percent', 'mdi-gauge', 'mdi-leak', 'mdi-water', 'mdi-lightbulb-on', 'mdi-gas-cylinder', 'mdi-flask', 'mdi-meter-electric', 'mdi-information-symbol', 'mdi-sine-wave', 'mdi-camera', 'mdi-dots-horizontal'];
 let notify = new Notyf({ position: { x: 'left', y: 'bottom' } });
 export function renderTagIOTFormPane() {
     const element = document.createElement('div');
@@ -38,20 +38,20 @@ export function renderTagIOTFormPane() {
 
     <div class="at_form_container at_scrollable_container at_h-min-70">
       <label for="">${i18n.t('LinkedSystems')}</label>
-        <div class="at_gap_2" style="display: inline-flex">
-          <label class="at_flex at_align_center at_text_xs at_gap_1">
-            <input type="radio" id="at-linked-radio-bemac" name="iot-link-system" checked value=${IOT_LINKED_SYSTEMS.BEMAC} selected />
-              ${i18n.t("BEMAC")}
-          </label>
-          <label class="at_flex at_align_center at_text_xs at_gap_1">
-            <input type="radio" id="at-linked-radio-hanasys" name="iot-link-system" value=${IOT_LINKED_SYSTEMS.HANASYS} />
-              ${i18n.t("HANASYS")}
-          </label>
-          <label class="at_flex at_align_center at_text_xs at_gap_1">
-            <input type="radio" id="at-linked-radio-link" name="iot-link-system" value=${IOT_LINKED_SYSTEMS.URL_LINK} />
-              ${i18n.t("URLLink")}
-          </label>
-        </div>
+      <div class="at_linked_systems_options_contianer at_gap_2" style="display: inline-flex">
+        <label class="at_flex at_align_center at_text_xs at_gap_1">
+          <input type="radio" id="at-linked-radio-bemac" name="iot-link-system" checked value=${IOT_LINKED_SYSTEMS.BEMAC} selected />
+            ${i18n.t("BEMAC")}
+        </label>
+        <label class="at_flex at_align_center at_text_xs at_gap_1">
+          <input type="radio" id="at-linked-radio-hanasys" name="iot-link-system" value=${IOT_LINKED_SYSTEMS.HANASYS} />
+            ${i18n.t("HANASYS")}
+        </label>
+        <label class="at_flex at_align_center at_text_xs at_gap_1">
+          <input type="radio" id="at-linked-radio-link" name="iot-link-system" value=${IOT_LINKED_SYSTEMS.URL_LINK} />
+            ${i18n.t("URLLink")}
+        </label>
+      </div>
 
         <div class="at_field at_flex_column">
          <label for="">${i18n.t('Category')}</label>
@@ -544,7 +544,7 @@ export function getIotTagFormData() {
         serialNumber: iotSerialNumber.value,
         tagMf: iotMfrName.value,
         // tagCategoryId: selectedIoTCat.uuid,
-        tagCategoryId: selectedIoTCat.name,
+        tagCategoryId: selectedIoTCat ? selectedIoTCat.name : undefined,
         systemLink: iotSystemLink.value,
         linkedDevices: linkedDevicesArray,
         iotSystem: selectedIoTSystem,
@@ -678,6 +678,7 @@ export function clearIotFields() {
     iotSystemLink.innerText = '';
     linkedDevicesArray = [];
     selectedIoTSystem = '';
+    selectedIoTCat = undefined;
     setSelectedIoTSystemRadio(IOT_LINKED_SYSTEMS.BEMAC);
     deviceContainer.innerHTML = '';
     iotTagFormMode = "ADD" /* FORM_MODE.ADD */;

package/lib/atwinui/components/toolbar/tagListPane.js

@@ -349,7 +349,9 @@ export function renderTagRow(tag, tagIconUrl, tag_type = null) {
             </div>
         </td>
         <td id="at-tag-row-${tag.id}" data-cy="at-tag-row-${tag.id}" tag-id="${tag.id}">
-            <span>${tag.label}</span>
+            <div class="at-iot-tag-row-name">
+                <span title="${tag.label.length > 12 ? tag.label : ''}">${tag.label}</span>
+            </div>
         </td>
         <td class="at_table_button_row">
             <span class="mdi mdi-pencil at_edit_tag_btn ${isTagReadOnly ? 'at_disabled' : ''}" id="at-edit-tag-${tag.id}" data-cy="at-edit-tag-${tag.id}" tag-id="${tag.id}" target-pane=${tag_type === TAG_TYPE.IOT ? "at-tag-iot-form-pane" : "at-tag-form-pane"}></span>

package/lib/atwinui/events.js

@@ -28,7 +28,7 @@ import { toggleDrawPartitionButton, displayPartitionFormMode, setPartitionFormMo
 import { actionSettingsSelectOption, getTempCoordinateSystem, getTempMeasurementUnit, getTempRotationUnit, setCoordinateSystem, setMeasurementUnit, setRotationUnit, initSettingsValues, setTempCoordinateSystem, setTempMeasurementUnit, setTempRotationUnit, toggleActionSettingsDropdown, toggleCalibrateBasepoint, setScaleFactor, getTempScaleFactor, setTempScaleFactor, setBasepoint, getTempBasepoint, setTempBasepoint, getBasepoint, toggleActionSettings, getBasepointObjectPayload, displayConvertedCoordinates, getCoordinateSystem, getScaleFactor, getMeasurementUnit, getRotationUnit, setBasepointObjectPayload } from "./components/toolbar/actionSettingsPane";
 import { getBasepointCalibrateBpCoordinateValues, getBasepointCalibrateMpCoordinateValues, initBsepointCalibratePane, toggleBasepointCalibratePane } from "./components/toolbar/basepointCalibratePane";
 import { toggleGeneralMapOptions, initGeneralSelectedMap, getSelectedMapOption } from './components/toolbar/generalSettingsMenuPane';
-import { searchTagList, setSearchTagTerm, searchClearfield, getSearchTagTerm, sortTags, updateSelectedTagSortOption, resetSelectedTagSortOption, filterIotTagList, setTagPaneActive, isTagPaneActive, setCurrentTagPaneMode, currentTagPaneMode } from './components/toolbar/tagListPane';
+import { searchTagList, setSearchTagTerm, searchClearfield, getSearchTagTerm, sortTags, updateSelectedTagSortOption, resetSelectedTagSortOption, filterIotTagList, setTagPaneActive, isTagPaneActive, setCurrentTagPaneMode, currentTagPaneMode, selectedTagSortOption } from './components/toolbar/tagListPane';
 import { renderUserRows } from "./components/toolbar/spaceUserListPane";
 import { handleRemoteViewResponsiveChanges, renderRemoteSpaceViewing } from "./components/toolbar/viewingRemoteSpace";
 import { PipeList } from "./components/toolbar/pipeListPane";
@@ -343,19 +343,25 @@ function renderTagPaneContent() {
             log.info("1 content", tags);
             setTagPaneActive(true);
             setCurrentTagPaneMode(TAG_TYPE.MP);
-            renderTags(filterTagList(tags));
+            resetSelectedTagSortOption();
+            const sortedTagsToDisplay = sortTags(tags, selectedTagSortOption);
+            renderTags(filterTagList(sortedTagsToDisplay));
         }
         else if (tags.length > 0 && isTagPaneActive) {
             log.info("2 content", tags);
             setTagPaneActive(true);
             setCurrentTagPaneMode(TAG_TYPE.MP);
-            renderTags(tags, true);
+            resetSelectedTagSortOption();
+            const sortedTagsToDisplay = sortTags(tags, selectedTagSortOption);
+            renderTags(sortedTagsToDisplay, true);
         }
         else if (!isTagPaneActive) {
             log.info("3 content", tags);
             setTagPaneActive(false);
             setCurrentTagPaneMode(TAG_TYPE.IOT);
-            renderTags(filterIotTagList(tags));
+            resetSelectedTagSortOption();
+            const sortedTagsToDisplay = sortTags(tags, selectedTagSortOption);
+            renderTags(filterIotTagList(sortedTagsToDisplay));
             dispatchSpaceEvent(SPACE_EVENTS.GET_IOT_TAG_ICON, { payload: 'hello from library' });
         }
         if ((_tagCategories === null || _tagCategories === void 0 ? void 0 : _tagCategories.length) > 0) {
@@ -3476,7 +3482,12 @@ function handlePlaceIotTag() {
                     }
                 }
                 else {
-                    notyf.error(`${i18n.t('RequiredFieldsEmpty')}`);
+                    if (!payload.tagCategoryId) {
+                        notyf.error(`${i18n.t('IotCategoryRequired')}`);
+                    }
+                    else {
+                        notyf.error(`${i18n.t('RequiredFieldsEmpty')}`);
+                    }
                     isPlacingTag = false;
                 }
             }

package/lib/loaders/polydrawerLoader.js

@@ -85,6 +85,7 @@ export class TubeLine {
                     this.renderTubeLine();
                     console.log("paths ", this.inputs.path);
                     if (isToolbarFeatureEnabled('roomCreation') && this.inputs.path.length >= 3 && this.inputs.drawingMode == 'window') {
+                        console.log("tubeline drawing mode ", this.inputs.drawingMode);
                         const options = {
                             drawingMode: this.inputs.drawingMode,
                             targetIndex: this.inputs.targetIndex,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "architwin",
-  "version": "1.15.2",
+  "version": "1.15.4",
   "description": "ArchiTwin Library for Matterport",
   "main": "./lib/architwin.js",
   "types": "./lib/architwin.d.ts",

package/static/atwinui.css

@@ -2858,3 +2858,26 @@ span.at_room_name_text.toggle.selectable.selected {
 span.at_partition_name_text.toggle.selectable.selected {
     border: none !important;    
 }
+
+
+.at-iot-tag-row-name {
+    max-width: 100px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.at-iot-tag-row-name span {
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.at_linked_systems_options_contianer label {
+    cursor: pointer;
+}
+
+.at_linked_systems_options_contianer input {
+    cursor: pointer;
+}