diff --git a/_includes/feed.liquid b/_includes/feed.liquid index a7c2e899bf9..6417594bd0f 100644 --- a/_includes/feed.liquid +++ b/_includes/feed.liquid @@ -131,11 +131,13 @@ section: ethereum {% endif %} render = (data) => { + let headers = []; let html = ''; if(data[selectedNetwork]) { for(let network of data[selectedNetwork].networks) { if (network.dataType != "por" && network.dataType != "nftFloor") { html += `

${network.name} Link to this section

`; + headers.push(network.name); if(network.networkType == "mainnet" && data[selectedNetwork].networkStatusUrl){ html += `

Track the status of this network at ${data[selectedNetwork].networkStatusUrl}

`; } @@ -201,6 +203,19 @@ section: ethereum } else { html = `Couldn't render the feed list, it may still be processing. Feeds are updated about every half hour..`; } + + // Table of Contents + let toc = ''; + toc += `

Networks

+ `; + html = toc + html; + + // Render HTML dest.innerHTML = html; dest.querySelectorAll('.extra').forEach((item) => item.addEventListener('change', () => { showExtraDetails = event.target.checked; @@ -220,8 +235,20 @@ section: ethereum .then(response => response.json()) .then(json => { render(json); + goToNetwork(); }); + async function goToNetwork() { + if (window.location.hash.length) { + anchorHash = window.location.hash.substring(1); + try { + document.getElementById(decodeURI(anchorHash)).scrollIntoView(); + }catch(e){ + } + } + } + + function setNet(networkName){ document.getElementById(selectedNetwork).classList.toggle("selectedNetwork"); selectedNetwork = networkName; @@ -231,7 +258,11 @@ section: ethereum render(json); }); document.getElementById(networkName).classList.toggle("selectedNetwork"); + let stateObj = { foo: "bar" } + queryParam = "?network=" + selectedNetwork; + history.pushState(stateObj, "page 2", queryParam); } + {% if whatsnext %} diff --git a/_includes/por-feed.liquid b/_includes/por-feed.liquid index cbcb55a60c5..6d36eaff03a 100644 --- a/_includes/por-feed.liquid +++ b/_includes/por-feed.liquid @@ -127,12 +127,14 @@ section: ethereum "deprecating": '' } render = (data) => { + let headers = []; let html = ''; if(data) { for(let stub in data){ for(let network of data[stub].networks) { if (network.dataType == "por") { html += `

${network.name} Link to this section

`; + headers.push(network.name); if(network.networkType == "mainnet" && data[stub].networkStatusUrl){ html += `

Track the status of this network at ${data[stub].networkStatusUrl}

`; } @@ -180,6 +182,19 @@ section: ethereum } else { html = `Couldn't render the feed list, it may still be processing. Feeds are updated about every half hour..`; } + + // Table of Contents + let toc = ''; + toc += `

Networks

+ `; + html = toc + html; + + // Render HTML dest.innerHTML = html; dest.querySelectorAll('.extra').forEach((item) => item.addEventListener('change', () => { showExtraDetails = event.target.checked; @@ -199,7 +214,19 @@ section: ethereum .then(response => response.json()) .then(json => { render(json); + goToNetwork(); }); + + async function goToNetwork() { + if (window.location.hash.length) { + anchorHash = window.location.hash.substring(1); + try { + document.getElementById(decodeURI(anchorHash)).scrollIntoView(); + }catch(e){ + } + } + } +