@eturnity/eturnity_3d 9.19.0 → 9.25.1-9.25-dev-03.0

package/package.json

@@ -1,15 +1,22 @@
 {
   "name": "@eturnity/eturnity_3d",
   "private": false,
-  "version": "9.19.0",
+  "version": "9.25.1-9.25-dev-03.0",
   "files": [
     "dist",
     "src"
   ],
   "main": "./dist/main.umd.js",
   "module": "./dist/main.es.js",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "lint": "eslint --ext .js,.vue --ignore-path .gitignore --fix src`",
+    "prettier": "prettier --write \"**/*.{js,vue}\"",
+    "merge-remote-master": "node scripts/merge-remote-master.js"
+  },
   "dependencies": {
-    "@eturnity/eturnity_maths": "9.19.0",
+    "@eturnity/eturnity_maths": "9.25.0-panel-placement.1",
     "@originjs/vite-plugin-commonjs": "1.0.3",
     "core-js": "3.30.2",
     "cors": "2.8.5",
@@ -53,12 +60,5 @@
       "require": "./dist/main.umd.js"
     },
     "./src/*": "./src/*"
-  },
-  "scripts": {
-    "dev": "vite",
-    "build": "vite build",
-    "lint": "eslint --ext .js,.vue --ignore-path .gitignore --fix src`",
-    "prettier": "prettier --write \"**/*.{js,vue}\"",
-    "merge-remote-master": "node scripts/merge-remote-master.js"
   }
-}
+}

package/src/components/ThreeCanvasViewer.vue

@@ -26,7 +26,6 @@
         layers: null,
         provider: null,
         pointer: { x: 0, y: 0 },
-        areUserDeactivatedPanelsVisible: false,
         animationFrameId: null,
         intervalId: null,
         intervalEventId: null,
@@ -55,7 +54,6 @@
         obstacles: 'getObstacles',
         moduleFields: 'getModuleFields',
         panels: 'getPanels',
-        userDeactivatedPanels: 'getUserDeactivatedPanels',
       }),
     },
     watch: {

package/src/config.js

@@ -49,11 +49,6 @@ export const layerColors = {
     strokeColor: '#ffffff',
     strokeWidth: 1,
   },
-  user_deactivated_panel: {
-    fillColor: 'rgba(115, 115, 229, 0.1)',
-    strokeColor: 'white',
-    strokeWidth: 2,
-  },
   selectedPanel: {
     fillColor: '#0068DE80',
     strokeColor: theme.colors.blue,
@@ -126,11 +121,6 @@ export const layerColors = {
     strokeColor: theme.colors.blueElectric,
     strokeWidth: 5,
   },
-  tmpModuleField: {
-    fillColor: 'rgba(115, 115, 229, 0.2)',
-    strokeColor: theme.colors.blue,
-    strokeWidth: 1,
-  },
   selectedModuleField: {
     fillColor: '#0068DEA0',
     strokeColor: theme.colors.blue,

package/src/helper/UpdateRoofModuleFieldRelations.js

@@ -15,9 +15,8 @@ export function UpdateRoofModuleFieldRelations(state) {
   )
   let roofs = state.polygons.filter((poly) => poly.layer == 'roof')
   const panels = state.polygons.filter((poly) =>
-    ['panel', 'user_deactivated_panel'].includes(poly.layer)
+    ['panel'].includes(poly.layer)
   )
-
   let roofUnderPerModuleFieldId = {}
   moduleFields.forEach((moduleField) => {
     let roofModuleFieldIntersections = []
@@ -47,6 +46,11 @@ export function UpdateRoofModuleFieldRelations(state) {
   moduleFields.forEach((moduleField) => {
     let roof = roofUnderPerModuleFieldId[moduleField.id]
     if (roof) {
+      if (moduleField.hasError) {
+        moduleField.hasError = false
+        moduleField.warnings = []
+        moduleField.hasWarnings = false
+      }
       moduleField.roof = roof
       roof.moduleFields.push(moduleField)
       panels.forEach((panel) => {
@@ -54,6 +58,13 @@ export function UpdateRoofModuleFieldRelations(state) {
           panel.roof = roof
         }
       })
+    } else if (moduleField.panels && moduleField.panels.length > 0) {
+      moduleField.roof = null
+      if (!moduleField.hasError) {
+        moduleField.hasError = true
+        moduleField.warnings = ['module_field_warning_roof_missing']
+        moduleField.hasWarnings = true
+      }
     }
   })
   state = removeModuleFieldAndPanelsOnNoOrMultipleRoofs(state)
@@ -65,36 +76,46 @@ export function removeModuleFieldAndPanelsOnNoOrMultipleRoofs(state) {
     ['roof', 'obstacle'].includes(polygon.layer)
   )
   const remainingModuleFields = state.polygons.filter(
-    (polygon) => polygon.layer == 'moduleField' && !!polygon.roof
+    (polygon) =>
+      polygon.layer == 'moduleField' && (!!polygon.roof || polygon.hasError)
   )
-  const remainingPanels = state.polygons.filter(
-    (polygon) => polygon.layer == 'panel' && !!polygon.roof
+  const retainedModuleFieldIds = new Set(
+    remainingModuleFields.map((mf) => mf.id)
   )
-  const remainingUserDeactivatedPanels = state.polygons.filter(
-    (polygon) => polygon.layer == 'user_deactivated_panel' && !!polygon.roof
+  const remainingPanels = state.polygons.filter(
+    (polygon) =>
+      polygon.layer == 'panel' &&
+      (!!polygon.roof || retainedModuleFieldIds.has(polygon.moduleField?.id))
   )
-
   state.polygons = [
     ...remainingPolygons,
     ...remainingModuleFields,
     ...remainingPanels,
-    ...remainingUserDeactivatedPanels,
   ]
   return state
 }
 
 export function updateModuleFieldFittingPanels(moduleField) {
+  const { has_fitting_panels, fitting_panel_area_m2 } = moduleField.data || {}
+  if (!(has_fitting_panels && fitting_panel_area_m2 > 0)) {
+    delete moduleField.fittingPanels
+    return
+  }
+  clipModuleFieldFittingPanels(moduleField)
+}
+
+export function clipModuleFieldFittingPanels(moduleField) {
+  const prevVisible = moduleField?.fittingPanels?.visible
   delete moduleField.fittingPanels
-  const { has_fitting_panels, fitting_panel_area_m2 } = moduleField.data
-  const hasFittingPanels = has_fitting_panels && fitting_panel_area_m2 > 0
-  if (!hasFittingPanels) return
-  const polygons = []
+  if (!moduleField?.panels?.length) return
+  if (!moduleField?.roof || !moduleField.data?.has_fitting_panels) return
+  const innerOutline = moduleField.roof.margins?.innerOutline
+  if (!innerOutline?.length) return
 
-  const outlines = getModuleFieldRoofIntersections(
-    moduleField,
-    moduleField.roof.margins.innerOutline
-  )
+  const outlines = getModuleFieldRoofIntersections(moduleField, innerOutline)
+  if (!outlines?.length) return
   const holes = getModuleFieldHoleOutlines(moduleField)
+  const polygons = []
 
   outlines.forEach((outline) => {
     polygons.push({
@@ -105,6 +126,7 @@ export function updateModuleFieldFittingPanels(moduleField) {
         .filter(Boolean),
     })
   })
+  if (!polygons.length) return
 
   const hasCustomTexture = !!moduleField.pvData?.texture_img_url
   const defaultTextureIndex = moduleField.pvData?.module_texture_version_id || 0
@@ -115,7 +137,7 @@ export function updateModuleFieldFittingPanels(moduleField) {
 
   moduleField.fittingPanels = {
     polygons,
-    visible: true,
+    visible: prevVisible !== false,
     color: mappedColor,
   }
 }

package/src/helper/materialMixin.js

@@ -80,13 +80,6 @@ export default {
         flatShading: true,
       })
     }
-    this.material.panel['userDeactivatedPanel'] = new THREE.MeshBasicMaterial({
-      color: 0xffffff,
-      transparent: true,
-      alphaTest: 0,
-      opacity: 0.2,
-      side: THREE.DoubleSide,
-    })
     this.material.projectionTiles = []
 
     this.material.roof = [this.material.wall]

package/src/helper/render/edge.js

@@ -48,6 +48,7 @@ export default {
         if (cylinder) {
           cylinder.visible = false
         }
+        if (edge.layer === 'moduleField') return
         if (['obstacle', 'construction'].includes(edge.layer)) return
         if (
           ['selectRoof'].includes(this.selectedTool) &&

package/src/helper/render/index.js

@@ -18,6 +18,7 @@ import mergedGeometry from './mergedGeometry'
 import building from './building'
 import marker from './marker'
 import scene from './scene'
+import pullHandle from './pullHandle'
 export default {
   mixins: [
     margin,
@@ -40,5 +41,6 @@ export default {
     building,
     marker,
     scene,
+    pullHandle,
   ],
 }

package/src/helper/render/loader.js

@@ -4,9 +4,12 @@ export default {
   methods: {
     loadTextureAsync(url) {
       return new Promise((resolve) => {
-        this.loader.load(url, (texture) => {
-          resolve(texture)
-        })
+        this.loader.load(
+          url,
+          (texture) => resolve(texture),
+          () => {},
+          () => resolve(null)
+        )
       })
     },
     async loadNewPanelTextures() {
@@ -42,13 +45,20 @@ export default {
       const promiseArray = this.moduleFields.map(async (mf) => {
         const pvId = mf.data.component_id_pv_module
         if (!this.material.panel[pvId]) {
+          const defaultPanelMaterial =
+            this.material.panel[
+              `default_${mf.pvData.module_texture_version_id || 0}`
+            ]
           if (!mf.pvData.texture_img_url) {
-            this.material.panel[pvId] =
-              this.material.panel[`default_${this.moduleTextureVersionId}`]
+            this.material.panel[pvId] = defaultPanelMaterial
           } else {
             const texture = await this.loadTextureAsync(
               mf.pvData.texture_img_url
             )
+            if (!texture) {
+              this.material.panel[pvId] = defaultPanelMaterial
+              return
+            }
             texture.encoding = THREE.sRGBEncoding
             texture.colorSpace = THREE.SRGBColorSpace
             this.material.panel[pvId] = new THREE.MeshPhongMaterial({

package/src/helper/render/moduleField.js

@@ -3,6 +3,7 @@ import {
   getBufferModuleFieldGeometry,
   getFittingPanelsBufferGeometry,
 } from './geometryHandler'
+import { clipModuleFieldFittingPanels } from '../UpdateRoofModuleFieldRelations'
 
 export default {
   data() {
@@ -11,35 +12,149 @@ export default {
     }
   },
   methods: {
+    refreshModuleFieldFittingPanels(moduleFieldId = null) {
+      this.polygons
+        .filter((p) => p.layer === 'moduleField')
+        .forEach((moduleField) => {
+          if (
+            moduleField.data &&
+            (moduleFieldId == null || moduleField.id == moduleFieldId)
+          ) {
+            clipModuleFieldFittingPanels(moduleField)
+          }
+        })
+      this.renderModuleFields()
+    },
     renderModuleFields() {
-      this.clearByType('moduleFieldsMeshes')
-      const moduleFieldPolygons = this.polygons.filter((p) =>
-        ['moduleField', 'tmpModuleField'].includes(p.layer)
+      console.log('renderModuleFields')
+      this.clearRemovedModuleFieldGroups()
+      const moduleFieldPolygons = this.polygons.filter(
+        (p) => p.layer === 'moduleField'
       )
       moduleFieldPolygons.forEach((moduleFieldPolygon) => {
-        const panelOverrideMesh =
-          this.renderModuleFieldPanelOverride(moduleFieldPolygon)
-        const fittingPanelsMesh =
-          this.renderModuleFieldFittingPanels(moduleFieldPolygon)
+        let group = this.meshes.moduleFieldsMeshes[moduleFieldPolygon.id]
+        if (!group) {
+          group = new THREE.Group()
+          group.matrixAutoUpdate = false
+          group.userData.type = 'moduleFieldsMeshes'
+          group.userData.layer = moduleFieldPolygon.layer
+          group.userData.meshId = moduleFieldPolygon.id
+          group.userData.polygonId = moduleFieldPolygon.id
+          this.scene.add(group)
+          this.meshes.moduleFieldsMeshes[moduleFieldPolygon.id] = group
+        }
 
-        if (!panelOverrideMesh && !fittingPanelsMesh) return
+        this.updateModuleFieldPanelOverrideMesh(group, moduleFieldPolygon)
+        this.updateModuleFieldFittingPanelsMesh(group, moduleFieldPolygon)
 
-        const meshList = [panelOverrideMesh, fittingPanelsMesh]
-        const group = new THREE.Group()
-        meshList.forEach((mesh) => {
-          if (mesh) group.add(mesh)
-        })
-        group.matrixAutoUpdate = false
         group.userData.version = moduleFieldPolygon.version
-        group.userData.type = 'moduleFieldsMeshes'
-        group.userData.layer = moduleFieldPolygon.layer
-        group.userData.meshId = moduleFieldPolygon.id
-        group.userData.polygonId = moduleFieldPolygon.id
         group.visible = this.areModuleFieldsVisible && this.panelOpacity === 1
-        this.scene.add(group)
-        this.meshes.moduleFieldsMeshes[moduleFieldPolygon.id] = group
+
+        if (group.children.length === 0) {
+          this.scene.remove(group)
+          delete this.meshes.moduleFieldsMeshes[moduleFieldPolygon.id]
+        }
+      })
+    },
+    clearRemovedModuleFieldGroups() {
+      Object.values(this.meshes.moduleFieldsMeshes).forEach((group) => {
+        if (!this.polygonIds.includes(group.userData.polygonId)) {
+          this.disposeModuleFieldGroupChildren(group)
+          this.scene.remove(group)
+          delete this.meshes.moduleFieldsMeshes[group.userData.meshId]
+        }
+      })
+    },
+    disposeModuleFieldGroupChildren(group) {
+      group.children.forEach((child) => {
+        if (child.geometry?.dispose) child.geometry.dispose()
+        if (
+          child.userData.type === 'moduleFieldsMeshes_fittingPanels' &&
+          child.material?.dispose
+        ) {
+          child.material.dispose()
+        }
+      })
+    },
+    updateModuleFieldPanelOverrideMesh(group, moduleFieldPolygon) {
+      const type = 'moduleFieldsMeshes_panelOverride'
+      let mesh = group.children.find((c) => c.userData.type === type)
+      const shouldExist = !!moduleFieldPolygon?.data?.number_of_panels_override
+
+      if (!shouldExist) {
+        if (mesh) {
+          group.remove(mesh)
+          if (mesh.geometry?.dispose) mesh.geometry.dispose()
+        }
+        return
+      }
+
+      if (!mesh) {
+        mesh = this.renderModuleFieldPanelOverride(moduleFieldPolygon)
+        if (mesh) group.add(mesh)
+        return
+      }
+
+      if (mesh.userData.version < moduleFieldPolygon.version) {
+        const geometry = getBufferModuleFieldGeometry(moduleFieldPolygon)
+        if (geometry) {
+          if (mesh.geometry?.dispose) mesh.geometry.dispose()
+          mesh.geometry = geometry
+          mesh.userData.version = moduleFieldPolygon.version
+          mesh.updateMatrix()
+        }
+      }
+    },
+    updateModuleFieldFittingPanelsMesh(group, moduleFieldPolygon) {
+      const type = 'moduleFieldsMeshes_fittingPanels'
+      let mesh = group.children.find((c) => c.userData.type === type)
+      const fittingPanels = moduleFieldPolygon?.fittingPanels
+
+      const removeMesh = () => {
+        if (mesh) {
+          group.remove(mesh)
+          if (mesh.geometry?.dispose) mesh.geometry.dispose()
+          if (mesh.material?.dispose) mesh.material.dispose()
+        }
+      }
+
+      if (!fittingPanels?.polygons?.length) {
+        removeMesh()
+        return
+      }
+
+      if (!mesh) {
+        mesh = this.renderModuleFieldFittingPanels(moduleFieldPolygon)
+        if (mesh) group.add(mesh)
         return
+      }
+
+      const { polygons, visible, color } = fittingPanels
+      const geometries = []
+      polygons.forEach((polygon) => {
+        const geometry = getFittingPanelsBufferGeometry(
+          polygon.outline,
+          polygon.holes,
+          moduleFieldPolygon
+        )
+        if (geometry) geometries.push(geometry)
       })
+
+      if (!geometries.length) {
+        removeMesh()
+        return
+      }
+
+      mesh.geometry = this.updateMergedGeometry(geometries, mesh.geometry)
+      const isTransparent = color === 'transparent'
+      mesh.material.color.set(isTransparent ? '#ffffff' : color)
+      mesh.material.transparent = true
+      mesh.material.opacity = isTransparent ? 0.2 : 0.8
+      mesh.material.needsUpdate = true
+      mesh.userData.fittingPanelsVisible = visible
+      mesh.userData.version = moduleFieldPolygon.version
+      mesh.visible =
+        visible && this.areModuleFieldsVisible && this.panelOpacity === 1
     },
     renderModuleFieldPanelOverride(moduleFieldPolygon) {
       if (!moduleFieldPolygon?.data?.number_of_panels_override) return
@@ -60,7 +175,6 @@ export default {
     renderModuleFieldFittingPanels(moduleFieldPolygon) {
       if (!moduleFieldPolygon?.fittingPanels?.polygons?.length) return
       const { polygons, visible, color } = moduleFieldPolygon.fittingPanels
-
       const geometries = []
       polygons.forEach((polygon) => {
         const { outline, holes } = polygon
@@ -84,8 +198,10 @@ export default {
       })
 
       const mesh = new THREE.Mesh(mergedGeometry, material)
-      mesh.visible = visible
+      mesh.visible =
+        visible && this.areModuleFieldsVisible && this.panelOpacity === 1
       mesh.matrixAutoUpdate = false
+      mesh.userData.fittingPanelsVisible = visible
       mesh.userData.version = moduleFieldPolygon.version
       mesh.userData.type = 'moduleFieldsMeshes_fittingPanels'
       mesh.userData.layer = moduleFieldPolygon.layer
@@ -96,11 +212,17 @@ export default {
     },
     updateModuleFieldsVisibility(isVisible) {
       this.areModuleFieldsVisible = isVisible
-      Object.values(this.meshes['moduleFieldsMeshes']).forEach(
-        (mesh) =>
-          (mesh.visible =
-            this.areModuleFieldsVisible && this.panelOpacity === 1)
-      )
+      const moduleFieldsVisible =
+        this.areModuleFieldsVisible && this.panelOpacity === 1
+      Object.values(this.meshes['moduleFieldsMeshes']).forEach((group) => {
+        group.visible = moduleFieldsVisible
+        group.children.forEach((child) => {
+          if (child.userData.type === 'moduleFieldsMeshes_fittingPanels') {
+            child.visible =
+              moduleFieldsVisible && child.userData.fittingPanelsVisible
+          }
+        })
+      })
     },
     hideModuleFields() {
       this.updateModuleFieldsVisibility(false)

package/src/helper/render/panel.js

@@ -64,9 +64,7 @@ export default {
     renderPanelsPerModuleField(moduleField) {
       const panelSideGeometries = []
       const panelTopGeometries = []
-      const panels = this.areUserDeactivatedPanelsVisible
-        ? [...moduleField.panels, ...moduleField.userDeactivatedPanels]
-        : [...moduleField.panels]
+      const panels = [...moduleField.panels]
 
       const existingTopMesh = this.mergedPanelTopMeshes[moduleField.id]
       const isNewerVersion =
@@ -75,7 +73,24 @@ export default {
         existingTopMesh?.userData.panelOpacity !== this.panelOpacity
       const skipRender = existingTopMesh && !isNewerVersion && !opacityChanged
 
-      if (!panels.length || skipRender) {
+      if (!panels.length) {
+        if (this.mergedPanelTopMeshes[moduleField.id]) {
+          this.clearMeshFromScene(
+            this.mergedPanelTopMeshes[moduleField.id],
+            this.scene
+          )
+          delete this.mergedPanelTopMeshes[moduleField.id]
+        }
+        if (this.mergedPanelSideMesh[moduleField.id]) {
+          this.clearMeshFromScene(
+            this.mergedPanelSideMesh[moduleField.id],
+            this.scene
+          )
+          delete this.mergedPanelSideMesh[moduleField.id]
+        }
+        return
+      }
+      if (skipRender) {
         return
       }
 
@@ -119,8 +134,7 @@ export default {
         meshSide.userData.polygonId = panel.id
         meshSide.matrixAutoUpdate = false
         this.meshes.panelsMeshes[panel.id + '_side'] = meshSide
-        if (panel.layer != 'user_deactivated_panel')
-          panelSideGeometries.push(geometrySide)
+        panelSideGeometries.push(geometrySide)
       })
 
       // create merged meshes
@@ -148,11 +162,7 @@ export default {
     getPanelMaterial(panel) {
       let material
       let materialId
-      if (panel.layer == 'user_deactivated_panel') {
-        materialId = 'userDeactivatedPanel'
-        material = this.material.panel[materialId]
-        material.opacity = this.panelOpacity
-      } else {
+      {
         const moduleTextureId =
           panel.moduleField?.pvData?.module_texture_version_id || 0