architwin 1.15.1 → 1.15.3

package/lib/loaders/polydrawerLoader.js

@@ -1114,12 +1114,31 @@ export class BufferGeometry {
                 const p2 = new THREE.Vector3(path3D[2].x, path3D[2].y, path3D[2].z);
                 const v1 = new THREE.Vector3().subVectors(p1, p0);
                 const v2 = new THREE.Vector3().subVectors(p2, p0);
-                const normal = new THREE.Vector3().crossVectors(v1, v2);
+                let normal = new THREE.Vector3().crossVectors(v1, v2);
                 const normalLen = normal.length();
                 if (normalLen === 0) {
                     continue;
                 }
                 normal.divideScalar(normalLen);
+                // CRITICAL FIX: Ensure normal points outward from the wall
+                // Calculate the centroid of the main polygon (floor)
+                const centroid = new THREE.Vector3();
+                for (const point of this.inputs.path) {
+                    centroid.add(new THREE.Vector3(point.x, point.y, point.z));
+                }
+                centroid.divideScalar(this.inputs.path.length);
+                // Calculate window center
+                const windowCenter = new THREE.Vector3();
+                for (const point of path3D) {
+                    windowCenter.add(new THREE.Vector3(point.x, point.y, point.z));
+                }
+                windowCenter.divideScalar(path3D.length);
+                // Vector from centroid to window center
+                const outwardVector = new THREE.Vector3().subVectors(windowCenter, centroid);
+                // If normal points inward (dot product < 0), flip it
+                if (normal.dot(outwardVector) < 0) {
+                    normal.negate();
+                }
                 const uAxis = v1.clone().normalize();
                 const vAxis = new THREE.Vector3().crossVectors(normal, uAxis).normalize();
                 const shapePoints2D = [];
@@ -1140,8 +1159,8 @@ export class BufferGeometry {
                 const basisMatrix = new THREE.Matrix4().makeBasis(uAxis, vAxis, normal);
                 const translation = new THREE.Matrix4().makeTranslation(p0.x, p0.y, p0.z);
                 const worldMatrix = new THREE.Matrix4().multiplyMatrices(translation, basisMatrix);
-                // Apply a small offset along the wall normal to avoid z-fighting with coplanar planes
-                const offset = -0.05;
+                // Apply a small offset along the wall normal to avoid z-fighting
+                const offset = -0.08;
                 const offsetMatrix = new THREE.Matrix4().makeTranslation(normal.x * offset, normal.y * offset, normal.z * offset);
                 const finalMatrix = new THREE.Matrix4().multiplyMatrices(offsetMatrix, worldMatrix);
                 windowGeometry.applyMatrix4(finalMatrix);
@@ -1192,7 +1211,6 @@ export class BufferGeometry {
                         let windowLabelText = windows[i].name ? `${windows[i].name}` : windowMesh.name;
                         windowLabelText = windows[i].material ? `${windowLabelText}_${windows[i].material}: ${windowDimension.area.toFixed(2)}m²` : `${windowLabelText}: ${windowDimension.area.toFixed(2)}m²`;
                         log.info("windowLabelText ", windowLabelText);
-                        //const windowLabel = windows[i].name ? `${windows[i].name}_${windows[i].material}` : `Window ${i}_${windows[i].material}`
                         const windowCanvas = this.createLabelCanvas(windowLabelText);
                         const windowArea = Math.abs(twiceSignedArea * 0.5);
                         const labelWidth = Math.max(0.5, Math.min(2, Math.sqrt(Math.max(0.0001, windowArea))));
@@ -1209,11 +1227,12 @@ export class BufferGeometry {
                             .addScaledVector(vAxis, centerV)
                             .add(p0);
                         const labelOffset = 0.01;
+                        // Position label slightly offset from window, facing inward (opposite to normal)
                         windowCenterLabel.position.copy(center3D).addScaledVector(normal.clone().negate(), labelOffset);
                         windowCenterLabel.name = windowMesh.name;
                         windowCenterLabel.visible = windows[i].options ? windows[i].options.is_visible : true;
+                        // Make label face inward (opposite direction of the outward normal)
                         windowCenterLabel.lookAt(windowCenterLabel.position.clone().add(normal.clone().negate()));
-                        //windowCenterLabel.name = windows[i].uuid ? `${windows[i].uuid}_windowLabel` : `windowLabel-${i}`;
                         this.groupedMesh.add(windowCenterLabel);
                     }
                     catch (e) {

package/package.json

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

package/static/atwinui.css

@@ -257,9 +257,9 @@
     margin-bottom: 0 20px;
 }
 
-.at_collapse-content{
-    /* height: 400px; */
-}
+/* .at_collapse-content{
+    height: 400px; 
+} */
 
 .at_collapsible_container {
     width: 100%;
@@ -1253,6 +1253,139 @@
     transform: translateY(-100%);
 }
 
+#at-preview-modal-overlay {
+    display: none;
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.8);
+    z-index: 1000;
+    justify-content: center;
+    align-items: center;
+    animation: at_fade-in 0.3s ease;
+}
+
+#at-preview-modal-overlay.show {
+    display: flex;
+}
+
+@keyframes at_fade-in {
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
+}
+
+.at_preview_modal {
+    background-color: #222222;
+    color: var(--text-color-light);
+    border-radius: var(--border-radius);
+    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
+    width: 95vw;
+    height: 95vh;
+    max-width: 95vw;
+    max-height: 95vh;
+    overflow: hidden;
+    position: relative;
+    animation: at_slide-up 0.4s cubic-bezier(.39, .575, .565, 1.000) both;
+    display: flex;
+    flex-direction: column;
+}
+
+@keyframes at_slide-up {
+    from {
+        transform: translateY(50px);
+        opacity: 0;
+    }
+    to {
+        transform: translateY(0);
+        opacity: 1;
+    }
+}
+
+.at_preview_modal-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 12px 16px;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+    flex-shrink: 0;
+    min-height: 50px;
+}
+
+.at_preview_modal-title {
+    margin: 0;
+    font-size: 1.5rem;
+    font-weight: 600;
+    color: var(--text-color-light);
+    word-break: break-word;
+}
+
+.at_preview_modal-close-btn {
+    background: none;
+    border: none;
+    color: var(--text-color-light);
+    font-size: 1.5rem;
+    cursor: pointer;
+    padding: 4px 8px;
+    border-radius: 4px;
+    transition: all 0.2s ease;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 32px;
+    min-height: 32px;
+}
+
+.at_preview_modal-close-btn:hover {
+    background-color: var(--bg-accent);
+    color: var(--text-color-dark);
+}
+
+.at_preview_modal-body {
+    padding: 0;
+    overflow: hidden;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    height: calc(100% - 50px);
+    width: 100%;
+}
+
+.at_preview_modal-content {
+    color: var(--text-color-light);
+    line-height: 1.6;
+    font-size: 1rem;
+    padding: 20px;
+    overflow-y: auto;
+    flex: 1;
+}
+
+.at_preview_modal-iframe {
+    border: none;
+    border-radius: 0;
+    background: white;
+    width: 100%;
+    height: 100%;
+    flex: 1;
+    display: block;
+    min-width: 0;
+    min-height: 0;
+}
+
+.at_preview_modal-footer {
+    padding: 16px 20px;
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
+    display: flex;
+    justify-content: flex-end;
+    gap: 12px;
+    flex-shrink: 0;
+}
+
 @keyframes slide-down {
     from {
         transform: translateY(-100%);
@@ -1587,6 +1720,7 @@
     background-color: #0F0E0E;
     padding-right: 5px;
     border-radius: 4px; 
+    border: 2px solid white;
 }
 
 .at_room_tree .hidden {
@@ -2495,14 +2629,16 @@ li.at_partition_wall_row_item {
 
 .at_partition_child_header.selected {
     padding-right: 5px !important;
+    border: 2px solid white;
 }
 
 .at_hidden {
     display: none;
 }
 
-.at_wall_window_row_item.selected {
+.at_window_row_item.selected {
     padding-left: 5px;
+    border: 2px solid white;
 }
 
 .at_save_button {
@@ -2524,3 +2660,201 @@ li.at_partition_wall_row_item {
     margin-left: 4px;
     box-sizing: border-box;
 }
+
+/* FLEXIBLE MODAL CLASSES */
+
+.at_flexible_modal-overlay {
+    display: none;
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.8);
+    z-index: 1000;
+    justify-content: center;
+    align-items: center;
+    animation: at_fade-in 0.3s ease;
+}
+
+.at_flexible_modal-overlay.show {
+    display: flex;
+}
+
+@keyframes at_fade-in {
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
+}
+
+.at_flexible_modal {
+    background-color: #222222;
+    color: var(--text-color-light);
+    border-radius: var(--border-radius);
+    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
+    max-width: 90%;
+    max-height: 90vh;
+    overflow: hidden;
+    position: relative;
+    animation: at_slide-up 0.4s cubic-bezier(.39, .575, .565, 1.000) both;
+    display: flex;
+    flex-direction: column;
+}
+
+@keyframes at_slide-up {
+    from {
+        transform: translateY(50px);
+        opacity: 0;
+    }
+    to {
+        transform: translateY(0);
+        opacity: 1;
+    }
+}
+
+.at_flexible_modal-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 16px 20px;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+    flex-shrink: 0;
+}
+
+.at_flexible_modal-title {
+    margin: 0;
+    font-size: 1.5rem;
+    font-weight: 600;
+    color: var(--text-color-light);
+    word-break: break-word;
+}
+
+.at_flexible_modal-close-btn {
+    background: none;
+    border: none;
+    color: var(--text-color-light);
+    font-size: 1.5rem;
+    cursor: pointer;
+    padding: 4px 8px;
+    border-radius: 4px;
+    transition: all 0.2s ease;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 32px;
+    min-height: 32px;
+}
+
+.at_flexible_modal-close-btn:hover {
+    background-color: var(--bg-accent);
+    color: var(--text-color-dark);
+}
+
+.at_flexible_modal-body {
+    padding: 20px;
+    overflow-y: auto;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+}
+
+.at_flexible_modal-content {
+    color: var(--text-color-light);
+    line-height: 1.6;
+    font-size: 1rem;
+}
+
+.at_flexible_modal-content h1,
+.at_flexible_modal-content h2,
+.at_flexible_modal-content h3,
+.at_flexible_modal-content h4 {
+    color: var(--text-color-light);
+    margin-top: 0;
+    margin-bottom: 12px;
+    font-weight: 600;
+}
+
+.at_flexible_modal-content h1 { font-size: 1.8rem; }
+.at_flexible_modal-content h2 { font-size: 1.5rem; }
+.at_flexible_modal-content h3 { font-size: 1.3rem; }
+.at_flexible_modal-content h4 { font-size: 1.1rem; }
+
+.at_flexible_modal-iframe {
+    border: none;
+    border-radius: 4px;
+    background: white;
+    width: 100%;
+    height: 100%;
+    min-height: 400px;
+}
+
+.at_flexible_modal-footer {
+    padding: 16px 20px;
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
+    display: flex;
+    justify-content: flex-end;
+    gap: 12px;
+    flex-shrink: 0;
+}
+
+/* Responsive design */
+@media screen and (max-width: 768px) {
+    .at_flexible_modal {
+        max-width: 95%;
+        margin: 10px;
+    }
+
+    .at_flexible_modal-header {
+        padding: 12px 16px;
+    }
+
+    .at_flexible_modal-body {
+        padding: 16px;
+    }
+
+    .at_flexible_modal-footer {
+        padding: 12px 16px;
+    }
+
+    .at_flexible_modal-title {
+        font-size: 1.2rem;
+    }
+
+    .at_flexible_modal-iframe {
+        min-height: 300px;
+    }
+}
+
+@media screen and (max-width: 480px) {
+    .at_flexible_modal {
+        max-width: 98%;
+        margin: 5px;
+    }
+
+    .at_flexible_modal-header,
+    .at_flexible_modal-body,
+    .at_flexible_modal-footer {
+        padding: 12px;
+    }
+
+    .at_flexible_modal-title {
+        font-size: 1.1rem;
+    }
+
+    .at_flexible_modal-close-btn {
+        font-size: 1.2rem;
+        min-width: 28px;
+        min-height: 28px;
+    }
+}
+span.at_room_name_text.toggle.selectable.selected {
+    border: none !important;    
+}
+
+span.at_partition_name_text.toggle.selectable.selected {
+    border: none !important;    
+}

package/static/utility.css

@@ -716,4 +716,7 @@
 .at_border_yellowgreen_900 { border-color: #365314; }
 .at_border_yellowgreen_950 { border-color: #1a2e05; }
 
-  
+.at_bg-gray-800 {
+  background-color: #222222 !important;
+}
+