@abi-software/scaffoldvuer 1.6.0-beta.1 → 1.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/scaffoldvuer.js +1873 -1854
- package/dist/scaffoldvuer.umd.cjs +3 -3
- package/dist/style.css +1 -1
- package/package.json +2 -2
- package/src/App.vue +1 -1
- package/src/components/ScaffoldTreeControls.vue +6 -0
- package/src/components/ScaffoldVuer.vue +82 -37
- package/src/scripts/Search.js +60 -70
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@abi-software/scaffoldvuer",
|
|
3
|
-
"version": "1.6.0
|
|
3
|
+
"version": "1.6.0",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
"*.js"
|
|
42
42
|
],
|
|
43
43
|
"dependencies": {
|
|
44
|
-
"@abi-software/map-utilities": "^1.2.0
|
|
44
|
+
"@abi-software/map-utilities": "^1.2.0",
|
|
45
45
|
"@abi-software/sparc-annotation": "^0.3.1",
|
|
46
46
|
"@abi-software/svg-sprite": "^1.0.1",
|
|
47
47
|
"@element-plus/icons-vue": "^2.3.1",
|
package/src/App.vue
CHANGED
|
@@ -142,6 +142,12 @@ export default {
|
|
|
142
142
|
isRegion: true,
|
|
143
143
|
};
|
|
144
144
|
this.addTreeItem(data.children, childRegionItem, region);
|
|
145
|
+
//Special case for helper region
|
|
146
|
+
if (path === "/_helper") {
|
|
147
|
+
this.$nextTick(() => {
|
|
148
|
+
this.$refs.treeControls.$refs.regionTree.setChecked(childRegionItem.id, false);
|
|
149
|
+
});
|
|
150
|
+
}
|
|
145
151
|
}
|
|
146
152
|
_paths.shift();
|
|
147
153
|
return this.findOrCreateRegion(childRegionItem, _paths, path);
|
|
@@ -823,6 +823,11 @@ export default {
|
|
|
823
823
|
centre: [0, 0, 0],
|
|
824
824
|
size:[1, 1, 1],
|
|
825
825
|
},
|
|
826
|
+
lastSelected: markRaw({
|
|
827
|
+
region: "",
|
|
828
|
+
group: "",
|
|
829
|
+
isSearch: false,
|
|
830
|
+
})
|
|
826
831
|
};
|
|
827
832
|
},
|
|
828
833
|
watch: {
|
|
@@ -1327,6 +1332,7 @@ export default {
|
|
|
1327
1332
|
toggleDrawing: function (type, icon) {
|
|
1328
1333
|
this.createData.toBeDeleted = false;
|
|
1329
1334
|
if (type === 'mode') {
|
|
1335
|
+
this.cancelCreate()
|
|
1330
1336
|
this.activeDrawMode = icon;
|
|
1331
1337
|
this.createData.shape = '';
|
|
1332
1338
|
this.$module.selectObjectOnPick = true;
|
|
@@ -1549,7 +1555,6 @@ export default {
|
|
|
1549
1555
|
} else {
|
|
1550
1556
|
if (this.$refs.scaffoldTreeControls) {
|
|
1551
1557
|
if (names.length > 0) {
|
|
1552
|
-
//this.$refs.scaffoldTreeControls.changeActiveByNames(names, region, false);
|
|
1553
1558
|
this.$refs.scaffoldTreeControls.updateActiveUI(zincObjects);
|
|
1554
1559
|
this.updatePrimitiveControls(zincObjects);
|
|
1555
1560
|
} else {
|
|
@@ -1557,6 +1562,17 @@ export default {
|
|
|
1557
1562
|
this.$refs.scaffoldTreeControls.removeActive(false);
|
|
1558
1563
|
}
|
|
1559
1564
|
}
|
|
1565
|
+
//Store the following for state saving. Search will handle the case with more than 1
|
|
1566
|
+
//identifiers.
|
|
1567
|
+
if (event.identifiers.length === 1) {
|
|
1568
|
+
this.lastSelected.isSearch = false;
|
|
1569
|
+
this.lastSelected.region = event.identifiers[0].data.region;
|
|
1570
|
+
this.lastSelected.group = event.identifiers[0].data.group;
|
|
1571
|
+
} else if (event.identifiers.length === 0) {
|
|
1572
|
+
this.lastSelected.isSearch = false;
|
|
1573
|
+
this.lastSelected.region = "";
|
|
1574
|
+
this.lastSelected.group = "";
|
|
1575
|
+
}
|
|
1560
1576
|
/**
|
|
1561
1577
|
* Emit when an object is selected
|
|
1562
1578
|
* @arg {Object} "Identifier of selected objects"
|
|
@@ -1566,10 +1582,8 @@ export default {
|
|
|
1566
1582
|
} else if (event.eventType == 2) {
|
|
1567
1583
|
if (this.selectedObjects.length === 0) {
|
|
1568
1584
|
this.hideRegionTooltip();
|
|
1569
|
-
// const offsets = this.$refs.scaffoldContainer.getBoundingClientRect();
|
|
1570
1585
|
if (this.$refs.scaffoldTreeControls) {
|
|
1571
1586
|
if (names.length > 0) {
|
|
1572
|
-
//this.$refs.scaffoldTreeControls.changeHoverByNames(names, region, false);
|
|
1573
1587
|
this.$refs.scaffoldTreeControls.updateHoverUI(zincObjects);
|
|
1574
1588
|
} else {
|
|
1575
1589
|
this.$refs.scaffoldTreeControls.removeHover(true);
|
|
@@ -1581,7 +1595,9 @@ export default {
|
|
|
1581
1595
|
: event.identifiers[0].data.group;
|
|
1582
1596
|
if (event.identifiers[0].coords) {
|
|
1583
1597
|
this.tData.active = false;
|
|
1584
|
-
this.
|
|
1598
|
+
if (!this.annotationSidebar) {
|
|
1599
|
+
this.tData.visible = true;
|
|
1600
|
+
}
|
|
1585
1601
|
this.tData.label = id;
|
|
1586
1602
|
if (event.identifiers[0].data.region) {
|
|
1587
1603
|
this.tData.region = event.identifiers[0].data.region;
|
|
@@ -1931,7 +1947,6 @@ export default {
|
|
|
1931
1947
|
liveUpdates
|
|
1932
1948
|
);
|
|
1933
1949
|
} else {
|
|
1934
|
-
this.tData.visible = false;
|
|
1935
1950
|
const region = this.tData.region ? this.tData.region +"/" : "";
|
|
1936
1951
|
const annotationEntry = {
|
|
1937
1952
|
"featureId": region + this.tData.label,
|
|
@@ -1959,7 +1974,7 @@ export default {
|
|
|
1959
1974
|
changeViewingMode: function (modeName) {
|
|
1960
1975
|
if (this.$module) {
|
|
1961
1976
|
if (modeName) {
|
|
1962
|
-
this.viewingMode = modeName
|
|
1977
|
+
this.viewingMode = modeName;
|
|
1963
1978
|
}
|
|
1964
1979
|
if (this.viewingMode === "Annotation") {
|
|
1965
1980
|
let authenticated = false;
|
|
@@ -2088,9 +2103,15 @@ export default {
|
|
|
2088
2103
|
if (text === undefined || text === "" ||
|
|
2089
2104
|
((Array.isArray(text) && text.length === 0))
|
|
2090
2105
|
) {
|
|
2106
|
+
this.lastSelected.region = "";
|
|
2107
|
+
this.lastSelected.group = "";
|
|
2108
|
+
this.lastSelected.isSearch = true;
|
|
2091
2109
|
this.objectSelected([], true);
|
|
2092
2110
|
return false;
|
|
2093
2111
|
} else {
|
|
2112
|
+
this.lastSelected.region = "";
|
|
2113
|
+
this.lastSelected.group = text;
|
|
2114
|
+
this.lastSelected.isSearch = true;
|
|
2094
2115
|
const result = this.$_searchIndex.searchAndProcessResult(text);
|
|
2095
2116
|
const zincObjects = result.zincObjects;
|
|
2096
2117
|
if (zincObjects.length > 0) {
|
|
@@ -2150,26 +2171,42 @@ export default {
|
|
|
2150
2171
|
}
|
|
2151
2172
|
this.timeMax = this.$module.scene.getDuration();
|
|
2152
2173
|
},
|
|
2153
|
-
|
|
2154
|
-
|
|
2155
|
-
if (options) {
|
|
2156
|
-
|
|
2157
|
-
|
|
2158
|
-
|
|
2159
|
-
|
|
2160
|
-
|
|
2161
|
-
|
|
2162
|
-
|
|
2163
|
-
|
|
2164
|
-
|
|
2165
|
-
|
|
2166
|
-
|
|
2167
|
-
|
|
2168
|
-
this.$
|
|
2169
|
-
|
|
2170
|
-
|
|
2174
|
+
restoreSettings: function(options) {
|
|
2175
|
+
if (options) {
|
|
2176
|
+
if (options.viewport) {
|
|
2177
|
+
this.$module.scene
|
|
2178
|
+
.getZincCameraControls()
|
|
2179
|
+
.setCurrentCameraSettings(options.viewport);
|
|
2180
|
+
} else if (options.viewURL && options.viewURL !== "") {
|
|
2181
|
+
const url = new URL(options.viewURL, this.url);
|
|
2182
|
+
this.$module.scene.loadViewURL(url);
|
|
2183
|
+
} else if (options.region && options.region !== "") {
|
|
2184
|
+
this.viewRegion(options.region);
|
|
2185
|
+
}
|
|
2186
|
+
if (options.visibility) {
|
|
2187
|
+
// Some UIs may not be ready at this time.
|
|
2188
|
+
this.$nextTick(() => {
|
|
2189
|
+
this.$refs.scaffoldTreeControls.setState(options.visibility);
|
|
2190
|
+
});
|
|
2191
|
+
}
|
|
2192
|
+
if (options.background) {
|
|
2193
|
+
this.backgroundChangeCallback(options.background);
|
|
2194
|
+
}
|
|
2195
|
+
if (options.viewingMode) {
|
|
2196
|
+
this.changeViewingMode(options.viewingMode);
|
|
2197
|
+
}
|
|
2198
|
+
const search = options.search;
|
|
2199
|
+
if (search && search.group) {
|
|
2200
|
+
if (search.isSearch) {
|
|
2201
|
+
this.search(search.group, true);
|
|
2202
|
+
} else {
|
|
2203
|
+
this.changeActiveByName(search.group, search.region, true);
|
|
2171
2204
|
}
|
|
2172
2205
|
}
|
|
2206
|
+
}
|
|
2207
|
+
},
|
|
2208
|
+
setURLFinishCallback: function (options) {
|
|
2209
|
+
return () => {
|
|
2173
2210
|
this.localAnnotationsList.length = 0;
|
|
2174
2211
|
this.updateSettingsfromScene();
|
|
2175
2212
|
this.$module.updateTime(0.01);
|
|
@@ -2191,6 +2228,7 @@ export default {
|
|
|
2191
2228
|
const {centre, size} = this.$module.getCentreAndSize();
|
|
2192
2229
|
this.boundingDims.centre = centre;
|
|
2193
2230
|
this.boundingDims.size = size;
|
|
2231
|
+
this.$nextTick(() => this.restoreSettings(options) );
|
|
2194
2232
|
this.isReady = true;
|
|
2195
2233
|
};
|
|
2196
2234
|
},
|
|
@@ -2206,6 +2244,8 @@ export default {
|
|
|
2206
2244
|
url: this._currentURL,
|
|
2207
2245
|
viewport: undefined,
|
|
2208
2246
|
visibility: undefined,
|
|
2247
|
+
background: this.currentBackground,
|
|
2248
|
+
viewingMode: this.viewingMode,
|
|
2209
2249
|
};
|
|
2210
2250
|
if (this.$refs.scaffoldTreeControls)
|
|
2211
2251
|
state.visibility = this.$refs.scaffoldTreeControls.getState();
|
|
@@ -2213,6 +2253,9 @@ export default {
|
|
|
2213
2253
|
let zincCameraControls = this.$module.scene.getZincCameraControls();
|
|
2214
2254
|
state.viewport = zincCameraControls.getCurrentViewport();
|
|
2215
2255
|
}
|
|
2256
|
+
if (this.lastSelected && this.lastSelected.group) {
|
|
2257
|
+
state.search = {...this.lastSelected};
|
|
2258
|
+
}
|
|
2216
2259
|
return state;
|
|
2217
2260
|
},
|
|
2218
2261
|
/**
|
|
@@ -2229,21 +2272,22 @@ export default {
|
|
|
2229
2272
|
fileFormat: state.fileFormat,
|
|
2230
2273
|
viewport: state.viewport,
|
|
2231
2274
|
visibility: state.visibility,
|
|
2275
|
+
background: state.background,
|
|
2276
|
+
viewingMode: this.viewingMode,
|
|
2277
|
+
search: state.search,
|
|
2232
2278
|
});
|
|
2233
2279
|
} else {
|
|
2234
|
-
if (state.viewport || state.visibility) {
|
|
2280
|
+
if (state.background || state.search || state.viewport || state.viewingMode || state.visibility) {
|
|
2235
2281
|
if (this.isReady && this.$module.scene) {
|
|
2236
|
-
|
|
2237
|
-
this.$module.scene
|
|
2238
|
-
.getZincCameraControls()
|
|
2239
|
-
.setCurrentCameraSettings(state.viewport);
|
|
2240
|
-
if (state.visibility)
|
|
2241
|
-
this.$refs.scaffoldTreeControls.setState(state.visibility);
|
|
2282
|
+
this.restoreSettings(state);
|
|
2242
2283
|
} else {
|
|
2243
2284
|
this.$module.setFinishDownloadCallback(
|
|
2244
2285
|
this.setURLFinishCallback({
|
|
2286
|
+
background: state.background,
|
|
2287
|
+
viewingMode: state.viewingMode,
|
|
2245
2288
|
viewport: state.viewport,
|
|
2246
2289
|
visibility: state.visibility,
|
|
2290
|
+
search: state.search,
|
|
2247
2291
|
})
|
|
2248
2292
|
);
|
|
2249
2293
|
}
|
|
@@ -2300,6 +2344,7 @@ export default {
|
|
|
2300
2344
|
});
|
|
2301
2345
|
}
|
|
2302
2346
|
},
|
|
2347
|
+
|
|
2303
2348
|
/**
|
|
2304
2349
|
* Function used for reading in new scaffold metadata and a custom
|
|
2305
2350
|
* viewport. This function will ignore the state prop and
|
|
@@ -2311,10 +2356,7 @@ export default {
|
|
|
2311
2356
|
*/
|
|
2312
2357
|
setURLAndState: function (newValue, state) {
|
|
2313
2358
|
if (newValue != this._currentURL) {
|
|
2314
|
-
if (state
|
|
2315
|
-
let viewport = state && state.viewport ? state.viewport : undefined;
|
|
2316
|
-
let visibility =
|
|
2317
|
-
state && state.visibility ? state.visibility : undefined;
|
|
2359
|
+
if (state?.format) this.fileFormat = state.format;
|
|
2318
2360
|
this._currentURL = newValue;
|
|
2319
2361
|
if (this.$refs.scaffoldTreeControls) this.$refs.scaffoldTreeControls.clear();
|
|
2320
2362
|
this.loading = true;
|
|
@@ -2324,10 +2366,13 @@ export default {
|
|
|
2324
2366
|
this.hideRegionTooltip();
|
|
2325
2367
|
this.$module.setFinishDownloadCallback(
|
|
2326
2368
|
this.setURLFinishCallback({
|
|
2327
|
-
|
|
2369
|
+
background: state?.background,
|
|
2328
2370
|
region: this.region,
|
|
2371
|
+
search: state?.search,
|
|
2372
|
+
viewingMode: state?.viewingMode,
|
|
2329
2373
|
viewURL: this.viewURL,
|
|
2330
|
-
|
|
2374
|
+
viewport: state?.viewport,
|
|
2375
|
+
visibility: state?.visibility,
|
|
2331
2376
|
})
|
|
2332
2377
|
);
|
|
2333
2378
|
if (this.fileFormat === "gltf") {
|
package/src/scripts/Search.js
CHANGED
|
@@ -44,60 +44,47 @@ export class SearchIndex
|
|
|
44
44
|
this._searchEngine = new MiniSearch({
|
|
45
45
|
fields: ['path', 'name'],
|
|
46
46
|
storeFields: ['path'],
|
|
47
|
-
tokenize: (string, _fieldName) => string.split(
|
|
47
|
+
tokenize: (string, _fieldName) => string.split(/[\s/]+/), // indexing tokenizer
|
|
48
48
|
});
|
|
49
|
-
this.
|
|
50
|
-
this.zincObjects = [];
|
|
51
|
-
this.regions = [];
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
indexMetadata(featureId, metadata)
|
|
55
|
-
//================================
|
|
56
|
-
{
|
|
57
|
-
const textSeen = [];
|
|
58
|
-
for (const prop of indexedProperties) {
|
|
59
|
-
if (prop in metadata) {
|
|
60
|
-
const text = metadata[prop];
|
|
61
|
-
if (!textSeen.includes(text)) {
|
|
62
|
-
this.addTerm_(featureId, text);
|
|
63
|
-
textSeen.push(text);
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
}
|
|
49
|
+
this.idMaps = {};
|
|
67
50
|
}
|
|
68
51
|
|
|
69
52
|
addZincObject(zincObject, id)
|
|
70
53
|
//=======================
|
|
71
54
|
{
|
|
72
55
|
const path = zincObject.getRegion().getFullPath();
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
56
|
+
let groupName = zincObject.groupName;
|
|
57
|
+
let fullPath = path ? `${path}/${zincObject.groupName}` : zincObject.groupName;
|
|
58
|
+
groupName = groupName.replaceAll('"', '');
|
|
59
|
+
fullPath = fullPath.replaceAll('"', '');
|
|
60
|
+
const item = { path: fullPath, name: groupName, id };
|
|
61
|
+
this._searchEngine.add(item);
|
|
62
|
+
this.idMaps[id] = { path: fullPath, zincObject };
|
|
77
63
|
}
|
|
78
64
|
|
|
79
65
|
removeZincObject(zincObject, id)
|
|
80
66
|
//=======================
|
|
81
67
|
{
|
|
82
68
|
const path = zincObject.getRegion().getFullPath();
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
|
|
69
|
+
let groupName = zincObject.groupName;
|
|
70
|
+
let fullPath = path ? `${path}/${zincObject.groupName}` : zincObject.groupName;
|
|
71
|
+
groupName = groupName.replaceAll('"', '');
|
|
72
|
+
fullPath = fullPath.replaceAll('"', '');
|
|
73
|
+
const item = { path: fullPath, name: groupName, id };
|
|
74
|
+
this._searchEngine.remove(item);
|
|
75
|
+
delete this.idMaps[id];
|
|
93
76
|
}
|
|
94
77
|
|
|
95
78
|
addRegion(region, id)
|
|
96
79
|
//=======================
|
|
97
80
|
{
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
81
|
+
let path = region.getFullPath();
|
|
82
|
+
let regionName = region.getName();
|
|
83
|
+
path = path.replaceAll('"', '');
|
|
84
|
+
regionName = regionName.replaceAll('"', '');
|
|
85
|
+
const item = { path, name: regionName, id };
|
|
86
|
+
this._searchEngine.add(item);
|
|
87
|
+
this.idMaps[id] = { path, zincObject: region };
|
|
101
88
|
}
|
|
102
89
|
|
|
103
90
|
clearResults()
|
|
@@ -110,17 +97,32 @@ export class SearchIndex
|
|
|
110
97
|
//=======================
|
|
111
98
|
{
|
|
112
99
|
this._searchEngine.removeAll();
|
|
113
|
-
this.zincObjects.length = 0;
|
|
114
|
-
this.regions.length = 0;
|
|
100
|
+
//this.zincObjects.length = 0;
|
|
101
|
+
//this.regions.length = 0;
|
|
102
|
+
this.idMaps = {};
|
|
115
103
|
}
|
|
116
104
|
|
|
117
|
-
auto_suggest(text)
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
105
|
+
auto_suggest(text) {
|
|
106
|
+
let results = [];
|
|
107
|
+
if (text.length > 2 && ["'", '"'].includes(text.slice(0, 1))) {
|
|
108
|
+
text = text.replaceAll(text.slice(0, 1), '')
|
|
109
|
+
results = this._searchEngine.search(text, {prefix: true, combineWith: 'AND'})
|
|
110
|
+
} else if (text.length > 1) {
|
|
111
|
+
results = this._searchEngine.search(text, {prefix: true})
|
|
112
|
+
}
|
|
113
|
+
const items = [];
|
|
114
|
+
results.forEach(r => {
|
|
115
|
+
if (r.id in this.idMaps) {
|
|
116
|
+
items.push(this.idMaps[r.id].path);
|
|
117
|
+
}
|
|
118
|
+
});
|
|
119
|
+
const unique = [...new Set(items)];
|
|
120
|
+
const returned = [];
|
|
121
|
+
unique.forEach(u => returned.push({suggestion: '"' + u + '"'}));
|
|
122
|
+
return returned;
|
|
122
123
|
}
|
|
123
124
|
|
|
125
|
+
|
|
124
126
|
processResults(zincObjects, searchText) {
|
|
125
127
|
const result = {
|
|
126
128
|
regionPath: undefined,
|
|
@@ -145,11 +147,21 @@ export class SearchIndex
|
|
|
145
147
|
}
|
|
146
148
|
|
|
147
149
|
search(text) {
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
150
|
+
let results = undefined;
|
|
151
|
+
if (text.length > 2 && ["'", '"'].includes(text.slice(0, 1))) {
|
|
152
|
+
text = text.replaceAll(text.slice(0, 1), '')
|
|
153
|
+
console.log(text)
|
|
154
|
+
results = this._searchEngine.search(text, {prefix: true, combineWith: 'AND'})
|
|
155
|
+
} else if (text.length > 1) {
|
|
156
|
+
results = this._searchEngine.search(text, {prefix: true})
|
|
157
|
+
}
|
|
158
|
+
const zincResults = [];
|
|
159
|
+
results.forEach(r => {
|
|
160
|
+
if (r.id in this.idMaps) {
|
|
161
|
+
zincResults.push(this.idMaps[r.id].zincObject);
|
|
162
|
+
}
|
|
163
|
+
});
|
|
164
|
+
return zincResults;
|
|
153
165
|
}
|
|
154
166
|
|
|
155
167
|
searchTerms(terms) {
|
|
@@ -174,25 +186,3 @@ export class SearchIndex
|
|
|
174
186
|
|
|
175
187
|
}
|
|
176
188
|
|
|
177
|
-
//==============================================================================
|
|
178
|
-
|
|
179
|
-
class SearchResults
|
|
180
|
-
{
|
|
181
|
-
constructor(results)
|
|
182
|
-
{
|
|
183
|
-
this.__results = results.sort((a, b) => (b.score - a.score));
|
|
184
|
-
this.__featureIds = results.map(r => r.featureId);
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
get featureIds()
|
|
188
|
-
{
|
|
189
|
-
return this.__featureIds;
|
|
190
|
-
}
|
|
191
|
-
|
|
192
|
-
get results()
|
|
193
|
-
{
|
|
194
|
-
return this.__results;
|
|
195
|
-
}
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
//==============================================================================
|