architwin 1.10.10 → 2.0.0

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

@@ -1,9 +1,12 @@
 import { degreesToRadians, radiansToDegrees, useCapitalizeFirstLetter } from "../../../utils";
-import { getSelectedObject } from "../../../architwin";
-import { convertYupToZup } from "../../../worldConversion";
+import { getSelectedObject, setObjectTransformation, get3DXObjects, _mpConfig } from "../../../architwin";
+import { COORDINATE_SYSTEM } from "../../../types";
+import { convertZupToYup, convertYupToZup, getOffsetPositionFromBasepoint } from "../../../worldConversion";
+import { getScaleFactor, getMeasurementUnit, getBasepoint, getCoordinateSystem, isAdjust } from "./actionSettingsPane";
 import { Notyf } from 'notyf';
 import log from 'loglevel';
 import i18n from "./i18n";
+import { getBasepointObjectPayload } from "./actionSettingsPane";
 let notyf = new Notyf({ position: { x: 'left', y: 'bottom' }, duration: 4500 });
 export let activeModelControlPane = false;
 export let modelControlPane;
@@ -12,8 +15,13 @@ let inputX;
 let inputY;
 let inputZ;
 let isInputEventListenerSet = false;
-// let coordX:string = ""
+let basepointCoord;
+let coordSystem = '';
+let measurementUnit = '';
+let scaleFactor = '';
+let selectedObjectCoordinateSystem;
 export function renderModelControlPane(type = 'Translate') {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     const element = document.createElement('div');
     element.classList.add('at_container');
     element.classList.add('at_h-full');
@@ -26,7 +34,21 @@ export function renderModelControlPane(type = 'Translate') {
                     <span class="at_bolder at_text_base" id="at-transform-type-title">${i18n.t(type)}</span>
                     <span class="mdi mdi-close at_text_base" style="cursor:pointer" id="at-close-model-controls" data-cy="at-close-model-controls"></span>
                 </div>
-                <span id="at-coordinate-system-text" class="at_text_xs">${i18n.t("CoordinateSystem")}: ${i18n.t("Matterport")}</span>
+                <span style="display:${((_b = (_a = _mpConfig.toolbarConfig) === null || _a === void 0 ? void 0 : _a.menuItems) === null || _b === void 0 ? void 0 : _b.bim) ? 'block' : 'none'}" id="at-coordinate-system-text" class="at_text_xs">${i18n.t("CoordinateSystem")}: ${i18n.t("Matterport")}</span>
+                <div style="display:${((_d = (_c = _mpConfig.toolbarConfig) === null || _c === void 0 ? void 0 : _c.menuItems) === null || _d === void 0 ? void 0 : _d.bim) ? 'block' : 'none'}" class="at_flex at_flex_column at_gap_2" id="at-coordinate-container">
+                    <label class="at_text_xs">${i18n.t("CoordinateSystem")}</label>
+                    <div class="at_flex at_justify_center at_gap_4">
+                        <label class="at_flex at_align_center at_text_xxs at_gap_1">
+                            <input type="radio" id="at-settings-radio-matterport" name="obj-coordinate-system" value="matterport" checked />
+                            ${i18n.t("Matterport")}
+                        </label>
+                        <label class="at_flex at_align_center at_text_xxs at_gap_1">
+                            <input type="radio" id="at-settings-radio-bim" name="obj-coordinate-system" value="bim" />
+                            ${i18n.t("Bim")}
+                        </label>
+                    </div>
+                </div>
+                
                 <div class="at_number_field">
                     <span class="at_bolder">X</span>
                     <input type="number" id="at-input-x" class="at_rounded_input"/>
@@ -42,7 +64,7 @@ export function renderModelControlPane(type = 'Translate') {
                     <input type="number" id="at-input-z" class="at_rounded_input"/>
                     <span class="at_bolder at_model_unit">m</span>
                 </div>
-                <div class="at_mt_static_text at_mt_static_text_container at_inline_block at_rounded">
+                <div style="display:${((_f = (_e = _mpConfig.toolbarConfig) === null || _e === void 0 ? void 0 : _e.menuItems) === null || _f === void 0 ? void 0 : _f.bim) ? 'block' : 'none'}" class="at_mt_static_text at_mt_static_text_container at_inline_block at_rounded" id="at-mt-static-text-container">
                     <span class="at_text_xxs at_mx-w-16" id="at-transform-note">Matterport</span>
                     <span class="at_text_xxs">x:</span>
                     <span class="at_text_xxs at_mt_cal_text" id="at-mt-coordx"></span>         
@@ -51,7 +73,7 @@ export function renderModelControlPane(type = 'Translate') {
                     <span class="at_text_xxs">z:</span>
                     <span class="at_text_xxs at_mt_cal_text" id="at-mt-coordz"></span>
                 </div>
-                <span class="at_text_xxs at_mx-w-16" id="at-transform-note">
+                <span style="display:${((_h = (_g = _mpConfig.toolbarConfig) === null || _g === void 0 ? void 0 : _g.menuItems) === null || _h === void 0 ? void 0 : _h.bim) ? 'block' : 'none'}" class="at_text_xxs at_mx-w-16" id="at-transform-note">
                     ${i18n.t("CoordinateNote")}
                 </span>
                 <button class="at_button at_cat_confirm_btn" id="at-confirm-transform" data-cy="at-confirm-transform">${i18n.t('Confirm')}</button>
@@ -69,6 +91,7 @@ export function toggleModelControl(visible = true, type = 'translate') {
         modelControlPane.style.display = 'block';
         setTransformType(type);
         showCurrentCoordinateValue();
+        setCoordinateSystemType();
         log.info("=====test toggle: ", type);
         return;
     }
@@ -131,11 +154,17 @@ export function getCoordinateValues() {
     }
     const selectedObject = getSelectedObject();
     const transform = {};
-    const degreeToRadianRotation = transformType === 'rotate' ? degreesToRadians(formCoords) : selectedObject.node.quaternion;
-    log.info("degreeToRadianRotation ", degreeToRadianRotation);
+    let newRotationValue;
+    if (selectedObject.type == "BASEPOINT") {
+        newRotationValue = { x: 1.57079633, y: 0, z: 0 };
+    }
+    else {
+        newRotationValue = transformType === 'rotate' ? degreesToRadians(formCoords) : selectedObject.node.quaternion;
+    }
+    log.info("degreeToRadianRotation ", newRotationValue);
     transform.object_position = transformType === 'translate' ? formCoords : selectedObject.node.position;
     transform.object_scale = transformType === 'scale' ? formCoords : selectedObject.node.scale;
-    transform.object_rotation = degreeToRadianRotation;
+    transform.object_rotation = newRotationValue;
     console.log("getCoordinateValues rotation quaternion values", selectedObject.node.quaternion);
     return transform;
 }
@@ -166,18 +195,40 @@ export function showCurrentCoordinateValue(payload) {
         inputZ = document.getElementById('at-input-z');
     }
     const selectedObject = getSelectedObject();
+    getCoordinateSetup();
+    initObjectCoordinateSystem();
+    isCoordinatesDisplay();
     if (!selectedObject) {
         console.error("selectedObject is undefined");
         return;
     }
     if (transformType == 'translate') {
+        // if (_mpConfig.toolbarConfig.menuItems && _mpConfig.toolbarConfig.menuItems.bim) {           
+        //     const coordinateSwitch = document.getElementById('at-coordinate-container')
+        //     const coordinateText = document.getElementById('at-coordinate-system-text')
+        //     if (coordinateSwitch && isAdjust == true) {
+        //         coordinateSwitch.style.display = 'none'
+        //         coordinateText.style.display = 'block'
+        //     }
+        //     if (coordinateText && isAdjust == false) {
+        //         coordinateText.style.display = 'none'
+        //         coordinateSwitch.style.display = 'block'
+        //     }
+        // }
         const currentPos = selectedObject.node.position;
         inputX.value = currentPos.x.toFixed(3).toString();
         inputY.value = currentPos.y.toFixed(3).toString();
         inputZ.value = currentPos.z.toFixed(3).toString();
-        updateDisplayedCoordinates();
+        // updateDisplayedCoordinates()
+        displayMTCoordinates();
     }
     else if (transformType == 'rotate') {
+        if (_mpConfig.toolbarConfig.menuItems && _mpConfig.toolbarConfig.menuItems.bim) {
+            const coordinateSwitch = document.getElementById('at-coordinate-container');
+            if (coordinateSwitch) {
+                coordinateSwitch.style.display = 'none';
+            }
+        }
         //@ts-expect-error
         log.info("obj3D rotation ", selectedObject.node.obj3D.rotation);
         //@ts-expect-error
@@ -193,14 +244,26 @@ export function showCurrentCoordinateValue(payload) {
         inputX.setAttribute('radian-value', rotationDegreeFormat.x.toString());
         inputY.setAttribute('radian-value', rotationDegreeFormat.y.toString());
         inputZ.setAttribute('radian-value', rotationDegreeFormat.z.toString());
-        updateDisplayedCoordinates();
+        // updateDisplayedCoordinates()
+        displayMTCoordinates();
     }
     else if (transformType == 'scale') {
+        if (_mpConfig.toolbarConfig.menuItems && _mpConfig.toolbarConfig.menuItems.bim) {
+            const coordinateSwitch = document.getElementById('at-coordinate-container');
+            const coordinateText = document.getElementById('at-coordinate-system-text');
+            if (coordinateSwitch) {
+                coordinateSwitch.style.display = 'block';
+            }
+            if (coordinateText && isAdjust == false) {
+                coordinateText.style.display = 'none';
+            }
+        }
         const currentScale = selectedObject.node.scale;
         inputX.value = currentScale.x.toFixed(3).toString();
         inputY.value = currentScale.y.toFixed(3).toString();
         inputZ.value = currentScale.z.toFixed(3).toString();
-        updateDisplayedCoordinates();
+        // updateDisplayedCoordinates()
+        displayMTCoordinates();
     }
 }
 function setModelInputUnit(type) {
@@ -260,70 +323,266 @@ export function handleModelControlInputs() {
     inputX.addEventListener('input', onModelControlInput);
     inputY.addEventListener('input', onModelControlInput);
     inputZ.addEventListener('input', onModelControlInput);
-    updateDisplayedCoordinates();
+    // updateDisplayedCoordinates()
+    displayMTCoordinates();
+}
+function getCoordinateSetup() {
+    log.info("getCoordinateSetup()");
+    // gets basepoint value
+    if (getBasepoint()) {
+        basepointCoord = getBasepoint();
+        log.info("=======basepoint: ", basepointCoord);
+    }
+    // get the coordinate system
+    if (getCoordinateSystem()) {
+        coordSystem = getCoordinateSystem();
+        log.info("=======coordsystem: ", coordSystem);
+    }
+    // get the measurement unit
+    if (getMeasurementUnit()) {
+        measurementUnit = getMeasurementUnit();
+        log.info("=======measurement: ", measurementUnit);
+    }
+    // get the scale factor
+    if (getScaleFactor()) {
+        scaleFactor = getScaleFactor();
+        log.info("=======scalefactor: ", scaleFactor);
+    }
 }
-function updateDisplayedCoordinates() {
-    log.info("=====updating coordinates: ");
+export function updateDisplayedCoordinates() {
+    log.info("=======updating coordinates: ");
     const selectedObject = getSelectedObject();
-    // const scaleFactor = getScaleFactor()
-    // const measurementUnit = getMeasurementUnit()
-    // const basePoint = getBasepoint()
-    // let coordX: string = inputX.value
-    // let coordY: string = inputY.value
-    // let coordZ: string = inputZ.value
-    // if (coordX) {
-    //     document.getElementById("at-mt-coordx").textContent = coordX;
-    // }
-    // if (coordY) {
-    //     document.getElementById("at-mt-coordy").textContent = coordY;
-    // }
-    // if (coordZ) {
-    //     document.getElementById("at-mt-coordz").textContent = coordZ;
-    // }
-    // if (coordX && coordY && coordZ) {
-    //     const object = {
-    //         x: Number(inputX.value),
-    //         y: Number(inputY.value),
-    //         z: Number(inputZ.value)
-    //     } as Vector3
-    //     log.info("=====test Object to update: ", object)
-    //     const convert = convertYupToZup(object)
-    //     if (convert) {
-    //         log.info("=====test Convert Text: ", convert)
+    let convert = {};
+    const excludedTypes = ['BASEPOINT', 'POLYGON'];
+    const filteredObjects = get3DXObjects().filter(obj => !excludedTypes.includes(obj.type));
+    const basepointObject = get3DXObjects().find(obj => obj.type == 'BASEPOINT');
+    log.info("=======filtered Objects: ", filteredObjects, get3DXObjects());
+    if (inputX && inputY && inputZ) {
+        log.info("=======text Selected Object: ", selectedObject);
+        const object = {
+            x: Number(inputX.value),
+            y: Number(inputY.value),
+            z: Number(inputZ.value)
+        };
+        log.info("=======test Object to update: ", object);
+        // const convert = convertYupToZup(object, basepointCoord, 'm', 1)
+        // when converted value exists
+        // if (convert) {
+        //     log.info("=======test Convert Text: ", convert)
+        //     // display mt-coordinate values
+        //     document.getElementById("at-mt-coordx").textContent = convert.x.toFixed(3).toString();
+        //     document.getElementById("at-mt-coordy").textContent = convert.y.toFixed(3).toString();
+        //     document.getElementById("at-mt-coordz").textContent = convert.z.toFixed(3).toString();
+        // }
+        // updates object position
+        if (selectedObject) {
+            const currentCoordinates = getCoordinateValues();
+            log.info("=======checking current coordinate: ", currentCoordinates);
+            if (selectedObject.object.coordinate_system == COORDINATE_SYSTEM.BIM || basepointObject) {
+                convert = convertZupToYup(object, basepointCoord);
+            }
+            // basepoint exists and is adjusting its coordinates
+            if (basepointObject && isAdjust == true) {
+                const coordinateSwitch = document.getElementById('at-coordinate-container');
+                // if (coordinateSwitch) {
+                //     coordinateSwitch.style.display = 'none'
+                // }
+                log.info("=======checking User is adjusting Basepoint: ", currentCoordinates);
+                const basepointCoords = {
+                    object_position: basepointObject.object.object_position,
+                    object_rotation: basepointObject.object.object_rotation,
+                    object_scale: basepointObject.object.object_scale
+                };
+                for (let i = 0; i < filteredObjects.length; i++) {
+                    if (filteredObjects[i].object.coordinate_system == COORDINATE_SYSTEM.BIM) {
+                        const convertedPosition = convertYupToZup(filteredObjects[i].object.object_position);
+                        const offsettedPosition = getOffsetPositionFromBasepoint(convertedPosition, basepointCoords.object_position);
+                        setObjectTransformation(filteredObjects[i].node, {
+                            object_position: offsettedPosition,
+                            object_rotation: filteredObjects[i].object.object_rotation,
+                            object_scale: filteredObjects[i].object.object_scale
+                        });
+                    }
+                }
+                // filteredObjects.forEach((object: IObjectData) => {
+                //     if (object.object.coordinate_system == COORDINATE_SYSTEM.BIM) {
+                //         log.info("=======checking to update objects as bim is adjusted", object)
+                //         setObjectTransformation(object.node, basepointCoords)
+                //         }
+                //     })
+            }
+            else {
+                log.info("======test init coordinate: ", coordSystem);
+                if (transformType == 'translate') {
+                    log.info("=======test Translate: ", currentCoordinates, object);
+                    // currentCoordinates.object_position = convert
+                    setObjectTransformation(selectedObject.node, currentCoordinates);
+                }
+                else if (transformType == 'scale') {
+                    log.info("=======test Scale: ", currentCoordinates, object);
+                    // currentCoordinates.object_scale = convert
+                    setObjectTransformation(selectedObject.node, currentCoordinates);
+                }
+            }
+        }
+    }
+}
+export function getSelectedObjectCoordinateSystem() {
+    // let coordClass = ''
+    // const selectObject = getSelectedObject()
+    // log.info("=====This get Object coordinate: ", payload, coordSystem = payload, selectObject)
+    // payload == 'matterport' ? coordClass = 'at-settings-radio-matterport' : coordClass = 'at-settings-radio-bim'
+    // if (coordClass) {
+    //     log.info("======This is test for coord System: ", coordSystem)
+    //     const coordRadio = document.getElementById(coordClass) as HTMLInputElement;
+    //     log.info("======This is test for coord Class: ", coordClass)
+    //     log.info("======This is test for coordRadio: ", coordRadio)
+    //     //NOTE: getters should not set values. Only get not set
+    //     // if (payload == 'matterport') {
+    //     //     selectObject.object.coordinate_system = COORDINATE_SYSTEM.MATTERPORT
+    //     // } else if (payload == 'bim') {
+    //     //     selectObject.object.coordinate_system = COORDINATE_SYSTEM.BIM
+    //     // }
+    //     if (coordRadio) {
+    //         coordRadio.checked = true
+    //         log.info("======This is test before updating: ", selectObject)
+    //         // setSelectedObject(selectObject.object, selectObject.node, selectObject.component, '3DX')
+    //         log.info("======This is test after updating: ", selectObject)
     //     }
+    //     return payload == 'matterport' ? COORDINATE_SYSTEM.MATTERPORT : COORDINATE_SYSTEM.BIM
     // }
-    if (inputX && inputY && inputZ && selectedObject) {
-        const transform = getCoordinateValues();
-        // log.info("======Testing from: ", scaleFactor, measurementUnit, basePoint)
-        log.info("=====text Selected Object: ", selectedObject);
+    return selectedObjectCoordinateSystem;
+}
+export function setSelectedObjectCoordinateSystem(payload) {
+    if (!payload) {
+        log.error("payload is undefined");
+        return;
+    }
+    const targetId = payload == 'matterport' ? 'at-settings-radio-matterport' : 'at-settings-radio-bim';
+    const coordRadio = document.getElementById(targetId);
+    if (coordRadio) {
+        coordRadio.checked = true;
+    }
+    selectedObjectCoordinateSystem = payload == 'matterport' ? COORDINATE_SYSTEM.MATTERPORT : COORDINATE_SYSTEM.BIM;
+}
+function initObjectCoordinateSystem() {
+    log.info("======This is initialize test");
+    let coordClass = '';
+    const selectObject = getSelectedObject();
+    if (selectObject) {
+        // coordSystem = document.getElementById('at-coordinate-container')?.innerText.trim();
+        log.info("======This is initialize test select Object: ", selectObject);
+        if (selectObject.object.coordinate_system == COORDINATE_SYSTEM.MATTERPORT) {
+            coordClass = 'at-settings-radio-matterport';
+        }
+        else if (selectObject.object.coordinate_system == COORDINATE_SYSTEM.BIM) {
+            coordClass = 'at-settings-radio-bim';
+        }
+        if (coordClass) {
+            const coordRadio = document.getElementById(coordClass);
+            if (coordRadio) {
+                log.info("======This is initialize test for coordRadio: ", coordRadio);
+                coordRadio.checked = true;
+            }
+        }
+    }
+}
+// displays read-only mt-values
+function displayMTCoordinates() {
+    if (inputX && inputY && inputZ) {
+        const selectObject = getSelectedObject();
         const object = {
             x: Number(inputX.value),
             y: Number(inputY.value),
             z: Number(inputZ.value)
         };
-        log.info("=====test Object to update: ", object);
-        const convert = convertYupToZup(object);
+        log.info("=======test Object to update: ", object);
+        const convert = convertZupToYup(object, basepointCoord, 'm', 1);
         // when converted value exists
         if (convert) {
-            log.info("=====test Convert Text: ", convert);
-            document.getElementById("at-mt-coordx").textContent = convert.x.toString();
-            document.getElementById("at-mt-coordy").textContent = convert.y.toString();
-            document.getElementById("at-mt-coordz").textContent = convert.z.toString();
-            // if (selectedObject) {
-            //     if (transformType == 'translate') {
-            //         log.info("=====test Translate: ", transform, convert)
-            //         transform.object_position = convert
-            //         setObjectTransformation(selectedObject.node, transform)
-            //     } else if (transformType == 'rotate') {
-            //         log.info("=====test Rotate: ", transform, convert)
-            //         transform.object_rotation = convert
-            //         setObjectTransformation(selectedObject.node, transform)
-            //     } else if (transformType == 'scale') {
-            //         log.info("=====test Scale: ", transform, convert)
-            //         transform.object_scale = convert
-            //         setObjectTransformation(selectedObject.node, transform)
-            //     }
-            // }
+            log.info("=======test Convert Text: ", convert);
+            // display mt-coordinate values
+            document.getElementById("at-mt-coordx").textContent = convert.x.toFixed(3).toString();
+            document.getElementById("at-mt-coordy").textContent = convert.y.toFixed(3).toString();
+            document.getElementById("at-mt-coordz").textContent = convert.z.toFixed(3).toString();
+        }
+        else {
+            if (selectObject) {
+                const currentCoordinates = getCoordinateValues();
+                if (currentCoordinates && transformType == 'translate') {
+                    document.getElementById("at-mt-coordx").textContent = currentCoordinates.object_position.x.toFixed(3).toString();
+                    document.getElementById("at-mt-coordy").textContent = currentCoordinates.object_position.y.toFixed(3).toString();
+                    document.getElementById("at-mt-coordz").textContent = currentCoordinates.object_position.z.toFixed(3).toString();
+                }
+                else if (currentCoordinates && transformType == 'scale') {
+                    document.getElementById("at-mt-coordx").textContent = currentCoordinates.object_scale.x.toFixed(3).toString();
+                    document.getElementById("at-mt-coordy").textContent = currentCoordinates.object_scale.y.toFixed(3).toString();
+                    document.getElementById("at-mt-coordz").textContent = currentCoordinates.object_scale.z.toFixed(3).toString();
+                }
+            }
+        }
+    }
+}
+function isCoordinatesDisplay() {
+    const isBimEnabled = _mpConfig.toolbarConfig.menuItems.bim;
+    log.info("======is bim active, ", isBimEnabled);
+    const coordinateSwitch = document.getElementById('at-coordinate-container');
+    const staticCoordinate = document.getElementById('at-transform-note');
+    const coordinateText = document.getElementById('at-coordinate-system-text');
+    const coordinateStatic = document.getElementById('at-mt-static-text-container');
+    if (isBimEnabled == false) {
+        log.info("======is bim false, ", isBimEnabled);
+        if (coordinateSwitch && staticCoordinate && coordinateText) {
+            log.info("======is bim setting to display none ", isBimEnabled, coordinateSwitch, staticCoordinate, coordinateText);
+            staticCoordinate.style.display = 'none';
+            coordinateSwitch.style.display = 'none';
+            coordinateText.style.display = 'none';
+        }
+        if (coordinateStatic) {
+            coordinateStatic.style.display = 'none';
+        }
+        if (coordinateText) {
+            coordinateText.style.display = 'none';
+        }
+    }
+}
+// function isRadioCoordinateDisable(payload: string) {
+//     const radContainer = document.getElementById('at-coordinate-container')
+//     if (radContainer) {
+//         const radioButtons = radContainer.querySelectorAll('input[type="radio"]') as NodeListOf<HTMLInputElement>;;
+//         if (radioButtons && payload == 'rotate') {
+//             // radioButtons.forEach(radio => {
+//             //     radio.disabled = true; // Disables each radio button
+//             // });
+//             console.log("Radio buttons are disabled", payload);
+//         }
+//     } else {
+//         console.log("Container not found");
+//     }
+// }
+export function setCoordinateSystemType() {
+    var _a, _b;
+    if ((_b = (_a = _mpConfig.toolbarConfig) === null || _a === void 0 ? void 0 : _a.menuItems) === null || _b === void 0 ? void 0 : _b.bim) {
+        const coordinateText = document.getElementById('at-coordinate-system-text');
+        const mtStaticText = document.getElementById('at-mt-static-text-container');
+        const coordinateCont = document.getElementById('at-coordinate-container');
+        const selectedObj = getSelectedObject();
+        if (selectedObj.type === "BASEPOINT") {
+            const basepointPayload = getBasepointObjectPayload();
+            if (basepointPayload.coordinate_system === COORDINATE_SYSTEM.MATTERPORT) {
+                coordinateText.innerText = `${i18n.t("CoordinateSystem")}: ${i18n.t('Matterport')}`;
+            }
+            else if (basepointPayload.coordinate_system === COORDINATE_SYSTEM.BIM) {
+                coordinateText.innerText = `${i18n.t("CoordinateSystem")}: ${i18n.t('Bim')}`;
+            }
+            coordinateCont.style.display = 'none';
+            coordinateText.style.display = 'block';
+            mtStaticText.classList.add('hidden');
+        }
+        else {
+            mtStaticText.classList.remove('hidden');
+            coordinateCont.style.display = 'block';
+            coordinateText.style.display = 'none';
         }
     }
 }