@abi-software/mapintegratedvuer 0.7.2-vue3.0-alpha.0 → 1.0.1

package/README.md

@@ -1,150 +1,150 @@
-# mapintegratedvuer
-
-This project aims to provide an application to visually navigate anatomical entities to  discover functional and physiological datasets
-from organ-specific neural circuitry.
-
-## Components in mapintegratedvuer
-
-Mapintegratedvuer includes multiple components for visualising data, the list of viewers can be found below:
-
-### [Flatmapvuer](https://github.com/ABI-Software/flatmapvuer)
-
-### [Scaffoldvuer](https://github.com/ABI-Software/scaffoldvuer)
-
-### [Simulationvuer](https://github.com/ABI-Software/simulationvuer)
-
-### [Plotvuer](https://github.com/ABI-Software/plotvuer)
-
-### [Sidebar](https://github.com/ABI-Software/map-sidebar.git)
-
-
-## mapintegratedvuer on NPM
-
-mapintegratedvuer is available on npm and can be installed into your project with the following command:
-```bash
-npm i @abi-software/mapintegratedvuer
-```
-
-## Project setup
-```
-npm install
-```
-
-### Compiles and minifies for production
-```
-npm run build-bundle
-```
-
-## How to use
-Install the package in your vue app project with the following command "npm i @abi-software/mapintegratedvuer".
-Import the package in your script as followed:
-```javascript
-import '@abi-software/mapintegratedvuer';
-import '@abi-software/mapintegratedvuer/dist/mapintegratedvuer.css';
-```
-
-The codes above register the MapContent component in the global scope.
-You can now use the MapContent in your vue template as followed:
-```html
-<MapContent />
-```
-
-## Project setup from Github
-
-The source code is available from Github, it can be found here: https://github.com/ABI-Software/mapintegratedvuer .
-
-### Clone the respositroy
-```bash
-git clone https://github.com/ABI-Software/mapintegratedvuer
-```
-
-### Setup
-```bash
-npm install
-```
-
-### Create an instance
-```bash
-npm run serve
-```
-
-### Compiles and minifies for production
-```bash
-npm run build-bundle
-```
-
-## Example
-The following pagedemonstrates the mapintegratedapp in action: https://mapcore-demo.org/current/sparc-app/maps
-
-
-## Testing mapintegratedvuer dependencies in [sparc-app](https://github.com/nih-sparc/sparc-app/)
-We will cover three options for updating nested dependencies.
-
-### 1. Copy build files from `npm run build-bundle`
-This works by directly changing files in `node-modules/`, where node will look to resolve dependencies.
-
-```
-cd <your-dependency>
-npm run build-bundle
-cp /dist <mapintegratedvuer-path>/node_modules/@<your-npmhandle>/<your-dependency>/dist
-cd <mapintegratedvuer-path>
-npm run build-bundle
-cp /dist <sparc-app-path>/node_modules/@abi-software/mapintegratedvuer/dist
-yarn dev
-```
-*Note: this assumes assets in the static folders shipped with the npm package will remain unchanged*
-### 2. Use `yarn link`
-This is a variant of option 1, where we use `yarn link` to create a symbolic link from mapintegratedvuer->spar-app
-It reduces the number of copies to 1, but still requires 3 builds
-```
-cd <your-dependency>
-npm run build-bundle
-cp /dist <mapintegratedvuer-path>/node_modules/@<your-npmhandle>/<your-dependency>/dist
-cd <mapintegratedvuer-path>
-npm run build-bundle
-yarn link
-cd sparc-app
-yarn link @abi-software/mapintegratedvuer
-yarn dev
-```
-(npm link does not work without disabling es-lint, which we won't go into)
-
-### 3. Publish own version of mapintegratedvuer
-This method is the most time consuming and has the downside of populating the npm package's version history with builds.
-Since it mimics the way `sparc-app` will use it, it's gauranteed to work.
-
-```
-cd <your-dependency>
-npm run build-bundle
-npm publish --tag alpha
-cd mapintegratedvuer
-npm install @<your-npmhandle>/<your-dependency>@alpha
-```
-
-Edit mapintegratedvuer/package.json:
-Change `@abi-software/mapintegratedvuer` to `@<your-npm-handle>/mapintegratedvuer`
-
-```
-cd mapintegratedvuer
-npm run build-bundle
-npm publish --tag alpha
-```
-
-Edit sparc-app/pages/maps/index.vue
-Change `@abi-software/mapintegratedvuer` to `@<your-npm-handle>/mapintegratedvuer`
-
-```
-cd sparc-app
-yarn add @<your-npm-handle>/mapintegratedvuer@alpha
-yarn dev
-```
-
-## Documentation
-
-The documentation is developed with `vitepress` and `vuese`. Documentation pages are in the `docs` folder.
-
-### To run in local development mode
-```bash
-npm run docs:watch
-```
-This will start the documentation server with `vitepress` on port `:5173` and watch the `FlatmapVuer` and `MultiFlatmapVuer` components changes.
+# mapintegratedvuer
+
+This project aims to provide an application to visually navigate anatomical entities to  discover functional and physiological datasets
+from organ-specific neural circuitry.
+
+## Components in mapintegratedvuer
+
+Mapintegratedvuer includes multiple components for visualising data, the list of viewers can be found below:
+
+### [Flatmapvuer](https://github.com/ABI-Software/flatmapvuer)
+
+### [Scaffoldvuer](https://github.com/ABI-Software/scaffoldvuer)
+
+### [Simulationvuer](https://github.com/ABI-Software/simulationvuer)
+
+### [Plotvuer](https://github.com/ABI-Software/plotvuer)
+
+### [Sidebar](https://github.com/ABI-Software/map-sidebar.git)
+
+
+## mapintegratedvuer on NPM
+
+mapintegratedvuer is available on npm and can be installed into your project with the following command:
+```bash
+npm i @abi-software/mapintegratedvuer
+```
+
+## Project setup
+```
+npm install
+```
+
+### Compiles and minifies for production
+```
+npm run build-bundle
+```
+
+## How to use
+Install the package in your vue app project with the following command "npm i @abi-software/mapintegratedvuer".
+Import the package in your script as followed:
+```javascript
+import '@abi-software/mapintegratedvuer';
+import '@abi-software/mapintegratedvuer/dist/mapintegratedvuer.css';
+```
+
+The codes above register the MapContent component in the global scope.
+You can now use the MapContent in your vue template as followed:
+```html
+<MapContent />
+```
+
+## Project setup from Github
+
+The source code is available from Github, it can be found here: https://github.com/ABI-Software/mapintegratedvuer .
+
+### Clone the respositroy
+```bash
+git clone https://github.com/ABI-Software/mapintegratedvuer
+```
+
+### Setup
+```bash
+npm install
+```
+
+### Create an instance
+```bash
+npm run serve
+```
+
+### Compiles and minifies for production
+```bash
+npm run build-bundle
+```
+
+## Example
+The following pagedemonstrates the mapintegratedapp in action: https://mapcore-demo.org/current/sparc-app/maps
+
+
+## Testing mapintegratedvuer dependencies in [sparc-app](https://github.com/nih-sparc/sparc-app/)
+We will cover three options for updating nested dependencies.
+
+### 1. Copy build files from `npm run build-bundle`
+This works by directly changing files in `node-modules/`, where node will look to resolve dependencies.
+
+```
+cd <your-dependency>
+npm run build-bundle
+cp /dist <mapintegratedvuer-path>/node_modules/@<your-npmhandle>/<your-dependency>/dist
+cd <mapintegratedvuer-path>
+npm run build-bundle
+cp /dist <sparc-app-path>/node_modules/@abi-software/mapintegratedvuer/dist
+yarn dev
+```
+*Note: this assumes assets in the static folders shipped with the npm package will remain unchanged*
+### 2. Use `yarn link`
+This is a variant of option 1, where we use `yarn link` to create a symbolic link from mapintegratedvuer->spar-app
+It reduces the number of copies to 1, but still requires 3 builds
+```
+cd <your-dependency>
+npm run build-bundle
+cp /dist <mapintegratedvuer-path>/node_modules/@<your-npmhandle>/<your-dependency>/dist
+cd <mapintegratedvuer-path>
+npm run build-bundle
+yarn link
+cd sparc-app
+yarn link @abi-software/mapintegratedvuer
+yarn dev
+```
+(npm link does not work without disabling es-lint, which we won't go into)
+
+### 3. Publish own version of mapintegratedvuer
+This method is the most time consuming and has the downside of populating the npm package's version history with builds.
+Since it mimics the way `sparc-app` will use it, it's gauranteed to work.
+
+```
+cd <your-dependency>
+npm run build-bundle
+npm publish --tag alpha
+cd mapintegratedvuer
+npm install @<your-npmhandle>/<your-dependency>@alpha
+```
+
+Edit mapintegratedvuer/package.json:
+Change `@abi-software/mapintegratedvuer` to `@<your-npm-handle>/mapintegratedvuer`
+
+```
+cd mapintegratedvuer
+npm run build-bundle
+npm publish --tag alpha
+```
+
+Edit sparc-app/pages/maps/index.vue
+Change `@abi-software/mapintegratedvuer` to `@<your-npm-handle>/mapintegratedvuer`
+
+```
+cd sparc-app
+yarn add @<your-npm-handle>/mapintegratedvuer@alpha
+yarn dev
+```
+
+## Documentation
+
+The documentation is developed with `vitepress` and `vuese`. Documentation pages are in the `docs` folder.
+
+### To run in local development mode
+```bash
+npm run docs:watch
+```
+This will start the documentation server with `vitepress` on port `:5173` and watch the `FlatmapVuer` and `MultiFlatmapVuer` components changes.

package/assets/styleguide.css

@@ -1,19 +1,19 @@
-:root {
-    --white: #f4f4f4;
-    --white: #ffffff;
-    --black: #333333;
-    --slate-grey: #606266;
-    --pale-grey: #e4e7ed;
-    --warm-purple: #9c2aa0;
-    --grape: #5e2750;
-    --very-light-pink: #cccccc;
-    --black: #000000;
-    --very-light-pink: #ebebeb;
-    --brown-grey: #afafaf;
-    --charcoal-grey: #4a4d4e;
-    --brownish-grey: #666666;
-    --brown-grey: #999999;
-    --deep-sky-blue: #007aff;
-    --turquoise-blue: #00b0ca;
-    --vibrant-purple: #8300bf;
-  }
+:root {
+    --white: #f4f4f4;
+    --white: #ffffff;
+    --black: #333333;
+    --slate-grey: #606266;
+    --pale-grey: #e4e7ed;
+    --warm-purple: #9c2aa0;
+    --grape: #5e2750;
+    --very-light-pink: #cccccc;
+    --black: #000000;
+    --very-light-pink: #ebebeb;
+    --brown-grey: #afafaf;
+    --charcoal-grey: #4a4d4e;
+    --brownish-grey: #666666;
+    --brown-grey: #999999;
+    --deep-sky-blue: #007aff;
+    --turquoise-blue: #00b0ca;
+    --vibrant-purple: #8300bf;
+  }

package/cypress.config.js

@@ -1,23 +1,23 @@
-
-export default {
-  defaultCommandTimeout: 10000,
-  reporter: "junit",
-  experimentalMemoryManagement: true,
-  numTestsKeptInMemory: 0,
-  reporter: "cypress-multi-reporters",
-  reporterOptions: {
-    configFile: "reporter-config.json",
-  },
-  component: {
-    viewportWidth: 1440,
-    viewportHeight: 900,
-    setupNodeEvents(on, config) {},
-    specPattern: "cypress/component/*.cy.js",
-    devServer: {
-      framework: "vue",
-      bundler: "vite",
-    },
-  },
-  video: true,
-  videoCompression: true,
-};
+
+export default {
+  defaultCommandTimeout: 10000,
+  reporter: "junit",
+  experimentalMemoryManagement: true,
+  numTestsKeptInMemory: 0,
+  reporter: "cypress-multi-reporters",
+  reporterOptions: {
+    configFile: "reporter-config.json",
+  },
+  component: {
+    viewportWidth: 1440,
+    viewportHeight: 900,
+    setupNodeEvents(on, config) {},
+    specPattern: "cypress/component/*.cy.js",
+    devServer: {
+      framework: "vue",
+      bundler: "vite",
+    },
+  },
+  video: true,
+  videoCompression: true,
+};

package/dist/index.html

@@ -1,17 +1,17 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-    <title>Physiome Portal</title>
-  </head>
-  <body>
-    <noscript>
-      <strong>We're sorry but Physiome Portal doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
-    </noscript>
-    <div id="app"></div>
-    <!-- built files will be auto injected -->
-  </body>
-</html>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <title>Physiome Portal</title>
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but Physiome Portal doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>