| |
@@ -33,14 +33,14 @@
|
| |
// innerText of tab button
|
| |
const tabInnerText = {
|
| |
"cloud_launchable": "Cloud Launchable",
|
| |
- "metal_virt": "Bare Metal & Virtualized",
|
| |
+ "metal_virtualized": "Bare Metal & Virtualized",
|
| |
"cloud_operators": "For Cloud Operators"
|
| |
}
|
| |
// frequently used IDs
|
| |
const IdPool = {
|
| |
"cloud_launchable": "cloud-launchable",
|
| |
- "metal_virt": "metal-virt",
|
| |
- "cloud_operators": "cloud-operator"
|
| |
+ "metal_virtualized": "metal-virtualized",
|
| |
+ "cloud_operators": "cloud-operators"
|
| |
}
|
| |
function getMember(obj, member) {
|
| |
return (member in obj) ? obj[member] : null;
|
| |
@@ -142,6 +142,8 @@
|
| |
const key = pair[0];
|
| |
const val = pair[1];
|
| |
if (val === e.target.innerText) {
|
| |
+ const downloadPageUrl = window.location.href.match(/^.*\/coreos\/download/)[0];
|
| |
+ history.pushState(null, null, `${downloadPageUrl}?tab=${key}&stream=${coreos_download_app.stream}`);
|
| |
const show_id = IdPool[key];
|
| |
id_list.map(id => document.getElementById(id).hidden = (id !== show_id));
|
| |
this.shownId = show_id;
|
| |
@@ -154,7 +156,7 @@
|
| |
nav_cloud_launchable = h('li', { class: "nav-item col-4" }, [ nav_cloud_launchable_btn ]);
|
| |
|
| |
server_icon = h('i', { class: "fas fa-server mr-2" })
|
| |
- nav_metal_virt_btn = h('button', { class: "nav-link col-12 h-100 overflow-hidden".concat(this.shownId === IdPool.metal_virt ? " active" : ""), attrs: { "data-toggle": "tab" }, on: { click: this.toggleHidden } }, [ server_icon, tabInnerText.metal_virt ]);
|
| |
+ nav_metal_virt_btn = h('button', { class: "nav-link col-12 h-100 overflow-hidden".concat(this.shownId === IdPool.metal_virtualized ? " active" : ""), attrs: { "data-toggle": "tab" }, on: { click: this.toggleHidden } }, [ server_icon, tabInnerText.metal_virtualized ]);
|
| |
nav_metal_virt = h('li', { class: "nav-item col-4" }, [ nav_metal_virt_btn ]);
|
| |
|
| |
cloud_upload_icon = h('i', { class: "fas fa-cloud-upload-alt mr-2" })
|
| |
@@ -166,6 +168,7 @@
|
| |
},
|
| |
// Add dropdown options of streams
|
| |
getStreamName: function(h) {
|
| |
+ const self = this;
|
| |
if (this.streamData === null) return;
|
| |
option_stable = h('option', { attrs: { value: "stable", selected: this.stream === "stable" ? "selected" : null }}, "stable");
|
| |
option_testing = h('option', { attrs: { value: "testing", selected: this.stream === "testing" ? "selected" : null }}, "testing");
|
| |
@@ -173,7 +176,10 @@
|
| |
class: "mx-1",
|
| |
on: {
|
| |
change: function(e) {
|
| |
+ const downloadPageUrl = window.location.href.match(/^.*\/coreos\/download/)[0];
|
| |
+ const currentShownKey = Object.keys(IdPool).find(key => IdPool[key] === self.shownId);
|
| |
coreos_download_app.stream = e.target.value;
|
| |
+ history.pushState(null, null, `${downloadPageUrl}?tab=${currentShownKey}&stream=${coreos_download_app.stream}`);
|
| |
}
|
| |
}
|
| |
}, [
|
| |
@@ -332,24 +338,44 @@
|
| |
}
|
| |
},
|
| |
render: function(h) {
|
| |
- // Extracts the route under `/coreos/download/`
|
| |
- const route = window.location.pathname.replace(/\/.*\/coreos\/download\//, '').replace(/\/+$/, '');
|
| |
- if (route !== '') {
|
| |
- switch(route) {
|
| |
+ const downloadPageUrl = window.location.href.match(/^.*\/coreos\/download/)[0];
|
| |
+ searchParams = new URLSearchParams(window.location.search);
|
| |
+ // switch to specified tab if `tab` parameter is set
|
| |
+ if (searchParams.has('tab')) {
|
| |
+ switch(searchParams.get('tab')) {
|
| |
case 'cloud_launchable':
|
| |
this.shownId = IdPool.cloud_launchable;
|
| |
break;
|
| |
case 'metal_virtualized':
|
| |
- this.shownId = IdPool.metal_virt;
|
| |
+ this.shownId = IdPool.metal_virtualized;
|
| |
break;
|
| |
case 'cloud_operators':
|
| |
this.shownId = IdPool.cloud_operators;
|
| |
break;
|
| |
default:
|
| |
- // we shouldn't hit this since the routes are safe-guarded by `sites/getfedora.org/main.py`
|
| |
this.shownId = IdPool.cloud_launchable;
|
| |
}
|
| |
+ } else {
|
| |
+ searchParams.set('tab', 'cloud_launchable');
|
| |
}
|
| |
+ // switch to specified stream if `stream` parameter is set
|
| |
+ if (searchParams.has('stream')) {
|
| |
+ switch(searchParams.get('stream')) {
|
| |
+ case 'stable':
|
| |
+ this.stream = "stable";
|
| |
+ break;
|
| |
+ case 'testing':
|
| |
+ this.stream = "testing";
|
| |
+ break;
|
| |
+ default:
|
| |
+ this.stream = "stable";
|
| |
+ }
|
| |
+ } else {
|
| |
+ searchParams.set('stream', 'stable');
|
| |
+ }
|
| |
+ // Update the url with the parameters
|
| |
+ history.pushState(null, null, `${downloadPageUrl}?${searchParams.toString()}`);
|
| |
+
|
| |
var signature_sha256_verification_modal = this.getSignatureAndShaModal(h);
|
| |
var stream_select_container = h('div', { class: "pb-0 pt-3 mb-3" }, [ h('div', { class: "container" }, [ this.getStreamName(h), this.getNavbar(h) ]) ]);
|
| |
if (this.loading) {
|
| |
@@ -564,7 +590,7 @@
|
| |
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: 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 metal_virt_container = h('div', { class: "row col-12 py-2 my-2", attrs: { id: IdPool.metal_virtualized, hidden: this.shownId !== IdPool.metal_virtualized } }, [ bare_metal_container, virtualized_container ]);
|
| |
let cloud_operators_container = h('div', { class: "col-12 py-2 my-2", attrs: { id: IdPool.cloud_operators, hidden: this.shownId !== IdPool.cloud_operators } }, [ cloudTitle, verifyBlurb, cloud ]);
|
| |
|
| |
return h('div', {}, [
|
| |
abai
commented 4 years ago
Reverts https://pagure.io/fedora-web/websites/pull-request/99# since using routing to different tabs introduces more overhead and over-complicates the problem.
For the need of querying different tabs under /coreos/download, a query parameter
tabis used and set when clicking on tabs. This is much simpler than adding routing and redirect to tabs with routes.Also adds an option to specify stream by setting the URL parameter
stream.Usage:
- http://localhost:5000/en/coreos/download/?tab=cloud_operators
- http://localhost:5000/en/coreos/download/?stream=testing
- http://localhost:5000/en/coreos/download/?tab=cloud_launchable&stream=stable
- http://localhost:5000/en/coreos/download?tab=metal_virtualized&stream=testing
Closes: https://github.com/coreos/fedora-coreos-tracker/issues/417
Signed-off-by: Allen Bai abai@redhat.com