@abi-software/scaffoldvuer 0.2.3-alpha-2 → 0.3.1
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/.eslintrc.js +12 -12
- package/CHANGELOG.md +344 -316
- package/LICENSE +201 -201
- package/README.md +164 -164
- package/babel.config.js +14 -14
- package/dist/scaffoldvuer-wc.common.js +277 -34
- package/dist/scaffoldvuer-wc.umd.js +277 -34
- package/dist/scaffoldvuer-wc.umd.min.js +277 -34
- package/dist/scaffoldvuer.common.js +1252 -529
- package/dist/scaffoldvuer.common.js.map +1 -1
- package/dist/scaffoldvuer.css +1 -1
- package/dist/scaffoldvuer.umd.js +1252 -529
- package/dist/scaffoldvuer.umd.js.map +1 -1
- package/dist/scaffoldvuer.umd.min.js +1 -1
- package/dist/scaffoldvuer.umd.min.js.map +1 -1
- package/package-lock.json +18121 -18119
- package/package.json +89 -89
- package/public/index.html +17 -17
- package/src/App.vue +669 -669
- package/src/ScaffoldVuer-wc.js +13 -13
- package/src/app/DropZone.vue +114 -114
- package/src/app/ModelsInformation.js +35 -35
- package/src/app/ModelsTable.vue +113 -113
- package/src/app/TextureDemos.js +114 -114
- package/src/assets/_variables.scss +43 -43
- package/src/assets/styles.scss +7 -7
- package/src/components/OpacityControls.vue +123 -222
- package/src/components/PrimitiveControls.vue +173 -0
- package/src/components/ScaffoldTooltip.vue +142 -142
- package/src/components/ScaffoldVuer.md +44 -44
- package/src/components/ScaffoldVuer.vue +2007 -2007
- package/src/components/TextureSlidesControls.vue +272 -0
- package/src/components/TreeControls.vue +707 -699
- package/src/components/index.js +7 -7
- package/src/credential.json +12 -0
- package/src/main.js +14 -14
- package/src/scripts/BaseModule.js +80 -80
- package/src/scripts/RendererModule.js +289 -289
- package/src/scripts/WebGL.js +94 -94
- package/src/scripts/annotation.js +5 -5
- package/src/scripts/eventNotifier.js +66 -66
- package/src/scripts/graphicsHighlight.js +134 -134
- package/src/scripts/organsRenderer.js +587 -587
- package/src/scripts/search.js +182 -182
- package/src/scripts/utilities.js +146 -146
- package/styleguide.config.js +22 -22
- package/vue.config.js +41 -41
- package/src/components/test.pdf +0 -0
- package/src/searchControls.vue +0 -122
package/README.md
CHANGED
|
@@ -1,164 +1,164 @@
|
|
|
1
|
-
# Scaffoldvuer
|
|
2
|
-
|
|
3
|
-
This project aims to provide high-level 3D physiological models viewing capability.
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
## Scaffoldvuer on NPM
|
|
7
|
-
|
|
8
|
-
Scaffoldvuer is available on npm and can be installed into your project with the following command:
|
|
9
|
-
```bash
|
|
10
|
-
npm i @abi-software/scaffoldvuer
|
|
11
|
-
```
|
|
12
|
-
|
|
13
|
-
## Project setup
|
|
14
|
-
```
|
|
15
|
-
npm install
|
|
16
|
-
```
|
|
17
|
-
|
|
18
|
-
### Compiles and minifies for production
|
|
19
|
-
```
|
|
20
|
-
npm run build-bundle
|
|
21
|
-
```
|
|
22
|
-
|
|
23
|
-
## How to use
|
|
24
|
-
Install the package in your vue app project with the following command "npm i @abi-software/scaffoldvuer".
|
|
25
|
-
Import the package in your script as followed:
|
|
26
|
-
```javascript
|
|
27
|
-
import { ScaffoldVuer } from '@abi-software/scaffoldvuer';
|
|
28
|
-
import '@abi-software/scaffoldvuer/dist/scaffoldvuer.css';
|
|
29
|
-
```
|
|
30
|
-
Local registration in vue component:
|
|
31
|
-
```javascript
|
|
32
|
-
export default {
|
|
33
|
-
...
|
|
34
|
-
components: {
|
|
35
|
-
ScaffoldVuer,
|
|
36
|
-
}
|
|
37
|
-
...
|
|
38
|
-
}
|
|
39
|
-
```
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
The codes above register the ScaffoldVuer component in the global scope.
|
|
43
|
-
You can now use the ScaffoldVuer in your vue template as followed:
|
|
44
|
-
```html
|
|
45
|
-
<ScaffoldVuer url="Metafile.json" v-on:scaffold-selected="ScaffoldSelected" style="height:50%"/>
|
|
46
|
-
```
|
|
47
|
-
|
|
48
|
-
url should be a variable/string containing the url of a compatible json model.
|
|
49
|
-
scaffold-selected is the custom event triggered when a part of the 3D-scaffold is selected, see below for a
|
|
50
|
-
sample callback.
|
|
51
|
-
|
|
52
|
-
```javascript
|
|
53
|
-
methods: {
|
|
54
|
-
ScaffoldSelected: function(annotation) {
|
|
55
|
-
console.log(annotation);
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
```
|
|
59
|
-
A more in depth API reference can be found here: https://abi-software.github.io/scaffoldvuer/ .
|
|
60
|
-
|
|
61
|
-
## Project setup from Github
|
|
62
|
-
|
|
63
|
-
The source code is available from Github, it can be found here: https://github.com/ABI-Software/scaffoldvuer .
|
|
64
|
-
|
|
65
|
-
### Clone the respositroy
|
|
66
|
-
```bash
|
|
67
|
-
git clone https://github.com/ABI-Software/scaffoldvuer.git
|
|
68
|
-
```
|
|
69
|
-
|
|
70
|
-
### Setup
|
|
71
|
-
```bash
|
|
72
|
-
npm install
|
|
73
|
-
```
|
|
74
|
-
|
|
75
|
-
### Compiles and minifies for production
|
|
76
|
-
```bash
|
|
77
|
-
npm run build-bundle
|
|
78
|
-
```
|
|
79
|
-
|
|
80
|
-
### Run the sample application
|
|
81
|
-
```bash
|
|
82
|
-
npm run serve
|
|
83
|
-
```
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
## Example
|
|
87
|
-
The following example showcases ScaffoldVuer in action: https://mapcore-demo.org/current/scaffoldvuer/
|
|
88
|
-
|
|
89
|
-
## Scaffoldvuer release process:
|
|
90
|
-
|
|
91
|
-
### Versioning
|
|
92
|
-
|
|
93
|
-
Scaffoldvuer uses [semantic versioning](https://semver.org/).
|
|
94
|
-
|
|
95
|
-
If any changes are experimental or parallel to the main development, [npm dist tags](https://docs.npmjs.com/cli/v9/commands/npm-dist-tag) are used to keep this version from being the default when `npm install @abi-software/scaffoldvuer` is used.
|
|
96
|
-
|
|
97
|
-
Dist tags can be used like so:
|
|
98
|
-
```
|
|
99
|
-
npm publish --tag <tag>
|
|
100
|
-
```
|
|
101
|
-
|
|
102
|
-
`<tag>` is the dist tag to add. In example: `npm publish --tag beta`
|
|
103
|
-
|
|
104
|
-
### Publishing
|
|
105
|
-
|
|
106
|
-
#### 1. Update the package number in [package.json](https://github.com/ABI-Software/scaffoldvuer/blob/main/package.json)
|
|
107
|
-
#### 2. Bundles for scaffoldvuer can be built by using
|
|
108
|
-
```
|
|
109
|
-
npm run build-bundle
|
|
110
|
-
```
|
|
111
|
-
|
|
112
|
-
This builds the package to be digested by other vue packages by importing either the build or the source.
|
|
113
|
-
|
|
114
|
-
##### Build import
|
|
115
|
-
```
|
|
116
|
-
import { ScaffoldVuer } from "@abi-software/scaffoldvuer";
|
|
117
|
-
import '@abi-software/scaffoldvuer/dist/map-side-bar.css';
|
|
118
|
-
```
|
|
119
|
-
|
|
120
|
-
##### Source import (used in [abi-software/mapintegratedvuer](https://github.com/abi-Software/mapintegratedvuer))
|
|
121
|
-
```
|
|
122
|
-
import { ScaffoldVuer } from "@abi-software/scaffoldvuer/src/components/index.js";
|
|
123
|
-
```
|
|
124
|
-
|
|
125
|
-
#### 3. Publish with `npm publish` in the package directory
|
|
126
|
-
|
|
127
|
-
### Testing
|
|
128
|
-
|
|
129
|
-
#### Testing [`zincjs`](https://github.com/alan-wu/ZincJS)
|
|
130
|
-
Check that the version of zincjs used is running correctly and passing the tests.
|
|
131
|
-
|
|
132
|
-
Test runs can be found here:
|
|
133
|
-
https://autotest.bioeng.auckland.ac.nz/jenkins/blue/organizations/jenkins/ZincJS/activity
|
|
134
|
-
|
|
135
|
-
Click on the latest test and search for `zincjs@` to find the zincjs version number.
|
|
136
|
-
|
|
137
|
-
#### Visual check
|
|
138
|
-
Open the links below, checking that they load in, render correctly and are usable:
|
|
139
|
-
|
|
140
|
-
Region
|
|
141
|
-
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/MyExport_metadata.json
|
|
142
|
-
|
|
143
|
-
Glyph small
|
|
144
|
-
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/TimeGlyphs/timeGlyphs_1.json
|
|
145
|
-
|
|
146
|
-
Lines
|
|
147
|
-
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/Lines/lines_metadata.json
|
|
148
|
-
|
|
149
|
-
Glyph large
|
|
150
|
-
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/TimeGlyphs/timeGlyphs_large_metadata.json
|
|
151
|
-
|
|
152
|
-
Points
|
|
153
|
-
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/Points/point_time_metadata.json
|
|
154
|
-
|
|
155
|
-
Surfaces
|
|
156
|
-
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/Surfaces/beating_heart_metadata.json
|
|
157
|
-
|
|
158
|
-
#### Testing the build bundle in other packages
|
|
159
|
-
Use one of the following methods for testing the scaffoldvuer build in apps that depend on this package:
|
|
160
|
-
1. Use [`npm link`](https://docs.npmjs.com/cli/v8/commands/npm-link) to test scaffoldvuer works in apps that import it.
|
|
161
|
-
2. Use symlink, or copy and paste the `/dist` directory.
|
|
162
|
-
3. Modify the package.json to <your-npm-account>/scaffoldvuer and publish. (Careful! If this is not done the version will need to be [deprecated](https://docs.npmjs.com/cli/v8/commands/npm-deprecate)
|
|
163
|
-
|
|
164
|
-
One of the above methods will often need to be used in [abi-software/mapintegratedvuer](https://github.com/abi-Software/mapintegratedvuer)
|
|
1
|
+
# Scaffoldvuer
|
|
2
|
+
|
|
3
|
+
This project aims to provide high-level 3D physiological models viewing capability.
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
## Scaffoldvuer on NPM
|
|
7
|
+
|
|
8
|
+
Scaffoldvuer is available on npm and can be installed into your project with the following command:
|
|
9
|
+
```bash
|
|
10
|
+
npm i @abi-software/scaffoldvuer
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
## Project setup
|
|
14
|
+
```
|
|
15
|
+
npm install
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
### Compiles and minifies for production
|
|
19
|
+
```
|
|
20
|
+
npm run build-bundle
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
## How to use
|
|
24
|
+
Install the package in your vue app project with the following command "npm i @abi-software/scaffoldvuer".
|
|
25
|
+
Import the package in your script as followed:
|
|
26
|
+
```javascript
|
|
27
|
+
import { ScaffoldVuer } from '@abi-software/scaffoldvuer';
|
|
28
|
+
import '@abi-software/scaffoldvuer/dist/scaffoldvuer.css';
|
|
29
|
+
```
|
|
30
|
+
Local registration in vue component:
|
|
31
|
+
```javascript
|
|
32
|
+
export default {
|
|
33
|
+
...
|
|
34
|
+
components: {
|
|
35
|
+
ScaffoldVuer,
|
|
36
|
+
}
|
|
37
|
+
...
|
|
38
|
+
}
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
The codes above register the ScaffoldVuer component in the global scope.
|
|
43
|
+
You can now use the ScaffoldVuer in your vue template as followed:
|
|
44
|
+
```html
|
|
45
|
+
<ScaffoldVuer url="Metafile.json" v-on:scaffold-selected="ScaffoldSelected" style="height:50%"/>
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
url should be a variable/string containing the url of a compatible json model.
|
|
49
|
+
scaffold-selected is the custom event triggered when a part of the 3D-scaffold is selected, see below for a
|
|
50
|
+
sample callback.
|
|
51
|
+
|
|
52
|
+
```javascript
|
|
53
|
+
methods: {
|
|
54
|
+
ScaffoldSelected: function(annotation) {
|
|
55
|
+
console.log(annotation);
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
```
|
|
59
|
+
A more in depth API reference can be found here: https://abi-software.github.io/scaffoldvuer/ .
|
|
60
|
+
|
|
61
|
+
## Project setup from Github
|
|
62
|
+
|
|
63
|
+
The source code is available from Github, it can be found here: https://github.com/ABI-Software/scaffoldvuer .
|
|
64
|
+
|
|
65
|
+
### Clone the respositroy
|
|
66
|
+
```bash
|
|
67
|
+
git clone https://github.com/ABI-Software/scaffoldvuer.git
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
### Setup
|
|
71
|
+
```bash
|
|
72
|
+
npm install
|
|
73
|
+
```
|
|
74
|
+
|
|
75
|
+
### Compiles and minifies for production
|
|
76
|
+
```bash
|
|
77
|
+
npm run build-bundle
|
|
78
|
+
```
|
|
79
|
+
|
|
80
|
+
### Run the sample application
|
|
81
|
+
```bash
|
|
82
|
+
npm run serve
|
|
83
|
+
```
|
|
84
|
+
|
|
85
|
+
|
|
86
|
+
## Example
|
|
87
|
+
The following example showcases ScaffoldVuer in action: https://mapcore-demo.org/current/scaffoldvuer/
|
|
88
|
+
|
|
89
|
+
## Scaffoldvuer release process:
|
|
90
|
+
|
|
91
|
+
### Versioning
|
|
92
|
+
|
|
93
|
+
Scaffoldvuer uses [semantic versioning](https://semver.org/).
|
|
94
|
+
|
|
95
|
+
If any changes are experimental or parallel to the main development, [npm dist tags](https://docs.npmjs.com/cli/v9/commands/npm-dist-tag) are used to keep this version from being the default when `npm install @abi-software/scaffoldvuer` is used.
|
|
96
|
+
|
|
97
|
+
Dist tags can be used like so:
|
|
98
|
+
```
|
|
99
|
+
npm publish --tag <tag>
|
|
100
|
+
```
|
|
101
|
+
|
|
102
|
+
`<tag>` is the dist tag to add. In example: `npm publish --tag beta`
|
|
103
|
+
|
|
104
|
+
### Publishing
|
|
105
|
+
|
|
106
|
+
#### 1. Update the package number in [package.json](https://github.com/ABI-Software/scaffoldvuer/blob/main/package.json)
|
|
107
|
+
#### 2. Bundles for scaffoldvuer can be built by using
|
|
108
|
+
```
|
|
109
|
+
npm run build-bundle
|
|
110
|
+
```
|
|
111
|
+
|
|
112
|
+
This builds the package to be digested by other vue packages by importing either the build or the source.
|
|
113
|
+
|
|
114
|
+
##### Build import
|
|
115
|
+
```
|
|
116
|
+
import { ScaffoldVuer } from "@abi-software/scaffoldvuer";
|
|
117
|
+
import '@abi-software/scaffoldvuer/dist/map-side-bar.css';
|
|
118
|
+
```
|
|
119
|
+
|
|
120
|
+
##### Source import (used in [abi-software/mapintegratedvuer](https://github.com/abi-Software/mapintegratedvuer))
|
|
121
|
+
```
|
|
122
|
+
import { ScaffoldVuer } from "@abi-software/scaffoldvuer/src/components/index.js";
|
|
123
|
+
```
|
|
124
|
+
|
|
125
|
+
#### 3. Publish with `npm publish` in the package directory
|
|
126
|
+
|
|
127
|
+
### Testing
|
|
128
|
+
|
|
129
|
+
#### Testing [`zincjs`](https://github.com/alan-wu/ZincJS)
|
|
130
|
+
Check that the version of zincjs used is running correctly and passing the tests.
|
|
131
|
+
|
|
132
|
+
Test runs can be found here:
|
|
133
|
+
https://autotest.bioeng.auckland.ac.nz/jenkins/blue/organizations/jenkins/ZincJS/activity
|
|
134
|
+
|
|
135
|
+
Click on the latest test and search for `zincjs@` to find the zincjs version number.
|
|
136
|
+
|
|
137
|
+
#### Visual check
|
|
138
|
+
Open the links below, checking that they load in, render correctly and are usable:
|
|
139
|
+
|
|
140
|
+
Region
|
|
141
|
+
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/MyExport_metadata.json
|
|
142
|
+
|
|
143
|
+
Glyph small
|
|
144
|
+
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/TimeGlyphs/timeGlyphs_1.json
|
|
145
|
+
|
|
146
|
+
Lines
|
|
147
|
+
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/Lines/lines_metadata.json
|
|
148
|
+
|
|
149
|
+
Glyph large
|
|
150
|
+
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/TimeGlyphs/timeGlyphs_large_metadata.json
|
|
151
|
+
|
|
152
|
+
Points
|
|
153
|
+
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/Points/point_time_metadata.json
|
|
154
|
+
|
|
155
|
+
Surfaces
|
|
156
|
+
http://localhost:8081/#/?url=https://mapcore-bucket1.s3.us-west-2.amazonaws.com/format-testing/Surfaces/beating_heart_metadata.json
|
|
157
|
+
|
|
158
|
+
#### Testing the build bundle in other packages
|
|
159
|
+
Use one of the following methods for testing the scaffoldvuer build in apps that depend on this package:
|
|
160
|
+
1. Use [`npm link`](https://docs.npmjs.com/cli/v8/commands/npm-link) to test scaffoldvuer works in apps that import it.
|
|
161
|
+
2. Use symlink, or copy and paste the `/dist` directory.
|
|
162
|
+
3. Modify the package.json to <your-npm-account>/scaffoldvuer and publish. (Careful! If this is not done the version will need to be [deprecated](https://docs.npmjs.com/cli/v8/commands/npm-deprecate)
|
|
163
|
+
|
|
164
|
+
One of the above methods will often need to be used in [abi-software/mapintegratedvuer](https://github.com/abi-Software/mapintegratedvuer)
|
package/babel.config.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
module.exports = {
|
|
2
|
-
presets: [
|
|
3
|
-
'@vue/cli-plugin-babel/preset'
|
|
4
|
-
],
|
|
5
|
-
plugins: [
|
|
6
|
-
[
|
|
7
|
-
"component",
|
|
8
|
-
{
|
|
9
|
-
libraryName: "element-ui",
|
|
10
|
-
styleLibraryName: "theme-chalk"
|
|
11
|
-
}
|
|
12
|
-
]
|
|
13
|
-
]
|
|
14
|
-
}
|
|
1
|
+
module.exports = {
|
|
2
|
+
presets: [
|
|
3
|
+
'@vue/cli-plugin-babel/preset'
|
|
4
|
+
],
|
|
5
|
+
plugins: [
|
|
6
|
+
[
|
|
7
|
+
"component",
|
|
8
|
+
{
|
|
9
|
+
libraryName: "element-ui",
|
|
10
|
+
styleLibraryName: "theme-chalk"
|
|
11
|
+
}
|
|
12
|
+
]
|
|
13
|
+
]
|
|
14
|
+
}
|