@abi-software/mapintegratedvuer 1.17.1 → 1.17.3-simulation.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.
Files changed (43) hide show
  1. package/dist/{ConnectivityGraph-BL4B9GZX.js → ConnectivityGraph-9pXPgFJR.js} +2 -2
  2. package/dist/{ContentMixin-Djmb_gqk.js → ContentMixin-DIqgKIz6.js} +279 -536
  3. package/dist/Flatmap-D7GVPV7o.js +103422 -0
  4. package/dist/{Iframe-ByYxT4Yq.js → Iframe-CCEA3d9c.js} +2 -2
  5. package/dist/{MultiFlatmap-DSkdlRiS.js → MultiFlatmap-Cuke1uNp.js} +3 -3
  6. package/dist/{Plot-ymkHVq_A.js → Plot-B4oTBVAT.js} +2 -2
  7. package/dist/{Scaffold-bw7posKm.js → Scaffold-Czz8X5kL.js} +79 -53
  8. package/dist/Simulation-BKmz8zwm.js +107 -0
  9. package/dist/{index-CwfUgFL1.js → index-_b4VBGHk.js} +30002 -25408
  10. package/dist/mapintegratedvuer.js +1 -1
  11. package/dist/mapintegratedvuer.umd.cjs +4291 -229
  12. package/dist/style-CM86xE3J.js +119 -0
  13. package/dist/style.css +1 -1
  14. package/package.json +10 -5
  15. package/src/App.vue +285 -258
  16. package/src/assets/styles.scss +1 -1
  17. package/src/components/ContextCard.vue +0 -1
  18. package/src/components/DummyRouteComponent.vue +1 -0
  19. package/src/components/EventBus.ts +13 -0
  20. package/src/components/FloatingWindow.vue +142 -0
  21. package/src/components/MapContent.vue +9 -4
  22. package/src/components/PlotComponent.vue +56 -0
  23. package/src/components/SplitDialog.vue +1 -6
  24. package/src/components/SplitFlow.vue +504 -444
  25. package/src/components/scripts/utilities.js +1 -1
  26. package/src/components/viewers/Flatmap.vue +166 -83
  27. package/src/components/viewers/Simulation.vue +118 -11
  28. package/src/components.d.ts +3 -0
  29. package/src/main.js +9 -3
  30. package/src/mixins/ContentMixin.js +467 -406
  31. package/src/mixins/DynamicMarkerMixin.js +50 -17
  32. package/src/services/mapping.js +69 -0
  33. package/src/services/testData.js +71 -0
  34. package/src/stores/entries.js +1 -1
  35. package/src/stores/mapping.js +29 -0
  36. package/src/stores/settings.js +4 -0
  37. package/src/stores/simulationPlotStore.js +124 -0
  38. package/src/stores/splitFlow.js +425 -352
  39. package/src/types/simulation.js +18 -0
  40. package/dist/Flatmap-uPEQNDkK.js +0 -202
  41. package/dist/Simulation-C_gdqDes.js +0 -28
  42. package/dist/style-Czqe2bTf.js +0 -57
  43. 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
90
  //cache it and find one later
93
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,63 +159,83 @@ 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
+ }
227
+ },
228
+ isIdVisible: (getters) => (id) => {
229
+ const paneName = getters.getPaneNameById(id);
230
+ let visible = false;
231
+ if (paneName !== undefined) {
232
+ visible = getters.isPaneActive(paneName);
233
+ }
234
+ return visible;
217
235
  },
218
236
  isPaneActive: (state) => (panelName) => {
219
- const layout = presetLayouts(state.activeView);
220
- return (Object.keys(layout).includes(panelName));
237
+ const layout = presetLayouts(state.activeView)
238
+ return Object.keys(layout).includes(panelName)
221
239
  },
222
240
  },
223
241
  actions: {
@@ -225,43 +243,44 @@ export const useSplitFlowStore = defineStore('splitFlow', {
225
243
  let sourceKey = findKeyWithId(this.customLayout, payload.source);
226
244
  let targetKey = findKeyWithId(this.customLayout, payload.target);
227
245
  if (targetKey) {
228
- this.customLayout[targetKey].id = payload.source;
246
+ this.customLayout[targetKey].id = payload.source
229
247
  }
230
248
  if (sourceKey) {
231
- this.customLayout[sourceKey].id = payload.target;
249
+ this.customLayout[sourceKey].id = payload.target
232
250
  }
233
251
  if (emitSpeciesChanged) {
234
252
  this.updateSplitPanels();
235
253
  }
236
254
  },
237
255
  getAvailableTerms(apiLocation) {
238
- let terms = getAvailableTermsForSpecies();
256
+ let terms = getAvailableTermsForSpecies()
239
257
  for (let i = 0; i < terms.length; i++) {
240
- this.idNamePair[terms[i].id] = terms[i].name;
258
+ this.idNamePair[terms[i].id] = terms[i].name
241
259
  }
242
260
  if (apiLocation) {
243
- if (this._controller) this._controller.abort();
244
- this._controller = new AbortController();
245
- let signal = this._controller.signal;
261
+ if (this._controller) this._controller.abort()
262
+ this._controller = new AbortController()
263
+ let signal = this._controller.signal
246
264
  fetch(`${apiLocation}get-organ-curies`, {
247
265
  signal,
248
266
  })
249
- .then(response => response.json())
250
- .then(data => {
251
- this._controller = undefined;
252
- data.uberon.array.forEach(pair => {
253
- this.idNamePair[pair.id.toUpperCase()] =
254
- pair.name.charAt(0).toUpperCase() + pair.name.slice(1);
255
- });
256
- return;
257
- });
267
+ .then((response) => response.json())
268
+ .then((data) => {
269
+ this._controller = undefined
270
+ data.uberon.array.forEach((pair) => {
271
+ this.idNamePair[pair.id.toUpperCase()] = pair.name.charAt(0).toUpperCase() + pair.name.slice(1)
272
+ })
273
+ return
274
+ })
258
275
  }
259
276
  },
260
- updateActiveView(payload, emitSpeciesChanged = true) {
277
+ updateActiveView(payload, autoAssign = true, emitSpeciesChanged = true) {
261
278
  this.activeView = payload.view;
262
279
  const customLayout = newLayoutWithOrigInfo(
263
280
  this.customLayout, this.activeView);
264
- autoAssignEntryIdsToPane(payload.entries, customLayout);
281
+ if (autoAssign) {
282
+ autoAssignEntryIdsToPane(payload.entries, customLayout);
283
+ }
265
284
  for (const [key, value] of Object.entries(customLayout)) {
266
285
  this.customLayout[key] = value;
267
286
  }
@@ -270,271 +289,325 @@ export const useSplitFlowStore = defineStore('splitFlow', {
270
289
  }
271
290
  },
272
291
  setSplitter(payload) {
273
- if (this.splitters[payload.name])
274
- this.splitters[payload.name] = payload.value;
292
+ if (this.splitters[payload.name]) this.splitters[payload.name] = payload.value
275
293
  },
276
294
  setState(newState) {
277
295
  if (newState) {
278
- let customLayout = undefined;
296
+ let customLayout = undefined
279
297
  if (newState.activeView) {
280
- this.activeView = newState.activeView;
298
+ this.activeView = newState.activeView
281
299
  }
282
300
  if (newState.customLayout) {
283
- customLayout = newState.customLayout;
301
+ customLayout = newState.customLayout
284
302
  } else {
285
- customLayout = presetLayouts(this.activeView);
303
+ customLayout = presetLayouts(this.activeView)
286
304
  if (newState.slotInfo) {
287
305
  for (let i = 0; i < newState.slotInfo.length; i++) {
288
306
  switch (newState.slotInfo[i].name) {
289
- case "first": {
290
- customLayout["pane-1"].id = newState.slotInfo[i].id;
291
- } break;
292
- case "second": {
293
- if("pane-2" in customLayout)
294
- customLayout["pane-2"].id = newState.slotInfo[i].id;
295
- } break;
296
- case "thrid": {
297
- if("pane-3" in customLayout)
298
- customLayout["pane-3"].id = newState.slotInfo[i].id;
299
- } break;
300
- case "fourth": {
301
- if("pane-4" in customLayout)
302
- customLayout["pane-4"].id = newState.slotInfo[i].id;
303
- } break;
304
- case "fifth": {
305
- if("pane-5" in customLayout)
306
- customLayout["pane-5"].id = newState.slotInfo[i].id;
307
- } break;
308
- case "sixth": {
309
- if("pane-6" in customLayout)
310
- customLayout["pane-6"].id = newState.slotInfo[i].id;
311
- } break;
307
+ case 'first':
308
+ {
309
+ customLayout['pane-1'].id = newState.slotInfo[i].id
310
+ }
311
+ break
312
+ case 'second':
313
+ {
314
+ if ('pane-2' in customLayout) customLayout['pane-2'].id = newState.slotInfo[i].id
315
+ }
316
+ break
317
+ case 'thrid':
318
+ {
319
+ if ('pane-3' in customLayout) customLayout['pane-3'].id = newState.slotInfo[i].id
320
+ }
321
+ break
322
+ case 'fourth':
323
+ {
324
+ if ('pane-4' in customLayout) customLayout['pane-4'].id = newState.slotInfo[i].id
325
+ }
326
+ break
327
+ case 'fifth':
328
+ {
329
+ if ('pane-5' in customLayout) customLayout['pane-5'].id = newState.slotInfo[i].id
330
+ }
331
+ break
332
+ case 'sixth':
333
+ {
334
+ if ('pane-6' in customLayout) customLayout['pane-6'].id = newState.slotInfo[i].id
335
+ }
336
+ break
312
337
  default:
313
- break;
338
+ break
314
339
  }
315
340
  }
316
341
  }
317
342
  }
318
343
  for (const [key, value] of Object.entries(customLayout)) {
319
- this.customLayout[key] = value;
344
+ this.customLayout[key] = value
320
345
  }
321
346
  for (const [key, value] of Object.entries(newState.splitters)) {
322
- this.splitters[key] = value;
347
+ this.splitters[key] = value
323
348
  }
324
349
  }
325
350
  },
326
- setIdToPrimaryPane(id) {
327
- const currentKey = findKeyWithId(this.customLayout, id);
328
- const firstPaneId = this.customLayout["pane-1"].id;
329
- this.customLayout["pane-1"].id = id;
351
+ setIdToPane(id, pane = 'pane-1') {
352
+ const currentKey = findKeyWithId(this.customLayout, id)
353
+ const firstPaneId = this.customLayout[pane].id
354
+ this.customLayout[pane].id = id
330
355
  if (currentKey) {
331
- this.customLayout[currentKey].id = firstPaneId;
356
+ this.customLayout[currentKey].id = firstPaneId
332
357
  }
333
358
  },
334
359
  reset() {
335
- const original = getOriginalState();
336
- this.activeView = original.activeView;
337
- this.customLayout = original.customLayout;
338
- this.splitters = original.splitters;
360
+ const original = getOriginalState()
361
+ this.activeView = original.activeView
362
+ this.customLayout = original.customLayout
363
+ this.splitters = original.splitters
339
364
  },
340
365
  closeSlot(payload) {
341
366
  if (payload) {
342
- let availableId = 0;
367
+ let availableId = 0
343
368
  if (payload.entries) {
344
- for (let i = 0; i < payload.entries.length &&
345
- availableId == 0; i++) {
369
+ for (let i = 0; i < payload.entries.length && availableId == 0; i++) {
346
370
  //Find the first entry not currently in use
347
- if ((payload.entries[i].id !== payload.id) &&
348
- findKeyWithId(this.customLayout, payload.entries[i].id) === undefined) {
349
- availableId = payload.entries[i].id;
371
+ if (
372
+ payload.entries[i].id !== payload.id &&
373
+ findKeyWithId(this.customLayout, payload.entries[i].id) === undefined
374
+ ) {
375
+ availableId = payload.entries[i].id
350
376
  }
351
377
  }
352
378
  }
353
379
  //Switch the view
354
- if (this.activeView !== "customise") {
380
+ if (this.activeView !== 'customise') {
355
381
  //closePaneWithStandardLayout
356
- const pView = this.activeView;
382
+ const pView = this.activeView
357
383
  switch (this.activeView) {
358
- case "2horpanel":
359
- case "2vertpanel":
360
- this.activeView = "singlepanel";
361
- break;
362
- case "3panel":
363
- this.activeView = "2vertpanel";
364
- break;
365
- case "4panel":
366
- this.activeView = "3panel";
367
- break;
368
- case "5panel":
369
- this.activeView = "4panel";
370
- break;
371
- case "6panelVertical":
372
- case "6panel":
373
- this.activeView = "5panel";
374
- break;
384
+ case '2horpanel':
385
+ case '2vertpanel':
386
+ this.activeView = 'singlepanel'
387
+ break
388
+ case '3panel':
389
+ this.activeView = '2vertpanel'
390
+ break
391
+ case '4panel':
392
+ this.activeView = '3panel'
393
+ break
394
+ case '5panel':
395
+ this.activeView = '4panel'
396
+ break
397
+ case '6panelVertical':
398
+ case '6panel':
399
+ this.activeView = '5panel'
400
+ break
375
401
  default:
376
- break;
402
+ break
377
403
  }
378
- const customLayout = newLayoutWithOrigInfo(
379
- this.customLayout, this.activeView);
380
- const key = findKeyWithId(this.customLayout, payload.id);
404
+ const customLayout = newLayoutWithOrigInfo(this.customLayout, this.activeView)
405
+ const key = findKeyWithId(this.customLayout, payload.id)
381
406
  // The following move the entry id to the appropriate slot
382
407
  // and remove the target id
383
408
  switch (key) {
384
- case "pane-1": {
385
- switch (pView) {
386
- case "2horpanel":
387
- case "2vertpanel": {
388
- customLayout["pane-1"].id = customLayout["pane-2"].id;
389
- customLayout["pane-2"].id = availableId;
390
- } break;
391
- case "3panel": {
392
- customLayout["pane-1"].id = customLayout["pane-2"].id;
393
- customLayout["pane-2"].id = customLayout["pane-3"].id;
394
- customLayout["pane-3"].id = availableId;
395
- } break;
396
- case "4panel": {
397
- customLayout["pane-1"].id = customLayout["pane-2"].id;
398
- customLayout["pane-2"].id = customLayout["pane-3"].id;
399
- customLayout["pane-3"].id = customLayout["pane-4"].id;
400
- customLayout["pane-4"].id = availableId;
401
- } break;
402
- case "5panel": {
403
- customLayout["pane-1"].id = customLayout["pane-2"].id;
404
- customLayout["pane-2"].id = customLayout["pane-3"].id;
405
- customLayout["pane-3"].id = customLayout["pane-4"].id;
406
- customLayout["pane-4"].id = customLayout["pane-5"].id;
407
- customLayout["pane-5"].id = availableId;
408
- } break;
409
- case "6panelVertical":
410
- case "6panel":
411
- {
412
- customLayout["pane-1"].id = customLayout["pane-2"].id;
413
- customLayout["pane-2"].id = customLayout["pane-3"].id;
414
- customLayout["pane-3"].id = customLayout["pane-4"].id;
415
- customLayout["pane-4"].id = customLayout["pane-5"].id;
416
- customLayout["pane-5"].id = customLayout["pane-6"].id;
417
- customLayout["pane-6"].id = availableId;
418
- } break;
419
- default:
420
- break;
409
+ case 'pane-1':
410
+ {
411
+ switch (pView) {
412
+ case '2horpanel':
413
+ case '2vertpanel':
414
+ {
415
+ customLayout['pane-1'].id = customLayout['pane-2'].id
416
+ customLayout['pane-2'].id = availableId
417
+ }
418
+ break
419
+ case '3panel':
420
+ {
421
+ customLayout['pane-1'].id = customLayout['pane-2'].id
422
+ customLayout['pane-2'].id = customLayout['pane-3'].id
423
+ customLayout['pane-3'].id = availableId
424
+ }
425
+ break
426
+ case '4panel':
427
+ {
428
+ customLayout['pane-1'].id = customLayout['pane-2'].id
429
+ customLayout['pane-2'].id = customLayout['pane-3'].id
430
+ customLayout['pane-3'].id = customLayout['pane-4'].id
431
+ customLayout['pane-4'].id = availableId
432
+ }
433
+ break
434
+ case '5panel':
435
+ {
436
+ customLayout['pane-1'].id = customLayout['pane-2'].id
437
+ customLayout['pane-2'].id = customLayout['pane-3'].id
438
+ customLayout['pane-3'].id = customLayout['pane-4'].id
439
+ customLayout['pane-4'].id = customLayout['pane-5'].id
440
+ customLayout['pane-5'].id = availableId
441
+ }
442
+ break
443
+ case '6panelVertical':
444
+ case '6panel':
445
+ {
446
+ customLayout['pane-1'].id = customLayout['pane-2'].id
447
+ customLayout['pane-2'].id = customLayout['pane-3'].id
448
+ customLayout['pane-3'].id = customLayout['pane-4'].id
449
+ customLayout['pane-4'].id = customLayout['pane-5'].id
450
+ customLayout['pane-5'].id = customLayout['pane-6'].id
451
+ customLayout['pane-6'].id = availableId
452
+ }
453
+ break
454
+ default:
455
+ break
456
+ }
421
457
  }
422
- } break;
423
- case "pane-2": {
424
- switch (pView) {
425
- case "2horpanel":
426
- case "2vertpanel": {
427
- customLayout["pane-2"].id = availableId;
428
- } break;
429
- case "3panel": {
430
- customLayout["pane-2"].id = customLayout["pane-3"].id;
431
- customLayout["pane-3"].id = availableId;
432
- } break;
433
- case "4panel": {
434
- customLayout["pane-2"].id = customLayout["pane-3"].id;
435
- customLayout["pane-3"].id = customLayout["pane-4"].id;
436
- customLayout["pane-4"].id = availableId;
437
- } break;
438
- case "5panel": {
439
- customLayout["pane-2"].id = customLayout["pane-3"].id;
440
- customLayout["pane-3"].id = customLayout["pane-4"].id;
441
- customLayout["pane-4"].id = customLayout["pane-5"].id;
442
- customLayout["pane-5"].id = availableId;
443
- } break;
444
- case "6panelVertical":
445
- case "6panel":
446
- {
447
- customLayout["pane-2"].id = customLayout["pane-3"].id;
448
- customLayout["pane-3"].id = customLayout["pane-4"].id;
449
- customLayout["pane-4"].id = customLayout["pane-5"].id;
450
- customLayout["pane-5"].id = customLayout["pane-6"].id;
451
- customLayout["pane-6"].id = availableId;
452
- } break;
453
- default:
454
- break;
458
+ break
459
+ case 'pane-2':
460
+ {
461
+ switch (pView) {
462
+ case '2horpanel':
463
+ case '2vertpanel':
464
+ {
465
+ customLayout['pane-2'].id = availableId
466
+ }
467
+ break
468
+ case '3panel':
469
+ {
470
+ customLayout['pane-2'].id = customLayout['pane-3'].id
471
+ customLayout['pane-3'].id = availableId
472
+ }
473
+ break
474
+ case '4panel':
475
+ {
476
+ customLayout['pane-2'].id = customLayout['pane-3'].id
477
+ customLayout['pane-3'].id = customLayout['pane-4'].id
478
+ customLayout['pane-4'].id = availableId
479
+ }
480
+ break
481
+ case '5panel':
482
+ {
483
+ customLayout['pane-2'].id = customLayout['pane-3'].id
484
+ customLayout['pane-3'].id = customLayout['pane-4'].id
485
+ customLayout['pane-4'].id = customLayout['pane-5'].id
486
+ customLayout['pane-5'].id = availableId
487
+ }
488
+ break
489
+ case '6panelVertical':
490
+ case '6panel':
491
+ {
492
+ customLayout['pane-2'].id = customLayout['pane-3'].id
493
+ customLayout['pane-3'].id = customLayout['pane-4'].id
494
+ customLayout['pane-4'].id = customLayout['pane-5'].id
495
+ customLayout['pane-5'].id = customLayout['pane-6'].id
496
+ customLayout['pane-6'].id = availableId
497
+ }
498
+ break
499
+ default:
500
+ break
501
+ }
455
502
  }
456
- } break;
457
- case "pane-3": {
458
- switch (pView) {
459
- case "3panel": {
460
- customLayout["pane-3"].id = availableId;
461
- } break;
462
- case "4panel": {
463
- customLayout["pane-3"].id = customLayout["pane-4"].id;
464
- customLayout["pane-4"].id = availableId;
465
- } break;
466
- case "5panel": {
467
- customLayout["pane-3"].id = customLayout["pane-4"].id;
468
- customLayout["pane-4"].id = customLayout["pane-5"].id;
469
- customLayout["pane-5"].id = availableId;
470
- } break;
471
- case "6panelVertical":
472
- case "6panel":
473
- {
474
- customLayout["pane-3"].id = customLayout["pane-4"].id;
475
- customLayout["pane-4"].id = customLayout["pane-5"].id;
476
- customLayout["pane-5"].id = customLayout["pane-6"].id;
477
- customLayout["pane-6"].id = availableId;
478
- } break;
479
- default:
480
- break;
503
+ break
504
+ case 'pane-3':
505
+ {
506
+ switch (pView) {
507
+ case '3panel':
508
+ {
509
+ customLayout['pane-3'].id = availableId
510
+ }
511
+ break
512
+ case '4panel':
513
+ {
514
+ customLayout['pane-3'].id = customLayout['pane-4'].id
515
+ customLayout['pane-4'].id = availableId
516
+ }
517
+ break
518
+ case '5panel':
519
+ {
520
+ customLayout['pane-3'].id = customLayout['pane-4'].id
521
+ customLayout['pane-4'].id = customLayout['pane-5'].id
522
+ customLayout['pane-5'].id = availableId
523
+ }
524
+ break
525
+ case '6panelVertical':
526
+ case '6panel':
527
+ {
528
+ customLayout['pane-3'].id = customLayout['pane-4'].id
529
+ customLayout['pane-4'].id = customLayout['pane-5'].id
530
+ customLayout['pane-5'].id = customLayout['pane-6'].id
531
+ customLayout['pane-6'].id = availableId
532
+ }
533
+ break
534
+ default:
535
+ break
536
+ }
481
537
  }
482
- } break;
483
- case "pane-4": {
484
- switch (pView) {
485
- case "4panel": {
486
- customLayout["pane-4"].id = availableId;
487
- } break;
488
- case "5panel": {
489
- customLayout["pane-4"].id = customLayout["pane-5"].id;
490
- customLayout["pane-5"].id = availableId;
491
- } break;
492
- case "6panelVertical":
493
- case "6panel": {
494
- customLayout["pane-4"].id = customLayout["pane-5"].id;
495
- customLayout["pane-5"].id = customLayout["pane-6"].id;
496
- customLayout["pane-6"].id = availableId;
497
- } break;
498
- default:
499
- break;
538
+ break
539
+ case 'pane-4':
540
+ {
541
+ switch (pView) {
542
+ case '4panel':
543
+ {
544
+ customLayout['pane-4'].id = availableId
545
+ }
546
+ break
547
+ case '5panel':
548
+ {
549
+ customLayout['pane-4'].id = customLayout['pane-5'].id
550
+ customLayout['pane-5'].id = availableId
551
+ }
552
+ break
553
+ case '6panelVertical':
554
+ case '6panel':
555
+ {
556
+ customLayout['pane-4'].id = customLayout['pane-5'].id
557
+ customLayout['pane-5'].id = customLayout['pane-6'].id
558
+ customLayout['pane-6'].id = availableId
559
+ }
560
+ break
561
+ default:
562
+ break
563
+ }
500
564
  }
501
- } break;
502
- case "pane-5": {
503
- switch (pView) {
504
- case "5panel": {
505
- customLayout["pane-5"].id = availableId;
506
- } break;
507
- case "6panelVertical":
508
- case "6panel": {
509
- customLayout["pane-5"].id = customLayout["pane-6"].id;
510
- customLayout["pane-6"].id = availableId;
511
- } break;
512
- default:
513
- break;
565
+ break
566
+ case 'pane-5':
567
+ {
568
+ switch (pView) {
569
+ case '5panel':
570
+ {
571
+ customLayout['pane-5'].id = availableId
572
+ }
573
+ break
574
+ case '6panelVertical':
575
+ case '6panel':
576
+ {
577
+ customLayout['pane-5'].id = customLayout['pane-6'].id
578
+ customLayout['pane-6'].id = availableId
579
+ }
580
+ break
581
+ default:
582
+ break
583
+ }
514
584
  }
515
- } break;
516
- case "pane-6" : {
517
- switch (pView) {
518
- case "6panelVertical":
519
- case "6panel":
520
- {
521
- customLayout["pane-6"].id = availableId;
522
- } break;
523
- default:
524
- break;
585
+ break
586
+ case 'pane-6':
587
+ {
588
+ switch (pView) {
589
+ case '6panelVertical':
590
+ case '6panel':
591
+ {
592
+ customLayout['pane-6'].id = availableId
593
+ }
594
+ break
595
+ default:
596
+ break
597
+ }
525
598
  }
526
- } break;
599
+ break
527
600
  default:
528
- break;
601
+ break
529
602
  }
530
603
  for (const [key, value] of Object.entries(customLayout)) {
531
- this.customLayout[key] = value;
604
+ this.customLayout[key] = value
532
605
  }
533
606
  }
534
607
  }
535
608
  },
536
609
  updateSplitPanels() {
537
- EventBus.emit('species-layout-connectivity-update');
610
+ EventBus.emit('species-layout-connectivity-update')
538
611
  },
539
- }
540
- });
612
+ },
613
+ })