@abi-software/scaffoldvuer 1.6.0-beta.1 → 1.6.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/scaffoldvuer",
-  "version": "1.6.0-beta.1",
+  "version": "1.6.1",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -41,7 +41,7 @@
     "*.js"
   ],
   "dependencies": {
-    "@abi-software/map-utilities": "^1.2.0-beta.8",
+    "@abi-software/map-utilities": "^1.2.0",
     "@abi-software/sparc-annotation": "^0.3.1",
     "@abi-software/svg-sprite": "^1.0.1",
     "@element-plus/icons-vue": "^2.3.1",

package/src/App.vue

@@ -603,7 +603,7 @@ export default {
       }
       cb(
         this.$refs.scaffold.fetchSuggestions(term).map((item) => {
-          const value = item.terms.length > 1 ? item.terms[1] : item.terms[0];
+          const value = item.suggestion;
           return {
             value: value,
             label: value

package/src/components/ScaffoldTreeControls.vue

@@ -142,6 +142,12 @@ export default {
             isRegion: true,
           };
           this.addTreeItem(data.children, childRegionItem, region);
+          //Special case for helper region
+          if (path === "/_helper") {
+            this.$nextTick(() => {
+              this.$refs.treeControls.$refs.regionTree.setChecked(childRegionItem.id, false);
+            });
+          }
         }
         _paths.shift();
         return this.findOrCreateRegion(childRegionItem, _paths, path);

package/src/components/ScaffoldVuer.vue

@@ -823,6 +823,11 @@ export default {
         centre: [0, 0, 0],
         size:[1, 1, 1],
       },
+      lastSelected: markRaw({
+        region: "",
+        group: "",
+        isSearch: false,
+      })
     };
   },
   watch: {
@@ -1327,12 +1332,13 @@ export default {
     toggleDrawing: function (type, icon) {
       this.createData.toBeDeleted = false;
       if (type === 'mode') {
+        this.cancelCreate()
         this.activeDrawMode = icon;
         this.createData.shape = '';
         this.$module.selectObjectOnPick = true;
       } else if (type === 'tool') {
         this.activeDrawTool = icon;
-        this.createData.shape = this.activeDrawTool;
+        this.createData.shape = this.activeDrawTool ? this.activeDrawTool : '';
         this.$module.selectObjectOnPick = false;
       }
     },
@@ -1538,6 +1544,16 @@ export default {
           });
           zincObjects = event.zincObjects;
         }
+        let id = undefined;
+        let regionPath = undefined;
+        if (event.identifiers.length > 0 && event.identifiers[0]) {
+          id = event.identifiers[0].data.id
+                ? event.identifiers[0].data.id
+                : event.identifiers[0].data.group;
+          if (event.identifiers[0].data.region) {
+            regionPath = event.identifiers[0].data.region;
+          }
+        }
         /*
         * Event Type 1: Selected
         * Event Type 2: Highlighted
@@ -1545,11 +1561,12 @@ export default {
         */
         if (event.eventType == 1) {
           if (this.viewingMode === 'Annotation') {
+            this.tData.label = id;
+            this.tData.region = regionPath;
             this.activateAnnotationMode(names, event);
           } else {
             if (this.$refs.scaffoldTreeControls) {
               if (names.length > 0) {
-                //this.$refs.scaffoldTreeControls.changeActiveByNames(names, region, false);
                 this.$refs.scaffoldTreeControls.updateActiveUI(zincObjects);
                 this.updatePrimitiveControls(zincObjects);
               } else {
@@ -1557,6 +1574,17 @@ export default {
                 this.$refs.scaffoldTreeControls.removeActive(false);
               }
             }
+            //Store the following for state saving. Search will handle the case with more than 1
+            //identifiers.
+            if (event.identifiers.length === 1) {
+              this.lastSelected.isSearch = false;
+              this.lastSelected.region = regionPath;
+              this.lastSelected.group = event.identifiers[0].data.group;
+            } else if (event.identifiers.length === 0) {
+              this.lastSelected.isSearch = false;
+              this.lastSelected.region = "";
+              this.lastSelected.group = "";
+            }
             /**
              * Emit when an object is selected
              * @arg {Object} "Identifier of selected objects"
@@ -1566,29 +1594,21 @@ export default {
         } else if (event.eventType == 2) {
           if (this.selectedObjects.length === 0) {
             this.hideRegionTooltip();
-            // const offsets = this.$refs.scaffoldContainer.getBoundingClientRect();
             if (this.$refs.scaffoldTreeControls) {
               if (names.length > 0) {
-                //this.$refs.scaffoldTreeControls.changeHoverByNames(names, region, false);
                 this.$refs.scaffoldTreeControls.updateHoverUI(zincObjects);
               } else {
                 this.$refs.scaffoldTreeControls.removeHover(true);
               }
             }
             if (event.identifiers.length > 0 && event.identifiers[0]) {
-              let id = event.identifiers[0].data.id
-                ? event.identifiers[0].data.id
-                : event.identifiers[0].data.group;
               if (event.identifiers[0].coords) {
                 this.tData.active = false;
-                this.tData.visible = true;
-                this.tData.label = id;
-                if (event.identifiers[0].data.region) {
-                  this.tData.region = event.identifiers[0].data.region;
-                }
-                else {
-                  this.tData.region = undefined;
+                if (!this.viewingMode !== "Annotation" ||  !this.annotationSidebar) {
+                  this.tData.visible = true;
                 }
+                this.tData.label = id;
+                this.tData.region = regionPath;
                 this.tData.x = event.identifiers[0].coords.x;
                 this.tData.y = event.identifiers[0].coords.y;
                 this.createEditTemporaryLines(event.identifiers);
@@ -1931,7 +1951,6 @@ export default {
               liveUpdates
             );
           } else {
-            this.tData.visible = false;
             const region = this.tData.region ? this.tData.region +"/" : "";
             const annotationEntry = {
               "featureId": region + this.tData.label,
@@ -1959,7 +1978,7 @@ export default {
     changeViewingMode: function (modeName) {
       if (this.$module) {
         if (modeName) {
-          this.viewingMode = modeName
+          this.viewingMode = modeName;
         }
         if (this.viewingMode === "Annotation") {
           let authenticated = false;
@@ -2088,9 +2107,15 @@ export default {
         if (text === undefined || text === "" ||
           ((Array.isArray(text) && text.length === 0))
         ) {
+          this.lastSelected.region = "";
+          this.lastSelected.group = "";
+          this.lastSelected.isSearch = true;
           this.objectSelected([], true);
           return false;
         } else {
+          this.lastSelected.region = "";
+          this.lastSelected.group = text;
+          this.lastSelected.isSearch = true;
           const result = this.$_searchIndex.searchAndProcessResult(text);
           const zincObjects = result.zincObjects;
           if (zincObjects.length > 0) {
@@ -2150,26 +2175,42 @@ export default {
       }
       this.timeMax = this.$module.scene.getDuration();
     },
-    setURLFinishCallback: function (options) {
-      return () => {
-        if (options) {
-          if (options.viewport) {
-            this.$module.scene
-              .getZincCameraControls()
-              .setCurrentCameraSettings(options.viewport);
-          } else if (options.viewURL && options.viewURL !== "") {
-            const url = new URL(options.viewURL, this.url);
-            this.$module.scene.loadViewURL(url);
-          } else if (options.region && options.region !== "") {
-            this.viewRegion(options.region);
-          }
-          if (options.visibility) {
-            // Some UIs may not be ready at this time.
-            this.$nextTick(() => {
-              this.$refs.scaffoldTreeControls.setState(options.visibility);
-            });
+    restoreSettings: function(options) {
+      if (options) {
+        if (options.viewport) {
+          this.$module.scene
+            .getZincCameraControls()
+            .setCurrentCameraSettings(options.viewport);
+        } else if (options.viewURL && options.viewURL !== "") {
+          const url = new URL(options.viewURL, this.url);
+          this.$module.scene.loadViewURL(url);
+        } else if (options.region && options.region !== "") {
+          this.viewRegion(options.region);
+        }
+        if (options.visibility) {
+          // Some UIs may not be ready at this time.
+          this.$nextTick(() => {
+            this.$refs.scaffoldTreeControls.setState(options.visibility);
+          });
+        }
+        if (options.background) {
+          this.backgroundChangeCallback(options.background);
+        }
+        if (options.viewingMode) {
+          this.changeViewingMode(options.viewingMode);
+        }
+        const search = options.search;
+        if (search && search.group) {
+          if (search.isSearch) {
+            this.search(search.group, true);
+          } else {
+            this.changeActiveByName(search.group, search.region, true);
           }
         }
+      }
+    },
+    setURLFinishCallback: function (options) {
+      return () => {
         this.localAnnotationsList.length = 0;
         this.updateSettingsfromScene();
         this.$module.updateTime(0.01);
@@ -2191,6 +2232,7 @@ export default {
         const {centre, size} = this.$module.getCentreAndSize();
         this.boundingDims.centre = centre;
         this.boundingDims.size = size;
+        this.$nextTick(() => this.restoreSettings(options) );
         this.isReady = true;
       };
     },
@@ -2206,6 +2248,8 @@ export default {
         url: this._currentURL,
         viewport: undefined,
         visibility: undefined,
+        background: this.currentBackground,
+        viewingMode: this.viewingMode,
       };
       if (this.$refs.scaffoldTreeControls)
         state.visibility = this.$refs.scaffoldTreeControls.getState();
@@ -2213,6 +2257,9 @@ export default {
         let zincCameraControls = this.$module.scene.getZincCameraControls();
         state.viewport = zincCameraControls.getCurrentViewport();
       }
+      if (this.lastSelected && this.lastSelected.group) {
+        state.search = {...this.lastSelected};
+      }
       return state;
     },
     /**
@@ -2229,21 +2276,22 @@ export default {
             fileFormat: state.fileFormat,
             viewport: state.viewport,
             visibility: state.visibility,
+            background: state.background,
+            viewingMode: this.viewingMode,
+            search: state.search,
           });
         } else {
-          if (state.viewport || state.visibility) {
+          if (state.background || state.search || state.viewport || state.viewingMode || state.visibility) {
             if (this.isReady && this.$module.scene) {
-              if (state.viewport)
-                this.$module.scene
-                  .getZincCameraControls()
-                  .setCurrentCameraSettings(state.viewport);
-              if (state.visibility)
-                this.$refs.scaffoldTreeControls.setState(state.visibility);
+              this.restoreSettings(state);
             } else {
               this.$module.setFinishDownloadCallback(
                 this.setURLFinishCallback({
+                  background: state.background,
+                  viewingMode: state.viewingMode,
                   viewport: state.viewport,
                   visibility: state.visibility,
+                  search: state.search,
                 })
               );
             }
@@ -2300,6 +2348,7 @@ export default {
         });
       }
     },
+
     /**
      * Function used for reading in new scaffold metadata and a custom
      * viewport. This function will ignore the state prop and
@@ -2311,10 +2360,7 @@ export default {
      */
     setURLAndState: function (newValue, state) {
       if (newValue != this._currentURL) {
-        if (state && state.format) this.fileFormat = state.format;
-        let viewport = state && state.viewport ? state.viewport : undefined;
-        let visibility =
-          state && state.visibility ? state.visibility : undefined;
+        if (state?.format) this.fileFormat = state.format;
         this._currentURL = newValue;
         if (this.$refs.scaffoldTreeControls) this.$refs.scaffoldTreeControls.clear();
         this.loading = true;
@@ -2324,10 +2370,13 @@ export default {
         this.hideRegionTooltip();
         this.$module.setFinishDownloadCallback(
           this.setURLFinishCallback({
-            viewport: viewport,
+            background: state?.background,
             region: this.region,
+            search: state?.search,
+            viewingMode: state?.viewingMode,
             viewURL: this.viewURL,
-            visibility: visibility,
+            viewport: state?.viewport,
+            visibility: state?.visibility,
           })
         );
         if (this.fileFormat === "gltf") {

package/src/scripts/Search.js

@@ -44,60 +44,47 @@ export class SearchIndex
         this._searchEngine =  new MiniSearch({
             fields: ['path', 'name'],
             storeFields: ['path'],
-            tokenize: (string, _fieldName) => string.split('"'), // indexing tokenizer
+            tokenize: (string, _fieldName) => string.split(/[\s/]+/), // indexing tokenizer
         });
-        this._featureIds = [];
-        this.zincObjects = [];
-        this.regions = [];
-    }
-
-    indexMetadata(featureId, metadata)
-    //================================
-    {
-        const textSeen = [];
-        for (const prop of indexedProperties) {
-            if (prop in metadata) {
-                const text = metadata[prop];
-                if (!textSeen.includes(text)) {
-                    this.addTerm_(featureId, text);
-                    textSeen.push(text);
-                }
-            }
-        }
+        this.idMaps = {};
     }
 
     addZincObject(zincObject, id)
     //=======================
     {
         const path = zincObject.getRegion().getFullPath();
-        const fullPath = path ? `${path}/${zincObject.groupName}` : zincObject.groupName;
-        const item = { path: fullPath, name: zincObject.groupName, id };
-        this._searchEngine.add(item, {fields: ['path', 'name']});
-        this.zincObjects.push(zincObject);
+        let groupName = zincObject.groupName;
+        let fullPath = path ? `${path}/${zincObject.groupName}` : zincObject.groupName;
+        groupName = groupName.replaceAll('"', '');
+        fullPath = fullPath.replaceAll('"', '');
+        const item = { path: fullPath, name: groupName, id };
+        this._searchEngine.add(item);
+        this.idMaps[id] = { path: fullPath, zincObject };
     }
 
     removeZincObject(zincObject, id)
     //=======================
     {
         const path = zincObject.getRegion().getFullPath();
-        const fullPath = path ? `${path}/${zincObject.groupName}` : zincObject.groupName;
-        const item = { path: fullPath, name: zincObject.groupName, id };
-        this._searchEngine.remove(item, {fields: ['path', 'name']});
-        for (let i = 0; i < this.zincObjects.length; i++) {
-          if (id === this.zincObjects[i].uuid) {
-            this.zincObjects.splice(i, 1);
-            return;
-          }
-        }
-        
+        let groupName = zincObject.groupName;
+        let fullPath = path ? `${path}/${zincObject.groupName}` : zincObject.groupName;
+        groupName = groupName.replaceAll('"', '');
+        fullPath = fullPath.replaceAll('"', '');
+        const item = { path: fullPath, name: groupName, id };
+        this._searchEngine.remove(item);
+        delete this.idMaps[id];
     }
 
     addRegion(region, id)
     //=======================
     {
-        const item = { path: region.getFullPath(), name: region.getName(), id };
-        this._searchEngine.add(item, {fields: ['path', 'name']});
-        this.regions.push(region);
+        let path = region.getFullPath();
+        let regionName = region.getName();
+        path = path.replaceAll('"', '');
+        regionName = regionName.replaceAll('"', '');
+        const item = { path, name: regionName, id };
+        this._searchEngine.add(item);
+        this.idMaps[id] = { path, zincObject: region };
     }
 
     clearResults()
@@ -110,17 +97,32 @@ export class SearchIndex
     //=======================
     {
         this._searchEngine.removeAll();
-        this.zincObjects.length = 0;
-        this.regions.length = 0;
+        //this.zincObjects.length = 0;
+        //this.regions.length = 0;
+        this.idMaps = {};
     }
 
-    auto_suggest(text)
-    //================
-    {
-        const results = this._searchEngine.autoSuggest(text, {prefix: true});
-        return results;
+    auto_suggest(text) {
+      let results = [];
+      if (text.length > 2 && ["'", '"'].includes(text.slice(0, 1))) {
+        text = text.replaceAll(text.slice(0, 1), '')
+        results = this._searchEngine.search(text, {prefix: true, combineWith: 'AND'})
+      } else if (text.length > 1) {
+          results = this._searchEngine.search(text, {prefix: true})
+      }
+      const items = [];
+      results.forEach(r => {
+        if (r.id in this.idMaps) {
+          items.push(this.idMaps[r.id].path);
+        }
+      });
+      const unique = [...new Set(items)];
+      const returned = [];
+      unique.forEach(u => returned.push({suggestion: '"' + u + '"'}));
+      return returned;
     }
 
+
     processResults(zincObjects, searchText) {
       const result = {
         regionPath: undefined,
@@ -145,11 +147,20 @@ export class SearchIndex
     }
 
     search(text) {
-        const results = this._searchEngine.search(text, {prefix: true});
-        const zincResults = this.zincObjects.filter(zincObject => results.map(r => r.id).includes(zincObject.uuid));
-        const regionResults = this.regions.filter(region => results.map(r => r.id).includes(region.uuid));
-        zincResults.push(...regionResults);
-        return zincResults;
+      let results = undefined;
+      if (text.length > 2 && ["'", '"'].includes(text.slice(0, 1))) {
+          text = text.replaceAll(text.slice(0, 1), '')
+          results = this._searchEngine.search(text, {prefix: true, combineWith: 'AND'})
+      } else if (text.length > 1) {
+          results = this._searchEngine.search(text, {prefix: true})
+      }
+      const zincResults = [];
+      results.forEach(r => {
+        if (r.id in this.idMaps) {
+          zincResults.push(this.idMaps[r.id].zincObject);
+        }
+      });
+      return zincResults;
     }
 
     searchTerms(terms) {
@@ -174,25 +185,3 @@ export class SearchIndex
 
 }
 
-//==============================================================================
-
-class SearchResults
-{
-    constructor(results)
-    {
-        this.__results = results.sort((a, b) => (b.score - a.score));
-        this.__featureIds = results.map(r => r.featureId);
-    }
-
-    get featureIds()
-    {
-        return this.__featureIds;
-    }
-
-    get results()
-    {
-        return this.__results;
-    }
-}
-
-//==============================================================================