| |
@@ -35,6 +35,12 @@
|
| |
"metal_virt": "Bare Metal & Virtualized",
|
| |
"cloud_operator": "For Cloud Operators"
|
| |
}
|
| |
+ // frequently used IDs
|
| |
+ const IdPool = {
|
| |
+ "cloud_launchable": "cloud-launchable",
|
| |
+ "metal_virt": "metal-virt",
|
| |
+ "cloud_operator": "cloud-operator"
|
| |
+ }
|
| |
function getMember(obj, member) {
|
| |
return (member in obj) ? obj[member] : null;
|
| |
}
|
| |
@@ -76,6 +82,8 @@
|
| |
el: '#coreos-download-app',
|
| |
created: function() { this.refreshStream() },
|
| |
data: {
|
| |
+ // currently shown tab
|
| |
+ shownId: IdPool.cloud_launchable,
|
| |
// currently selected stream
|
| |
stream: 'testing',
|
| |
// currently selected architecture
|
| |
@@ -128,21 +136,16 @@
|
| |
}
|
| |
},
|
| |
toggleHidden: function(e) {
|
| |
- const id_list = ['cloud-launchable', 'metal-virt', 'cloud-operator'];
|
| |
- switch(e.target.innerText) {
|
| |
- case tabInnerText.cloud_launchable:
|
| |
- show_id = 'cloud-launchable';
|
| |
- id_list.map(id => document.getElementById(id).hidden = (id !== show_id));
|
| |
- break;
|
| |
- case tabInnerText.metal_virt:
|
| |
- show_id = 'metal-virt';
|
| |
- id_list.map(id => document.getElementById(id).hidden = (id !== show_id));
|
| |
- break;
|
| |
- case tabInnerText.cloud_operator:
|
| |
- show_id = 'cloud-operator';
|
| |
+ const id_list = Object.values(IdPool);
|
| |
+ Object.entries(tabInnerText).map(pair => {
|
| |
+ const key = pair[0];
|
| |
+ const val = pair[1];
|
| |
+ if (val === e.target.innerText) {
|
| |
+ const show_id = IdPool[key];
|
| |
id_list.map(id => document.getElementById(id).hidden = (id !== show_id));
|
| |
- break;
|
| |
- }
|
| |
+ this.shownId = show_id;
|
| |
+ }
|
| |
+ });
|
| |
},
|
| |
getNavbar: function(h) {
|
| |
cloud_icon = h('i', { class: "fas fa-cloud mr-2" })
|
| |
@@ -488,9 +491,9 @@
|
| |
let bare_metal_container = h('div', { class: "col-6" }, [ bareMetalTitle, verifyBlurb, bareMetal ]);
|
| |
let virtualized_container = h('div', { class: "col-6" }, [ virtualizedTitle, verifyBlurb, virtualized ]);
|
| |
|
| |
- let cloud_launchable_container = h('div', { class: "col-12 py-2 my-2", attrs: { id: "cloud-launchable", hidden: false} }, [ cloudLaunchableTitle, cloudLaunchable ]);
|
| |
- let metal_virt_container = h('div', { class: "row col-12 py-2 my-2", attrs: { id: "metal-virt", hidden: true } }, [ bare_metal_container, virtualized_container ]);
|
| |
- let cloud_operators_container = h('div', { class: "col-12 py-2 my-2", attrs: { id: "cloud-operator", hidden: true } }, [ cloudTitle, verifyBlurb, cloud ]);
|
| |
+ let cloud_launchable_container = h('div', { class: "col-12 py-2 my-2", attrs: { id: IdPool.cloud_launchable, hidden: this.shownId !== IdPool.cloud_launchable } }, [ cloudLaunchableTitle, cloudLaunchable ]);
|
| |
+ let metal_virt_container = h('div', { class: "row col-12 py-2 my-2", attrs: { id: IdPool.metal_virt, hidden: this.shownId !== IdPool.metal_virt } }, [ bare_metal_container, virtualized_container ]);
|
| |
+ let cloud_operators_container = h('div', { class: "col-12 py-2 my-2", attrs: { id: IdPool.cloud_operator, hidden: this.shownId !== IdPool.cloud_operator } }, [ cloudTitle, verifyBlurb, cloud ]);
|
| |
|
| |
return h('div', {}, [
|
| |
stream_select_container,
|
| |
abai
commented 5 years ago
Fixes a bug that when users select a stream, the div section will be re-rendered into
default "Cloud Launchable" instead of the tab users selected, creating inconsistency
between tab button and tab view.
To reproduce, select a tab other than "Cloud Launchable", say "For Cloud Operators".
If we now select another stream, the div section below will be re-rendered with the
default "Cloud Launchable".
Also factors out the frequently used div IDs and deduplicates "toggleHidden" function.
Signed-off-by: Allen Bai abai@redhat.com