@abi-software/flatmapvuer 1.17.0 → 1.17.1-demo.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/README.md CHANGED
@@ -10,18 +10,23 @@ This project is now built with Vue3 frameworks, Vue 2 version of Flatmapvuer is
10
10
  ## Flatmapvuer on NPM
11
11
 
12
12
  Flatmapvuer is available on npm and can be installed into your project with the following command:
13
+
13
14
  ```bash
14
15
  npm i @abi-software/flatmapvuer
15
16
  ```
16
17
 
17
18
  ## How to use
19
+
18
20
  Install the package "npm i @abi-software/flatmapvuer" to your vue app.
19
21
  Include the package in your script.
22
+
20
23
  ```javascript
21
- import {FlatmapVuer, MultiFlatmapVuer} from '@abi-software/flatmapvuer';
24
+ import { FlatmapVuer, MultiFlatmapVuer } from '@abi-software/flatmapvuer';
22
25
  import '@abi-software/flatmapvuer/dist/style.css';
23
26
  ```
27
+
24
28
  Local registration in vue component:
29
+
25
30
  ```javascript
26
31
  export default {
27
32
  ...
@@ -35,8 +40,14 @@ export default {
35
40
 
36
41
  The line above registers both the FlatmapVuer and MultiFlatmapVuer component into the global scope.
37
42
  You can now use the FlatmapVuer in your vue template as followed:
43
+
38
44
  ```html
39
- <FlatmapVuer entry="NCBITaxon:9606" uuid="uuid-to-set" v-on:resource-selected="FlatmapSelected" v-on:ready="FlatmapReady"/>
45
+ <FlatmapVuer
46
+ entry="NCBITaxon:9606"
47
+ uuid="uuid-to-set"
48
+ v-on:resource-selected="FlatmapSelected"
49
+ v-on:ready="FlatmapReady"
50
+ />
40
51
  ```
41
52
 
42
53
  **entry** is the variable/string with the NCBI Taxonomy term. Some of the available taxon including: NCBITaxon:9606 (Human), NCBITaxon:9685 (Cat), NCBITaxon:9823 (Pig), NCBITaxon:10090 (Mouse) and NCBITaxon:10114 (Rat). This will always get the latest version of a map with the matching taxon.
@@ -65,12 +76,18 @@ Please see the following sample codes for details.
65
76
  ```
66
77
 
67
78
  You can also use MultiFlatmapVuer to provide a selection of flatmaps.
79
+
68
80
  ```html
69
- <MultiFlatmapVuer :availableSpecies="availableSpecies"
81
+ <MultiFlatmapVuer
82
+ :availableSpecies="availableSpecies"
70
83
  @resource-selected="FlatmapSelected"
71
- @ready="FlatmapReady" :initial="initial"/>
84
+ @ready="FlatmapReady"
85
+ :initial="initial"
86
+ />
72
87
  ```
88
+
73
89
  **availableSpecies** is the object containing information of available species for the users. See below for an example:
90
+
74
91
  ```javascript
75
92
  availableSpecies : {
76
93
  "Human":{taxo: "NCBITaxon:9606", iconClass:"icon-mapicon_human"},
@@ -80,42 +97,47 @@ You can also use MultiFlatmapVuer to provide a selection of flatmaps.
80
97
  "Cat":{taxo: "NCBITaxon:9685", iconClass:"icon-mapicon_cat"},
81
98
  }
82
99
  ```
100
+
83
101
  The keys of the codes above provide the labels on the chooser, **taxo** should be one of the available taxon id from the list and **iconClass** specifies the user provided icons to use.
84
102
 
85
103
  **initial** specifies the start up species when the component is first mounted, it should be one of the keys on the provided available species.
86
104
 
87
-
88
105
  ## Project setup from Github
89
106
 
90
107
  The source code is available from Github, it can be found here: https://github.com/ABI-Software/flatmapvuer .
91
108
 
92
109
  ### Clone the respositroy
110
+
93
111
  ```bash
94
112
  git clone https://github.com/ABI-Software/flatmapvuer.git
95
113
  ```
96
114
 
97
115
  ### Setup
116
+
98
117
  ```bash
99
118
  npm install
100
119
  ```
101
120
 
102
121
  ### Compiles and minifies for production
122
+
103
123
  ```bash
104
124
  npm run build-bundle
105
125
  ```
106
126
 
107
127
  ### Run the sample application
128
+
108
129
  ```bash
109
130
  npm run serve
110
131
  ```
111
132
 
112
-
113
133
  ## Documentation
114
134
 
115
135
  The documentation is developed with `vitepress` and `vuese`. Documentation pages are in the `docs` folder.
116
136
 
117
137
  ### To run in local development mode
138
+
118
139
  ```bash
119
140
  npm run docs:watch
120
141
  ```
142
+
121
143
  This will start the documentation server with `vitepress` on port `:5173` and watch the `FlatmapVuer` and `MultiFlatmapVuer` components changes.
package/cypress.config.js CHANGED
@@ -1,16 +1,16 @@
1
- import { defineConfig } from "cypress";
1
+ import { defineConfig } from 'cypress';
2
2
  import { configureVisualRegression } from 'cypress-visual-regression';
3
3
 
4
4
  const config = defineConfig({
5
- "viewportWidth": 1920,
6
- "viewportHeight": 1080,
5
+ viewportWidth: 1920,
6
+ viewportHeight: 1080,
7
7
  defaultCommandTimeout: 30000,
8
8
  // reporter: "junit",
9
9
  experimentalMemoryManagement: true,
10
10
  numTestsKeptInMemory: 0,
11
- reporter: "cypress-multi-reporters",
11
+ reporter: 'cypress-multi-reporters',
12
12
  reporterOptions: {
13
- configFile: "reporter-config.json"
13
+ configFile: 'reporter-config.json',
14
14
  },
15
15
  env: {
16
16
  projectId: process.env.CYPRESS_PROJECT_ID,
@@ -27,26 +27,26 @@ const config = defineConfig({
27
27
  MOUSE_UUID: process.env.MOUSE_UUID ? process.env.MOUSE_UUID : '',
28
28
  PIG_UUID: process.env.PIG_UUID ? process.env.PIG_UUID : '',
29
29
  CAT_UUID: process.env.CAT_UUID ? process.env.CAT_UUID : '',
30
- ERROR_TOLERANCE: process.env.ERROR_TOLERANCE ? process.env.ERROR_TOLERANCE : 0.0001
30
+ ERROR_TOLERANCE: process.env.ERROR_TOLERANCE ? process.env.ERROR_TOLERANCE : 0.0001,
31
31
  },
32
32
  component: {
33
- specPattern: "cypress/component/*.cy.js",
33
+ specPattern: 'cypress/component/*.cy.js',
34
34
  devServer: {
35
- framework: "vue",
36
- bundler: "vite",
35
+ framework: 'vue',
36
+ bundler: 'vite',
37
37
  },
38
38
  screenshotsFolder: './cypress/screenshots',
39
- setupNodeEvents(on, config) {
40
- configureVisualRegression(on)
39
+ setupNodeEvents(on, _config) {
40
+ configureVisualRegression(on);
41
41
 
42
42
  on('before:browser:launch', (browser, launchOptions) => {
43
43
  if (browser.name === 'chrome' && browser.isHeadless) {
44
44
  // fullPage screenshot size is 1400x1200 on non-retina screens
45
45
  // and 2800x2400 on retina screens
46
- launchOptions.args.push('--window-size=1400,1200')
46
+ launchOptions.args.push('--window-size=1400,1200');
47
47
 
48
48
  // force screen to be non-retina (1400x1200 size)
49
- launchOptions.args.push('--force-device-scale-factor=1')
49
+ launchOptions.args.push('--force-device-scale-factor=1');
50
50
 
51
51
  // force screen to be retina (2800x2400 size)
52
52
  // launchOptions.args.push('--force-device-scale-factor=2')
@@ -54,19 +54,19 @@ const config = defineConfig({
54
54
 
55
55
  if (browser.name === 'electron' && browser.isHeadless) {
56
56
  // fullPage screenshot size is 1400x1200
57
- launchOptions.preferences.width = 2000
58
- launchOptions.preferences.height = 2000
57
+ launchOptions.preferences.width = 2000;
58
+ launchOptions.preferences.height = 2000;
59
59
  }
60
60
 
61
61
  if (browser.name === 'firefox' && browser.isHeadless) {
62
62
  // menubars take up height on the screen
63
63
  // so fullPage screenshot size is 1400x1126
64
- launchOptions.args.push('--width=1400')
65
- launchOptions.args.push('--height=1200')
64
+ launchOptions.args.push('--width=1400');
65
+ launchOptions.args.push('--height=1200');
66
66
  }
67
67
 
68
- return launchOptions
69
- })
68
+ return launchOptions;
69
+ });
70
70
  },
71
71
  },
72
72
  });