Rework Catalog model loading

src/index.js

@@ -6,7 +6,7 @@ import BIMOptions, { bimOptionsId } from './upload.vue';
 import objectList, { objectListId } from './objectList.vue';
 import scaleControl, { scaleControlId } from './scaleControl.vue';
 import * as Cesium from "@vcmap-cesium/engine";
-
+import {loadCatalogModel} from "./objectList.vue";
 
 let model;
 let conditions = [[true, true]];
@@ -56,6 +56,7 @@ function setScale(scaleValue) {
   const position = currentlyScaledModel.position.getValue();
   const orientation = currentlyScaledModel.orientation;
   const uri = currentlyScaledModel.model.uri;
+  const fromCatalog = currentlyScaledModel.fromCatalog;
 
   vcMap.getEntities().remove(currentlyScaledModel);
   removePlacedModel(currentlyScaledModel);
@@ -70,6 +71,7 @@ function setScale(scaleValue) {
       scale: scaleValue,
       show: true,
     },
+    fromCatalog: fromCatalog,
   });
   placedModels.push({
     model: newModel,
@@ -102,6 +104,7 @@ function saveObjects() {
       position: [wgs84X, wgs84Y, height],
       heading: heading,
       scale: m.model.model.scale.getValue(),
+      fromCatalog:  m.fromCatalog,
     });
   }
   outputObject.placedObjects = outputArray;
@@ -127,7 +130,7 @@ function saveFile(fileName, urlFile){
 }
 
 
-function setupModel(vcsApp, windowPos, url, name) {
+function setupModel(vcsApp, windowPos, url, name, fromCatalog) {
   const vcMap = vcsApp.maps.activeMap;
   const scene = vcMap.getScene();
   const ray = scene.camera.getPickRay(windowPos);
@@ -141,6 +144,7 @@ function setupModel(vcsApp, windowPos, url, name) {
       show: true,
       scale: 1,
     },
+    fromCatalog: fromCatalog,
   });
   placedModels.push({
     model: model,
@@ -351,6 +355,20 @@ export default function smartVillagesPlugin(config, baseUrl) {
               }
             }
             if (objectUrl === undefined) {
+              console.log("From Catalog:" + loadingObject.fromCatalog);
+              if (loadingObject.fromCatalog === true){
+                // TODO: Fetch from catalog
+                objectUrl = loadingObject.uri;
+                // Load the model into memory
+                loadCatalogModel(objectUrl).catch(e => {
+                  console.error(e);
+                  app.notifier.add({
+                    type: NotificationType.ERROR,
+                    message: "Katalogobject: " + loadingObject.name + " konnte nicht geladenen werden. Konfiguration konnte nicht vollständig geladen werden.",
+                  });
+                });
+                return;
+              }else {
                 app.notifier.add({
                   type: NotificationType.ERROR,
                   message: "Objekt mit dem namen: " + loadingObject.name + " konnte nicht in den geladenen Objekten gefunden werden. Konfiguration konnte nicht vollständig geladen werden.",
@@ -358,6 +376,7 @@ export default function smartVillagesPlugin(config, baseUrl) {
                 // abort
                 return;
               }
+            }
             const cartPos = Cartesian3.fromDegrees(loadingObject.position[0], loadingObject.position[1], loadingObject.position[2]);
             // Add the model to the viewer
             model = vcMap.getEntities().add({
@@ -368,6 +387,7 @@ export default function smartVillagesPlugin(config, baseUrl) {
                 scale: loadingObject.scale,
                 show: true,
               },
+              fromCatalog: loadingObject.fromCatalog,
             });
             const roll = new HeadingPitchRoll();
             hpRollMap.set(model, roll);

src/objectList.vue

@@ -7,7 +7,7 @@
       </template>
       <template #default>
         <v-expansion-panels multiple>
-          <VcsExpansionPanel v-for = "(subcats, categoryName) in objLib" :key="categoryName" :heading="categoryName" value="opened">
+          <VcsExpansionPanel v-for = "(subcats, categoryName) in objLib" :key="categoryName" :heading="categoryName">
             <v-container v-for="(entries, subCategory) in subcats" :key = "subCategory" class=" py-1 px-1 border-b-md">
               <v-col>
               <VcsLabel class="mb-4 text-h2">{{subCategory}}</VcsLabel>
@@ -210,13 +210,29 @@ function getCatalogueEntries(json, linkPrefix) {
   }
 
 async function retrieveCatalogModel(modelLink){
-  if(preloadedModels.value[modelLink] != null){
-    const catModel = preloadedModels.value[modelLink];
+  loadCatalogModel(modelLink).then(model => {
+    const catModel = model;
     const x = window.innerWidth / 2;
     const y = window.innerHeight / 2;
     const cart = new Cartesian2(x, y);
-    setupModelFunction(app, cart, catModel.url, catModel.modelLink);
-  } else {
+    setupModelFunction(app, cart, catModel.url, catModel.modelLink, true);
+  }).catch(error => {
+    console.error(error);
+    app.notifier.add({
+      type: NotificationType.ERROR,
+      message:
+          'Ein Fehler ist beim Laden des Katalogobjektes aufgetreten.',
+      timeout: 20000,
+    });
+  });
+}
+
+export async function loadCatalogModel(modelLink){
+  return new Promise( (resolve, reject) => {
+    if(preloadedModels.value[modelLink] != null){
+      resolve(preloadedModels.value[modelLink]);
+    } else{
+      //Todo: parse model from catalog
       const loader = new GLTFLoader();
       loader.load(
           modelLink,
@@ -243,38 +259,25 @@ async function retrieveCatalogModel(modelLink){
                     name: modelLink,
                     url: url,
                   });
-                const x = window.innerWidth / 2;
-                const y = window.innerHeight / 2;
-                const cart = new Cartesian2(x, y);
-                setupModelFunction(app, cart, url, modelLink);
                   preloadedModels.value[modelLink] = {
                     url: url,
                     modelLink: modelLink,
                   };
+                  resolve(preloadedModels.value[modelLink]);
                 },
                 function (error) {
-                app.notifier.add({
-                  type: NotificationType.ERROR,
-                  message:
-                      'Ein Fehler ist beim Laden der glTF Datei aufgetreten. Bitte vergewissern Sie sich, dass es sich um eine gültige glTF2.0 Datei handelt.',
-                  timeout: 20000,
-                });
+                  reject(error);
                 },
                 options
             );
           },
           undefined,
           function (error) {
-          app.notifier.add({
-            type: NotificationType.ERROR,
-            message:
-                'Ein Fehler ist beim Laden der glTF Datei aufgetreten. Bitte vergewissern Sie sich, dass es sich um eine gültige glTF2.0 Datei handelt.' +
-                ' Fehlermeldung: ' + error.message,
-            timeout: 20000,
-          });
+            reject(error);
           }
       );
     }
+  })
 }
 
 function uploadModel() {
@@ -336,7 +339,7 @@ function uploadModel() {
                   const x = window.innerWidth / 2;
                   const y = window.innerHeight / 2;
                   const cart = new Cartesian2(x, y);
-                  setupModelFunction(app, cart, url, name);
+                  setupModelFunction(app, cart, url, name, false);
                 },
               }
             ]