@abi-software/simulationvuer 3.0.12 → 3.0.14
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/README.md +11 -10
- package/dist/index.html +10 -6
- package/dist/simulationvuer.js +11793 -11663
- package/dist/simulationvuer.umd.cjs +103 -103
- package/dist/style.css +1 -1
- package/package.json +19 -7
- package/public/index.html +10 -6
- package/src/App.vue +161 -46
- package/src/assets/_variables.scss +13 -11
- package/src/assets/styles.scss +2 -2
- package/src/components/SimulationVuer.vue +228 -113
- package/src/components/SimulationVuerInput.vue +2 -1
- package/src/components/common.js +19 -8
- package/src/components/index.js +2 -4
- package/src/components/json.js +144 -73
- package/src/main.js +2 -1
- package/vite.config.js +11 -6
- package/vuese-generator.js +77 -80
package/README.md
CHANGED
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
SimulationVuer is a [Vue](https://vuejs.org/) 3 component used in the [SPARC portal](https://sparc.science/) to run some simulation-based [datasets](https://sparc.science/data?type=dataset) that include a [JSON](https://json.org/) file. That JSON file is used by SimulationVuer to create a user interface (Fig. 1) which can then be used by someone to configure a simulation before running it.
|
|
4
4
|
|
|
5
|
-
The simulation is run either on [oSPARC](https://osparc.io/) or in a user's browser, depending on how the simulation-based dataset is referenced (see the
|
|
5
|
+
The simulation is run either on [oSPARC](https://osparc.io/) or in a user's browser, depending on how the simulation-based dataset is referenced (see the `id` property below). In the oSPARC case, SimulationVuer relies on the [SPARC API](https://github.com/nih-sparc/sparc-api) to ask oSPARC to run the model and to retrieve the simulation results, which can then be visualised and interacted with using the interface.
|
|
6
6
|
|
|
7
7
|

|
|
8
|
-
|
|
8
|
+
_Figure 1: user interface for dataset [135](https://sparc.science/datasets/simulationviewer?id=135)._
|
|
9
9
|
|
|
10
10
|
## How to use
|
|
11
11
|
|
|
@@ -18,7 +18,7 @@ npm install @abi-software/simulationvuer
|
|
|
18
18
|
To include the package in your script:
|
|
19
19
|
|
|
20
20
|
```javascript
|
|
21
|
-
import { SimulationVuer } from
|
|
21
|
+
import { SimulationVuer } from "@abi-software/simulationvuer";
|
|
22
22
|
```
|
|
23
23
|
|
|
24
24
|
To register the package as a Vue component:
|
|
@@ -38,16 +38,17 @@ export default {
|
|
|
38
38
|
The above registers the SimulationVuer component into the global scope. You can now use SimulationVuer in your Vue template as follows:
|
|
39
39
|
|
|
40
40
|
```html
|
|
41
|
-
<SimulationVuer :apiLocation="apiLocation" :id=123 />
|
|
41
|
+
<SimulationVuer :apiLocation="apiLocation" :id="123" />
|
|
42
42
|
```
|
|
43
43
|
|
|
44
44
|
where:
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
45
|
+
|
|
46
|
+
- `apiLocation` is the URL of a running copy of the [SPARC API](https://github.com/nih-sparc/sparc-api); and
|
|
47
|
+
- `id` is:
|
|
48
|
+
- the id of a SPARC simulation-based dataset (as a `Number`, e.g., `135`);
|
|
49
|
+
- the [PMR](https://models.physiomeproject.org/) path to an [OMEX](https://combinearchive.org/) file (as a `String`, e.g., `workspace/b7c/rawfile/e0ae8d2d56aaaa091e23e1ee7e84cacbda1dfb6b/135.omex`);
|
|
50
|
+
- the direct URL to an OMEX file (as a `String`, e.g., `https://raw.githubusercontent.com/opencor/webapp/refs/heads/main/tests/models/ui/135.omex`); or
|
|
51
|
+
- a raw OMEX file (as a `Uint8Array`).
|
|
51
52
|
|
|
52
53
|
Note that a simulation will be run on oSPARC if the `id` references a SPARC simulation-based dataset, in a user's browser otherwise.
|
|
53
54
|
|
package/dist/index.html
CHANGED
|
@@ -1,15 +1,19 @@
|
|
|
1
|
-
<!
|
|
1
|
+
<!doctype html>
|
|
2
2
|
<html lang="en">
|
|
3
3
|
<head>
|
|
4
|
-
<meta charset="utf-8"
|
|
5
|
-
<meta http-equiv="X-UA-Compatible" content="IE=edge"
|
|
6
|
-
<meta name="viewport" content="width=device-width,initial-scale=1.0"
|
|
7
|
-
<link rel="icon" href="<%= BASE_URL %>favicon.ico"
|
|
4
|
+
<meta charset="utf-8" />
|
|
5
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
6
|
+
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
|
|
7
|
+
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
|
|
8
8
|
<title><%= htmlWebpackPlugin.options.title %></title>
|
|
9
9
|
</head>
|
|
10
10
|
<body>
|
|
11
11
|
<noscript>
|
|
12
|
-
<strong
|
|
12
|
+
<strong
|
|
13
|
+
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
|
|
14
|
+
properly without JavaScript enabled. Please enable it to
|
|
15
|
+
continue.</strong
|
|
16
|
+
>
|
|
13
17
|
</noscript>
|
|
14
18
|
<div id="app"></div>
|
|
15
19
|
<!-- built files will be auto injected -->
|