@abi-software/mapintegratedvuer 1.16.2 → 1.16.3-simulation.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.
Files changed (41) hide show
  1. package/dist/{ContentMixin-DiDiS2Ct.js → ContentMixin-CXBghkG4.js} +224 -455
  2. package/dist/{style-t77Cw_0W.js → DynamicMarkerMixin-C077TWyL.js} +1 -1
  3. package/dist/Flatmap-CKWEbXwI.js +103454 -0
  4. package/dist/{Iframe-Drf0INka.js → Iframe-CImGKtGq.js} +2 -2
  5. package/dist/{MultiFlatmap-ZODnXOPU.js → MultiFlatmap-jLxHqKwa.js} +15 -15
  6. package/dist/{Plot-DrEUpK5N.js → Plot-CZP1T3yL.js} +2 -2
  7. package/dist/{Scaffold-BiDz1Mwi.js → Scaffold-Z2Jv6mwD.js} +79 -53
  8. package/dist/Simulation-OtmfB6BF.js +72 -0
  9. package/dist/{index-C753e18_.js → index-Bym6cokq.js} +19683 -20021
  10. package/dist/mapintegratedvuer.js +1 -1
  11. package/dist/mapintegratedvuer.umd.cjs +4271 -231
  12. package/dist/style.css +1 -1
  13. package/package.json +9 -4
  14. package/src/App.vue +290 -260
  15. package/src/assets/styles.scss +1 -1
  16. package/src/components/ContentBar.vue +0 -1
  17. package/src/components/ContentVuer.vue +0 -2
  18. package/src/components/ContextCard.vue +0 -1
  19. package/src/components/DummyRouteComponent.vue +1 -0
  20. package/src/components/EventBus.ts +13 -0
  21. package/src/components/FloatingWindow.vue +125 -0
  22. package/src/components/MapContent.vue +1 -3
  23. package/src/components/PlotComponent.vue +56 -0
  24. package/src/components/SplitFlow.vue +470 -439
  25. package/src/components/scripts/utilities.js +1 -1
  26. package/src/components/viewers/Flatmap.vue +136 -84
  27. package/src/components/viewers/MultiFlatmap.vue +1 -1
  28. package/src/components/viewers/Simulation.vue +65 -15
  29. package/src/components.d.ts +3 -0
  30. package/src/main.js +9 -3
  31. package/src/mixins/ContentMixin.js +419 -390
  32. package/src/services/mapping.js +69 -0
  33. package/src/stores/entries.js +1 -1
  34. package/src/stores/mapping.js +29 -0
  35. package/src/stores/settings.js +0 -4
  36. package/src/stores/simulationPlotStore.js +104 -0
  37. package/src/stores/splitFlow.js +427 -362
  38. package/src/types/simulation.js +18 -0
  39. package/dist/Flatmap-Dh0ybLSL.js +0 -202
  40. package/dist/Simulation-lEXXSWRc.js +0 -28
  41. package/src/components/EventBus.js +0 -3
package/src/stores/splitFlow.js CHANGED
@@ -1,156 +1,154 @@
1
- import { defineStore } from 'pinia';
2
- import {
3
- getAvailableTermsForSpecies,
4
- } from "../components/SimulatedData.js";
5
- import EventBus from '../components/EventBus.js';
1
+ import { defineStore } from 'pinia'
2
+ import { getAvailableTermsForSpecies } from '../components/SimulatedData.js'
3
+ import EventBus from '../components/EventBus'
6
4
 
7
5
  /* eslint-disable no-alert, no-console */
8
6
  const presetLayouts = (view) => {
9
7
  switch (view) {
10
- case "2horpanel":
8
+ case '2horpanel':
11
9
  return {
12
- "split-1": {content: false, horizontal: true, children: ["pane-1", "pane-2"]},
13
- "pane-1": {content: true, id: 1},
14
- "pane-2": {content: true, id: 2},
15
- };
16
- case "2vertpanel":
10
+ 'split-1': { content: false, horizontal: true, children: ['pane-1', 'pane-2'] },
11
+ 'pane-1': { content: true, id: 1 },
12
+ 'pane-2': { content: true, id: 2 },
13
+ }
14
+ case '2vertpanel':
17
15
  return {
18
- "split-1": {content: false, horizontal: false, children: ["pane-1", "pane-2"]},
19
- "pane-1": {content: true, id: 1},
20
- "pane-2": {content: true, id: 2},
16
+ 'split-1': { content: false, horizontal: false, children: ['pane-1', 'pane-2'] },
17
+ 'pane-1': { content: true, id: 1 },
18
+ 'pane-2': { content: true, id: 2 },
21
19
  }
22
- case "3panel":
20
+ case '3panel':
23
21
  return {
24
- "split-1": {content: false, horizontal: false, children: ["pane-1", "split-2"]},
25
- "split-2": {content: false, horizontal: true, children: ["pane-2", "pane-3"]},
26
- "pane-1": {content: true, id: 1},
27
- "pane-2": {content: true, id: 2},
28
- "pane-3": {content: true, id: 3},
22
+ 'split-1': { content: false, horizontal: false, children: ['pane-1', 'split-2'] },
23
+ 'split-2': { content: false, horizontal: true, children: ['pane-2', 'pane-3'] },
24
+ 'pane-1': { content: true, id: 1 },
25
+ 'pane-2': { content: true, id: 2 },
26
+ 'pane-3': { content: true, id: 3 },
29
27
  }
30
- case "4panel":
28
+ case '4panel':
31
29
  return {
32
- "split-1": {content: false, horizontal: false, children: ["split-3", "split-2"]},
33
- "split-2": {content: false, horizontal: true, children: ["pane-2", "pane-3"]},
34
- "split-3": {content: false, horizontal: true, children: ["pane-1", "pane-4"]},
35
- "pane-1": {content: true, id: 1},
36
- "pane-2": {content: true, id: 2},
37
- "pane-3": {content: true, id: 3},
38
- "pane-4": {content: true, id: 4},
30
+ 'split-1': { content: false, horizontal: false, children: ['split-3', 'split-2'] },
31
+ 'split-2': { content: false, horizontal: true, children: ['pane-2', 'pane-3'] },
32
+ 'split-3': { content: false, horizontal: true, children: ['pane-1', 'pane-4'] },
33
+ 'pane-1': { content: true, id: 1 },
34
+ 'pane-2': { content: true, id: 2 },
35
+ 'pane-3': { content: true, id: 3 },
36
+ 'pane-4': { content: true, id: 4 },
39
37
  }
40
- case "5panel":
38
+ case '5panel':
41
39
  return {
42
- "split-1": {content: false, horizontal: true, children: ["split-3", "split-2"]},
43
- "split-2": {content: false, horizontal: false, children: ["pane-2", "pane-3"]},
44
- "split-3": {content: false, horizontal: false, children: ["pane-1","pane-4", "pane-5"]},
45
- "pane-1": {content: true, id: 1},
46
- "pane-2": {content: true, id: 2},
47
- "pane-3": {content: true, id: 3},
48
- "pane-4": {content: true, id: 4},
49
- "pane-5": {content: true, id: 5},
40
+ 'split-1': { content: false, horizontal: true, children: ['split-3', 'split-2'] },
41
+ 'split-2': { content: false, horizontal: false, children: ['pane-2', 'pane-3'] },
42
+ 'split-3': { content: false, horizontal: false, children: ['pane-1', 'pane-4', 'pane-5'] },
43
+ 'pane-1': { content: true, id: 1 },
44
+ 'pane-2': { content: true, id: 2 },
45
+ 'pane-3': { content: true, id: 3 },
46
+ 'pane-4': { content: true, id: 4 },
47
+ 'pane-5': { content: true, id: 5 },
50
48
  }
51
- case "6panel":
49
+ case '6panel':
52
50
  return {
53
- "split-1": {content: false, horizontal: true, children: ["split-3", "split-2"]},
54
- "split-2": {content: false, horizontal: false, children: ["pane-2", "pane-3", "pane-5"]},
55
- "split-3": {content: false, horizontal: false, children: ["pane-1","pane-4", "pane-6"]},
56
- "pane-1": {content: true, id: 1},
57
- "pane-2": {content: true, id: 2},
58
- "pane-3": {content: true, id: 3},
59
- "pane-4": {content: true, id: 4},
60
- "pane-5": {content: true, id: 5},
61
- "pane-6": {content: true, id: 6},
51
+ 'split-1': { content: false, horizontal: true, children: ['split-3', 'split-2'] },
52
+ 'split-2': { content: false, horizontal: false, children: ['pane-2', 'pane-3', 'pane-5'] },
53
+ 'split-3': { content: false, horizontal: false, children: ['pane-1', 'pane-4', 'pane-6'] },
54
+ 'pane-1': { content: true, id: 1 },
55
+ 'pane-2': { content: true, id: 2 },
56
+ 'pane-3': { content: true, id: 3 },
57
+ 'pane-4': { content: true, id: 4 },
58
+ 'pane-5': { content: true, id: 5 },
59
+ 'pane-6': { content: true, id: 6 },
62
60
  }
63
- case "6panelVertical":
61
+ case '6panelVertical':
64
62
  return {
65
- "split-1": {content: false, horizontal: false, children: ["split-3", "split-2"]},
66
- "split-2": {content: false, horizontal: true, children: ["pane-2", "pane-3", "pane-5"]},
67
- "split-3": {content: false, horizontal: true, children: ["pane-1","pane-4", "pane-6"]},
68
- "pane-1": {content: true, id: 1},
69
- "pane-2": {content: true, id: 2},
70
- "pane-3": {content: true, id: 3},
71
- "pane-4": {content: true, id: 4},
72
- "pane-5": {content: true, id: 5},
73
- "pane-6": {content: true, id: 6},
63
+ 'split-1': { content: false, horizontal: false, children: ['split-3', 'split-2'] },
64
+ 'split-2': { content: false, horizontal: true, children: ['pane-2', 'pane-3', 'pane-5'] },
65
+ 'split-3': { content: false, horizontal: true, children: ['pane-1', 'pane-4', 'pane-6'] },
66
+ 'pane-1': { content: true, id: 1 },
67
+ 'pane-2': { content: true, id: 2 },
68
+ 'pane-3': { content: true, id: 3 },
69
+ 'pane-4': { content: true, id: 4 },
70
+ 'pane-5': { content: true, id: 5 },
71
+ 'pane-6': { content: true, id: 6 },
74
72
  }
75
- case "singlepanel":
73
+ case 'singlepanel':
76
74
  default:
77
75
  return {
78
- "split-1": {content: false, horizontal: false, children: ["pane-1"]},
79
- "pane-1": {content: true, id: 1},
80
- }
76
+ 'split-1': { content: false, horizontal: false, children: ['pane-1'] },
77
+ 'pane-1': { content: true, id: 1 },
78
+ }
81
79
  }
82
80
  }
83
81
 
84
82
  //A method to assign unused entry to pane with duplicated id
85
83
  const autoAssignEntryIdsToPane = (entries, layout) => {
86
- const assignedIds = [];
87
- const invalidIdKeys = [];
84
+ const assignedIds = []
85
+ const invalidIdKeys = []
88
86
  for (const [key, value] of Object.entries(layout)) {
89
87
  if (value.content) {
90
- if ((1 > value.id) || assignedIds.includes(value.id)) {
88
+ if (1 > value.id || assignedIds.includes(value.id)) {
91
89
  //id has got an assigned pane or pane contains an invalid id,
92
- //cache it and find one later
93
- invalidIdKeys.push(key);
90
+ //cache it and find one later
91
+ invalidIdKeys.push(key)
94
92
  } else {
95
- assignedIds.push(value.id);
93
+ assignedIds.push(value.id)
96
94
  }
97
95
  }
98
96
  }
99
97
 
100
98
  invalidIdKeys.forEach((key) => {
101
- let done = false;
99
+ let done = false
102
100
  for (let i = 0; i < entries.length && !done; i++) {
103
- if (!(assignedIds.includes(entries[i].id))) {
104
- layout[key].id = entries[i].id;
105
- assignedIds.push(entries.id);
106
- done = true;
101
+ if (!assignedIds.includes(entries[i].id)) {
102
+ layout[key].id = entries[i].id
103
+ assignedIds.push(entries.id)
104
+ done = true
107
105
  }
108
106
  }
109
- });
110
-
107
+ })
111
108
  }
112
109
 
113
110
  const extractPaneInfo = (layout) => {
114
- const panes = {};
111
+ const panes = {}
115
112
  for (const [key, value] of Object.entries(layout)) {
116
113
  if (value.content) {
117
- panes[key] = value;
114
+ panes[key] = value
118
115
  }
119
116
  }
120
- return panes;
117
+ return panes
121
118
  }
122
119
 
123
120
  const newLayoutWithOrigInfo = (original, activeView) => {
124
- const panes = extractPaneInfo(original);
125
- const customLayout = presetLayouts(activeView);
121
+ const panes = extractPaneInfo(original)
122
+ const customLayout = presetLayouts(activeView)
126
123
  for (const [key, value] of Object.entries(panes)) {
127
- customLayout[key] = value;
124
+ customLayout[key] = value
128
125
  }
129
- return customLayout;
126
+
127
+ return customLayout
130
128
  }
131
129
 
132
130
  const findKeyWithId = (layout, id) => {
133
- return Object.keys(layout).find(key => layout[key]["id"] === id);
131
+ return Object.keys(layout).find((key) => layout[key]['id'] === id)
134
132
  }
135
133
 
136
134
  const getOriginalState = () => {
137
135
  return {
138
- activeView: "singlepanel",
136
+ activeView: 'singlepanel',
139
137
  idNamePair: {},
140
138
  viewIcons: [
141
- { icon: "singlepanel", name: "Single view", min: 1 },
142
- { icon: "2horpanel", name: "Horizontal split", min: 2 },
143
- { icon: "2vertpanel", name: "Vertical split", min: 2 },
144
- { icon: "3panel", name: "Three panes", min: 3 },
145
- { icon: "4panel", name: "Four panes", min: 4 },
146
- { icon: "5panel", name: "Five panes", min: 5 },
147
- { icon: "6panel", name: "Six (horizontal)", min: 6 },
148
- { icon: "6panelVertical", name: "Six (vertical)", min: 6 },
139
+ { icon: 'singlepanel', name: 'Single view', min: 1 },
140
+ { icon: '2horpanel', name: 'Horizontal split', min: 2 },
141
+ { icon: '2vertpanel', name: 'Vertical split', min: 2 },
142
+ { icon: '3panel', name: 'Three panes', min: 3 },
143
+ { icon: '4panel', name: 'Four panes', min: 4 },
144
+ { icon: '5panel', name: 'Five panes', min: 5 },
145
+ { icon: '6panel', name: 'Six (horizontal)', min: 6 },
146
+ { icon: '6panelVertical', name: 'Six (vertical)', min: 6 },
149
147
  //{ icon: "customise", name: "Customise", min: 2 }
150
148
  ],
151
149
  customLayout: {
152
- "split-1": {content: false, horizontal: false, children: ["pane-1"]},
153
- "pane-1": {content: true, id: 1},
150
+ 'split-1': { content: false, horizontal: false, children: ['pane-1'] },
151
+ 'pane-1': { content: true, id: 1 },
154
152
  /*
155
153
  Example layout
156
154
 
@@ -161,376 +159,443 @@ const getOriginalState = () => {
161
159
  "pane-3": {content: true, id: 3},
162
160
  */
163
161
  },
164
- splitters: { "first": 50, "second": 50, "third": 50 },
165
- };
162
+ splitters: { first: 50, second: 50, third: 50 },
163
+ }
166
164
  }
167
165
 
168
166
  export const useSplitFlowStore = defineStore('splitFlow', {
169
167
  state: () => {
170
- return getOriginalState();
168
+ return getOriginalState()
171
169
  },
172
170
  getters: {
173
171
  getActivePaneIds: (state) => () => {
174
- const availablePaneIDs = [];
175
- let activePaneIDs = undefined;
172
+ const availablePaneIDs = []
173
+ let activePaneIDs = undefined
176
174
  for (const key in state.customLayout) {
177
175
  if (state.customLayout[key].id) {
178
- availablePaneIDs.push(state.customLayout[key].id);
176
+ availablePaneIDs.push(state.customLayout[key].id)
179
177
  }
180
178
  }
181
179
  switch (state.activeView) {
182
- case 'singlepanel': {
183
- activePaneIDs = availablePaneIDs.slice(0, 1);
184
- } break;
180
+ case 'singlepanel':
181
+ {
182
+ activePaneIDs = availablePaneIDs.slice(0, 1)
183
+ }
184
+ break
185
185
  case '2horpanel':
186
- case '2vertpanel': {
187
- activePaneIDs = availablePaneIDs.slice(0, 2);
188
- } break;
189
- case '3panel': {
190
- activePaneIDs = availablePaneIDs.slice(0, 3);
191
- } break;
192
- case '4panel': {
193
- activePaneIDs = availablePaneIDs.slice(0, 4);
194
- } break;
195
- case '5panel': {
196
- activePaneIDs = availablePaneIDs.slice(0, 5);
197
- } break;
186
+ case '2vertpanel':
187
+ {
188
+ activePaneIDs = availablePaneIDs.slice(0, 2)
189
+ }
190
+ break
191
+ case '3panel':
192
+ {
193
+ activePaneIDs = availablePaneIDs.slice(0, 3)
194
+ }
195
+ break
196
+ case '4panel':
197
+ {
198
+ activePaneIDs = availablePaneIDs.slice(0, 4)
199
+ }
200
+ break
201
+ case '5panel':
202
+ {
203
+ activePaneIDs = availablePaneIDs.slice(0, 5)
204
+ }
205
+ break
198
206
  case '6panelVertical':
199
- case '6panel': {
200
- activePaneIDs = availablePaneIDs.slice(0, 6);
201
- } break;
207
+ case '6panel':
208
+ {
209
+ activePaneIDs = availablePaneIDs.slice(0, 6)
210
+ }
211
+ break
202
212
  default:
203
- activePaneIDs = [];
204
- break;
213
+ activePaneIDs = []
214
+ break
205
215
  }
206
- return activePaneIDs;
216
+ return activePaneIDs
207
217
  },
208
218
  getPaneNameById: (state) => (id) => {
209
- return findKeyWithId(state.customLayout, id);
219
+ return findKeyWithId(state.customLayout, id)
210
220
  },
211
221
  getState: (state) => () => {
212
222
  return {
213
223
  activeView: state.activeView,
214
224
  splitters: state.splitters,
215
225
  customLayout: state.customLayout,
216
- };
226
+ }
217
227
  },
218
228
  isPaneActive: (state) => (panelName) => {
219
- const layout = presetLayouts(state.activeView);
220
- return (Object.keys(layout).includes(panelName));
229
+ const layout = presetLayouts(state.activeView)
230
+ return Object.keys(layout).includes(panelName)
221
231
  },
222
232
  },
223
233
  actions: {
224
234
  assignOrSwapPaneWithIds(payload) {
225
- let sourceKey = findKeyWithId(this.customLayout, payload.source);
226
- let targetKey = findKeyWithId(this.customLayout, payload.target);
235
+ let sourceKey = findKeyWithId(this.customLayout, payload.source)
236
+ let targetKey = findKeyWithId(this.customLayout, payload.target)
227
237
  if (targetKey) {
228
- this.customLayout[targetKey].id = payload.source;
238
+ this.customLayout[targetKey].id = payload.source
229
239
  }
230
240
  if (sourceKey) {
231
- this.customLayout[sourceKey].id = payload.target;
241
+ this.customLayout[sourceKey].id = payload.target
232
242
  }
233
- this.updateSplitPanels();
243
+ this.updateSplitPanels()
234
244
  },
235
245
  getAvailableTerms(apiLocation) {
236
- let terms = getAvailableTermsForSpecies();
246
+ let terms = getAvailableTermsForSpecies()
237
247
  for (let i = 0; i < terms.length; i++) {
238
- this.idNamePair[terms[i].id] = terms[i].name;
248
+ this.idNamePair[terms[i].id] = terms[i].name
239
249
  }
240
250
  if (apiLocation) {
241
- if (this._controller) this._controller.abort();
242
- this._controller = new AbortController();
243
- let signal = this._controller.signal;
251
+ if (this._controller) this._controller.abort()
252
+ this._controller = new AbortController()
253
+ let signal = this._controller.signal
244
254
  fetch(`${apiLocation}get-organ-curies`, {
245
255
  signal,
246
256
  })
247
- .then(response => response.json())
248
- .then(data => {
249
- this._controller = undefined;
250
- data.uberon.array.forEach(pair => {
251
- this.idNamePair[pair.id.toUpperCase()] =
252
- pair.name.charAt(0).toUpperCase() + pair.name.slice(1);
253
- });
254
- return;
255
- });
257
+ .then((response) => response.json())
258
+ .then((data) => {
259
+ this._controller = undefined
260
+ data.uberon.array.forEach((pair) => {
261
+ this.idNamePair[pair.id.toUpperCase()] = pair.name.charAt(0).toUpperCase() + pair.name.slice(1)
262
+ })
263
+ return
264
+ })
256
265
  }
257
266
  },
258
- updateActiveView(payload) {
259
- this.activeView = payload.view;
260
- const customLayout = newLayoutWithOrigInfo(
261
- this.customLayout, this.activeView);
262
- autoAssignEntryIdsToPane(payload.entries, customLayout);
267
+ updateActiveView(payload, autoAssign = true) {
268
+ this.activeView = payload.view
269
+
270
+ const customLayout = newLayoutWithOrigInfo(this.customLayout, this.activeView)
271
+ if (autoAssign) {
272
+ autoAssignEntryIdsToPane(payload.entries, customLayout)
273
+ }
263
274
  for (const [key, value] of Object.entries(customLayout)) {
264
- this.customLayout[key] = value;
275
+ this.customLayout[key] = value
265
276
  }
266
- this.updateSplitPanels();
277
+ this.updateSplitPanels()
267
278
  },
268
279
  setSplitter(payload) {
269
- if (this.splitters[payload.name])
270
- this.splitters[payload.name] = payload.value;
280
+ if (this.splitters[payload.name]) this.splitters[payload.name] = payload.value
271
281
  },
272
282
  setState(newState) {
273
283
  if (newState) {
274
- let customLayout = undefined;
284
+ let customLayout = undefined
275
285
  if (newState.activeView) {
276
- this.activeView = newState.activeView;
286
+ this.activeView = newState.activeView
277
287
  }
278
288
  if (newState.customLayout) {
279
- customLayout = newState.customLayout;
289
+ customLayout = newState.customLayout
280
290
  } else {
281
- customLayout = presetLayouts(this.activeView);
291
+ customLayout = presetLayouts(this.activeView)
282
292
  if (newState.slotInfo) {
283
293
  for (let i = 0; i < newState.slotInfo.length; i++) {
284
294
  switch (newState.slotInfo[i].name) {
285
- case "first": {
286
- customLayout["pane-1"].id = newState.slotInfo[i].id;
287
- } break;
288
- case "second": {
289
- if("pane-2" in customLayout)
290
- customLayout["pane-2"].id = newState.slotInfo[i].id;
291
- } break;
292
- case "thrid": {
293
- if("pane-3" in customLayout)
294
- customLayout["pane-3"].id = newState.slotInfo[i].id;
295
- } break;
296
- case "fourth": {
297
- if("pane-4" in customLayout)
298
- customLayout["pane-4"].id = newState.slotInfo[i].id;
299
- } break;
300
- case "fifth": {
301
- if("pane-5" in customLayout)
302
- customLayout["pane-5"].id = newState.slotInfo[i].id;
303
- } break;
304
- case "sixth": {
305
- if("pane-6" in customLayout)
306
- customLayout["pane-6"].id = newState.slotInfo[i].id;
307
- } break;
295
+ case 'first':
296
+ {
297
+ customLayout['pane-1'].id = newState.slotInfo[i].id
298
+ }
299
+ break
300
+ case 'second':
301
+ {
302
+ if ('pane-2' in customLayout) customLayout['pane-2'].id = newState.slotInfo[i].id
303
+ }
304
+ break
305
+ case 'thrid':
306
+ {
307
+ if ('pane-3' in customLayout) customLayout['pane-3'].id = newState.slotInfo[i].id
308
+ }
309
+ break
310
+ case 'fourth':
311
+ {
312
+ if ('pane-4' in customLayout) customLayout['pane-4'].id = newState.slotInfo[i].id
313
+ }
314
+ break
315
+ case 'fifth':
316
+ {
317
+ if ('pane-5' in customLayout) customLayout['pane-5'].id = newState.slotInfo[i].id
318
+ }
319
+ break
320
+ case 'sixth':
321
+ {
322
+ if ('pane-6' in customLayout) customLayout['pane-6'].id = newState.slotInfo[i].id
323
+ }
324
+ break
308
325
  default:
309
- break;
326
+ break
310
327
  }
311
328
  }
312
329
  }
313
330
  }
314
331
  for (const [key, value] of Object.entries(customLayout)) {
315
- this.customLayout[key] = value;
332
+ this.customLayout[key] = value
316
333
  }
317
334
  for (const [key, value] of Object.entries(newState.splitters)) {
318
- this.splitters[key] = value;
335
+ this.splitters[key] = value
319
336
  }
320
337
  }
321
338
  },
322
- setIdToPrimaryPane(id) {
323
- const currentKey = findKeyWithId(this.customLayout, id);
324
- const firstPaneId = this.customLayout["pane-1"].id;
325
- this.customLayout["pane-1"].id = id;
339
+ setIdToPane(id, pane = 'pane-1') {
340
+ const currentKey = findKeyWithId(this.customLayout, id)
341
+ const firstPaneId = this.customLayout[pane].id
342
+ this.customLayout[pane].id = id
326
343
  if (currentKey) {
327
- this.customLayout[currentKey].id = firstPaneId;
344
+ this.customLayout[currentKey].id = firstPaneId
328
345
  }
329
346
  },
330
347
  reset() {
331
- const original = getOriginalState();
332
- this.activeView = original.activeView;
333
- this.customLayout = original.customLayout;
334
- this.splitters = original.splitters;
348
+ const original = getOriginalState()
349
+ this.activeView = original.activeView
350
+ this.customLayout = original.customLayout
351
+ this.splitters = original.splitters
335
352
  },
336
353
  closeSlot(payload) {
337
354
  if (payload) {
338
- let availableId = 0;
355
+ let availableId = 0
339
356
  if (payload.entries) {
340
- for (let i = 0; i < payload.entries.length &&
341
- availableId == 0; i++) {
357
+ for (let i = 0; i < payload.entries.length && availableId == 0; i++) {
342
358
  //Find the first entry not currently in use
343
- if ((payload.entries[i].id !== payload.id) &&
344
- findKeyWithId(this.customLayout, payload.entries[i].id) === undefined) {
345
- availableId = payload.entries[i].id;
359
+ if (
360
+ payload.entries[i].id !== payload.id &&
361
+ findKeyWithId(this.customLayout, payload.entries[i].id) === undefined
362
+ ) {
363
+ availableId = payload.entries[i].id
346
364
  }
347
365
  }
348
366
  }
349
367
  //Switch the view
350
- if (this.activeView !== "customise") {
368
+ if (this.activeView !== 'customise') {
351
369
  //closePaneWithStandardLayout
352
- const pView = this.activeView;
370
+ const pView = this.activeView
353
371
  switch (this.activeView) {
354
- case "2horpanel":
355
- case "2vertpanel":
356
- this.activeView = "singlepanel";
357
- break;
358
- case "3panel":
359
- this.activeView = "2vertpanel";
360
- break;
361
- case "4panel":
362
- this.activeView = "3panel";
363
- break;
364
- case "5panel":
365
- this.activeView = "4panel";
366
- break;
367
- case "6panelVertical":
368
- case "6panel":
369
- this.activeView = "5panel";
370
- break;
372
+ case '2horpanel':
373
+ case '2vertpanel':
374
+ this.activeView = 'singlepanel'
375
+ break
376
+ case '3panel':
377
+ this.activeView = '2vertpanel'
378
+ break
379
+ case '4panel':
380
+ this.activeView = '3panel'
381
+ break
382
+ case '5panel':
383
+ this.activeView = '4panel'
384
+ break
385
+ case '6panelVertical':
386
+ case '6panel':
387
+ this.activeView = '5panel'
388
+ break
371
389
  default:
372
- break;
390
+ break
373
391
  }
374
- const customLayout = newLayoutWithOrigInfo(
375
- this.customLayout, this.activeView);
376
- const key = findKeyWithId(this.customLayout, payload.id);
392
+ const customLayout = newLayoutWithOrigInfo(this.customLayout, this.activeView)
393
+ const key = findKeyWithId(this.customLayout, payload.id)
377
394
  // The following move the entry id to the appropriate slot
378
395
  // and remove the target id
379
396
  switch (key) {
380
- case "pane-1": {
381
- switch (pView) {
382
- case "2horpanel":
383
- case "2vertpanel": {
384
- customLayout["pane-1"].id = customLayout["pane-2"].id;
385
- customLayout["pane-2"].id = availableId;
386
- } break;
387
- case "3panel": {
388
- customLayout["pane-1"].id = customLayout["pane-2"].id;
389
- customLayout["pane-2"].id = customLayout["pane-3"].id;
390
- customLayout["pane-3"].id = availableId;
391
- } break;
392
- case "4panel": {
393
- customLayout["pane-1"].id = customLayout["pane-2"].id;
394
- customLayout["pane-2"].id = customLayout["pane-3"].id;
395
- customLayout["pane-3"].id = customLayout["pane-4"].id;
396
- customLayout["pane-4"].id = availableId;
397
- } break;
398
- case "5panel": {
399
- customLayout["pane-1"].id = customLayout["pane-2"].id;
400
- customLayout["pane-2"].id = customLayout["pane-3"].id;
401
- customLayout["pane-3"].id = customLayout["pane-4"].id;
402
- customLayout["pane-4"].id = customLayout["pane-5"].id;
403
- customLayout["pane-5"].id = availableId;
404
- } break;
405
- case "6panelVertical":
406
- case "6panel":
407
- {
408
- customLayout["pane-1"].id = customLayout["pane-2"].id;
409
- customLayout["pane-2"].id = customLayout["pane-3"].id;
410
- customLayout["pane-3"].id = customLayout["pane-4"].id;
411
- customLayout["pane-4"].id = customLayout["pane-5"].id;
412
- customLayout["pane-5"].id = customLayout["pane-6"].id;
413
- customLayout["pane-6"].id = availableId;
414
- } break;
415
- default:
416
- break;
397
+ case 'pane-1':
398
+ {
399
+ switch (pView) {
400
+ case '2horpanel':
401
+ case '2vertpanel':
402
+ {
403
+ customLayout['pane-1'].id = customLayout['pane-2'].id
404
+ customLayout['pane-2'].id = availableId
405
+ }
406
+ break
407
+ case '3panel':
408
+ {
409
+ customLayout['pane-1'].id = customLayout['pane-2'].id
410
+ customLayout['pane-2'].id = customLayout['pane-3'].id
411
+ customLayout['pane-3'].id = availableId
412
+ }
413
+ break
414
+ case '4panel':
415
+ {
416
+ customLayout['pane-1'].id = customLayout['pane-2'].id
417
+ customLayout['pane-2'].id = customLayout['pane-3'].id
418
+ customLayout['pane-3'].id = customLayout['pane-4'].id
419
+ customLayout['pane-4'].id = availableId
420
+ }
421
+ break
422
+ case '5panel':
423
+ {
424
+ customLayout['pane-1'].id = customLayout['pane-2'].id
425
+ customLayout['pane-2'].id = customLayout['pane-3'].id
426
+ customLayout['pane-3'].id = customLayout['pane-4'].id
427
+ customLayout['pane-4'].id = customLayout['pane-5'].id
428
+ customLayout['pane-5'].id = availableId
429
+ }
430
+ break
431
+ case '6panelVertical':
432
+ case '6panel':
433
+ {
434
+ customLayout['pane-1'].id = customLayout['pane-2'].id
435
+ customLayout['pane-2'].id = customLayout['pane-3'].id
436
+ customLayout['pane-3'].id = customLayout['pane-4'].id
437
+ customLayout['pane-4'].id = customLayout['pane-5'].id
438
+ customLayout['pane-5'].id = customLayout['pane-6'].id
439
+ customLayout['pane-6'].id = availableId
440
+ }
441
+ break
442
+ default:
443
+ break
444
+ }
417
445
  }
418
- } break;
419
- case "pane-2": {
420
- switch (pView) {
421
- case "2horpanel":
422
- case "2vertpanel": {
423
- customLayout["pane-2"].id = availableId;
424
- } break;
425
- case "3panel": {
426
- customLayout["pane-2"].id = customLayout["pane-3"].id;
427
- customLayout["pane-3"].id = availableId;
428
- } break;
429
- case "4panel": {
430
- customLayout["pane-2"].id = customLayout["pane-3"].id;
431
- customLayout["pane-3"].id = customLayout["pane-4"].id;
432
- customLayout["pane-4"].id = availableId;
433
- } break;
434
- case "5panel": {
435
- customLayout["pane-2"].id = customLayout["pane-3"].id;
436
- customLayout["pane-3"].id = customLayout["pane-4"].id;
437
- customLayout["pane-4"].id = customLayout["pane-5"].id;
438
- customLayout["pane-5"].id = availableId;
439
- } break;
440
- case "6panelVertical":
441
- case "6panel":
442
- {
443
- customLayout["pane-2"].id = customLayout["pane-3"].id;
444
- customLayout["pane-3"].id = customLayout["pane-4"].id;
445
- customLayout["pane-4"].id = customLayout["pane-5"].id;
446
- customLayout["pane-5"].id = customLayout["pane-6"].id;
447
- customLayout["pane-6"].id = availableId;
448
- } break;
449
- default:
450
- break;
446
+ break
447
+ case 'pane-2':
448
+ {
449
+ switch (pView) {
450
+ case '2horpanel':
451
+ case '2vertpanel':
452
+ {
453
+ customLayout['pane-2'].id = availableId
454
+ }
455
+ break
456
+ case '3panel':
457
+ {
458
+ customLayout['pane-2'].id = customLayout['pane-3'].id
459
+ customLayout['pane-3'].id = availableId
460
+ }
461
+ break
462
+ case '4panel':
463
+ {
464
+ customLayout['pane-2'].id = customLayout['pane-3'].id
465
+ customLayout['pane-3'].id = customLayout['pane-4'].id
466
+ customLayout['pane-4'].id = availableId
467
+ }
468
+ break
469
+ case '5panel':
470
+ {
471
+ customLayout['pane-2'].id = customLayout['pane-3'].id
472
+ customLayout['pane-3'].id = customLayout['pane-4'].id
473
+ customLayout['pane-4'].id = customLayout['pane-5'].id
474
+ customLayout['pane-5'].id = availableId
475
+ }
476
+ break
477
+ case '6panelVertical':
478
+ case '6panel':
479
+ {
480
+ customLayout['pane-2'].id = customLayout['pane-3'].id
481
+ customLayout['pane-3'].id = customLayout['pane-4'].id
482
+ customLayout['pane-4'].id = customLayout['pane-5'].id
483
+ customLayout['pane-5'].id = customLayout['pane-6'].id
484
+ customLayout['pane-6'].id = availableId
485
+ }
486
+ break
487
+ default:
488
+ break
489
+ }
451
490
  }
452
- } break;
453
- case "pane-3": {
454
- switch (pView) {
455
- case "3panel": {
456
- customLayout["pane-3"].id = availableId;
457
- } break;
458
- case "4panel": {
459
- customLayout["pane-3"].id = customLayout["pane-4"].id;
460
- customLayout["pane-4"].id = availableId;
461
- } break;
462
- case "5panel": {
463
- customLayout["pane-3"].id = customLayout["pane-4"].id;
464
- customLayout["pane-4"].id = customLayout["pane-5"].id;
465
- customLayout["pane-5"].id = availableId;
466
- } break;
467
- case "6panelVertical":
468
- case "6panel":
469
- {
470
- customLayout["pane-3"].id = customLayout["pane-4"].id;
471
- customLayout["pane-4"].id = customLayout["pane-5"].id;
472
- customLayout["pane-5"].id = customLayout["pane-6"].id;
473
- customLayout["pane-6"].id = availableId;
474
- } break;
475
- default:
476
- break;
491
+ break
492
+ case 'pane-3':
493
+ {
494
+ switch (pView) {
495
+ case '3panel':
496
+ {
497
+ customLayout['pane-3'].id = availableId
498
+ }
499
+ break
500
+ case '4panel':
501
+ {
502
+ customLayout['pane-3'].id = customLayout['pane-4'].id
503
+ customLayout['pane-4'].id = availableId
504
+ }
505
+ break
506
+ case '5panel':
507
+ {
508
+ customLayout['pane-3'].id = customLayout['pane-4'].id
509
+ customLayout['pane-4'].id = customLayout['pane-5'].id
510
+ customLayout['pane-5'].id = availableId
511
+ }
512
+ break
513
+ case '6panelVertical':
514
+ case '6panel':
515
+ {
516
+ customLayout['pane-3'].id = customLayout['pane-4'].id
517
+ customLayout['pane-4'].id = customLayout['pane-5'].id
518
+ customLayout['pane-5'].id = customLayout['pane-6'].id
519
+ customLayout['pane-6'].id = availableId
520
+ }
521
+ break
522
+ default:
523
+ break
524
+ }
477
525
  }
478
- } break;
479
- case "pane-4": {
480
- switch (pView) {
481
- case "4panel": {
482
- customLayout["pane-4"].id = availableId;
483
- } break;
484
- case "5panel": {
485
- customLayout["pane-4"].id = customLayout["pane-5"].id;
486
- customLayout["pane-5"].id = availableId;
487
- } break;
488
- case "6panelVertical":
489
- case "6panel": {
490
- customLayout["pane-4"].id = customLayout["pane-5"].id;
491
- customLayout["pane-5"].id = customLayout["pane-6"].id;
492
- customLayout["pane-6"].id = availableId;
493
- } break;
494
- default:
495
- break;
526
+ break
527
+ case 'pane-4':
528
+ {
529
+ switch (pView) {
530
+ case '4panel':
531
+ {
532
+ customLayout['pane-4'].id = availableId
533
+ }
534
+ break
535
+ case '5panel':
536
+ {
537
+ customLayout['pane-4'].id = customLayout['pane-5'].id
538
+ customLayout['pane-5'].id = availableId
539
+ }
540
+ break
541
+ case '6panelVertical':
542
+ case '6panel':
543
+ {
544
+ customLayout['pane-4'].id = customLayout['pane-5'].id
545
+ customLayout['pane-5'].id = customLayout['pane-6'].id
546
+ customLayout['pane-6'].id = availableId
547
+ }
548
+ break
549
+ default:
550
+ break
551
+ }
496
552
  }
497
- } break;
498
- case "pane-5": {
499
- switch (pView) {
500
- case "5panel": {
501
- customLayout["pane-5"].id = availableId;
502
- } break;
503
- case "6panelVertical":
504
- case "6panel": {
505
- customLayout["pane-5"].id = customLayout["pane-6"].id;
506
- customLayout["pane-6"].id = availableId;
507
- } break;
508
- default:
509
- break;
553
+ break
554
+ case 'pane-5':
555
+ {
556
+ switch (pView) {
557
+ case '5panel':
558
+ {
559
+ customLayout['pane-5'].id = availableId
560
+ }
561
+ break
562
+ case '6panelVertical':
563
+ case '6panel':
564
+ {
565
+ customLayout['pane-5'].id = customLayout['pane-6'].id
566
+ customLayout['pane-6'].id = availableId
567
+ }
568
+ break
569
+ default:
570
+ break
571
+ }
510
572
  }
511
- } break;
512
- case "pane-6" : {
513
- switch (pView) {
514
- case "6panelVertical":
515
- case "6panel":
516
- {
517
- customLayout["pane-6"].id = availableId;
518
- } break;
519
- default:
520
- break;
573
+ break
574
+ case 'pane-6':
575
+ {
576
+ switch (pView) {
577
+ case '6panelVertical':
578
+ case '6panel':
579
+ {
580
+ customLayout['pane-6'].id = availableId
581
+ }
582
+ break
583
+ default:
584
+ break
585
+ }
521
586
  }
522
- } break;
587
+ break
523
588
  default:
524
- break;
589
+ break
525
590
  }
526
591
  for (const [key, value] of Object.entries(customLayout)) {
527
- this.customLayout[key] = value;
592
+ this.customLayout[key] = value
528
593
  }
529
594
  }
530
595
  }
531
596
  },
532
597
  updateSplitPanels() {
533
- EventBus.emit('species-layout-connectivity-update');
598
+ EventBus.emit('species-layout-connectivity-update')
534
599
  },
535
- }
536
- });
600
+ },
601
+ })