Add the v2 launch banner to all pages

deanb1982 · May 15, 2021 · 6dd23da · 6dd23da
1 parent 4581f87
commit 6dd23da
Show file tree

Hide file tree

Showing 13 changed files with 605 additions and 395 deletions.
diff --git a/block.html b/block.html
@@ -214,6 +214,27 @@ <h2 class="page-title">
 						</div>
 					</div>
 				</div>
+				<div class="col-lg-12">
+                  <div class="card" id="v2Status">
+                     <div class="card-header">
+                        <h4 class="card-title">v2 Launch Status</h4>
+                     </div>
+                     <div class="table-responsive">
+                        <table class="table card-table table-vcenter table-mobile-sm">
+                           <tbody>
+                              <tr>
+                                 <th>Swap Period</th>
+                                 <td id="swapPeriodIs"> </td>
+                                 <th>v2 Launch In (est.)</th>
+                                 <td id="v2LaunchIn"> </td>
+                                 <th>v1 Chain Stops In. (est.)</th>
+                                 <td id="v1DeathIn"> </td>
+                              </tr>
+                           </tbody>
+                        </table>
+                     </div>
+                  </div>
+               </div>
 				<div class="row row-deck row-cards">
 					<div class="col-lg-12">
 						<div class="card">

diff --git a/charts.html b/charts.html
@@ -215,6 +215,27 @@ <h2 class="page-title">
 						</div>
 					</div>
 				</div>
+				<div class="col-lg-12">
+                  <div class="card" id="v2Status">
+                     <div class="card-header">
+                        <h4 class="card-title">v2 Launch Status</h4>
+                     </div>
+                     <div class="table-responsive">
+                        <table class="table card-table table-vcenter table-mobile-sm">
+                           <tbody>
+                              <tr>
+                                 <th>Swap Period</th>
+                                 <td id="swapPeriodIs"> </td>
+                                 <th>v2 Launch In (est.)</th>
+                                 <td id="v2LaunchIn"> </td>
+                                 <th>v1 Chain Stops In. (est.)</th>
+                                 <td id="v1DeathIn"> </td>
+                              </tr>
+                           </tbody>
+                        </table>
+                     </div>
+                  </div>
+               </div>
 				<div class="row row-deck row-cards">
 					<div class="col-lg-12">
 						<div class="card">

diff --git a/dist/js/common.js b/dist/js/common.js
@@ -22,6 +22,8 @@ $(document).ready(function () {
     $('.navbar-burger').toggleClass('is-active')
     $('.navbar-menu').toggleClass('is-active')
   })
+
+  getCurrentNetworkHashRateLoop()
 })
 
 function checkForSearchTerm () {
@@ -70,6 +72,33 @@ function getCurrentNetworkHashRateLoop () {
       setTimeout(function () {
         getCurrentNetworkHashRateLoop()
       }, 15000)
+
+	  const v2LaunchSeconds = (ExplorerConfig.v2LaunchHeight - header.height) * ExplorerConfig.blockTargetTime
+      const v1DeathSeconds = (ExplorerConfig.v1DeathHeight - header.height) * ExplorerConfig.blockTargetTime
+
+      const v2Launch = secondsToHumanReadable(v2LaunchSeconds)
+      const v1Death = secondsToHumanReadable(v1DeathSeconds)
+
+      const estimatedLaunch = (Math.floor(Date.now() / 1000) + v2LaunchSeconds)
+      const estimatedDeath = (Math.floor(Date.now() / 1000) + v1DeathSeconds)
+
+      $("#v2LaunchIn").text(v2Launch.days + 'd ' + v2Launch.hours + 'h ' + v2Launch.minutes + 'm ' + v2Launch.seconds + 's').prop('title', (new Date(estimatedLaunch * 1000)).toGMTString())
+      $("#v1DeathIn").text(v1Death.days + 'd ' + v1Death.hours + 'h ' + v1Death.minutes + 'm ' + v1Death.seconds + 's').prop('title', (new Date(estimatedDeath * 1000)).toGMTString())
+
+      if (header.height >= ExplorerConfig.v2LaunchHeight && header.height < ExplorerConfig.v1DeathHeight) {
+        $("#swapPeriodIs").text("Is Active")
+      } else if (header.height < ExplorerConfig.v2LaunchHeight) {
+        $("#swapPeriodIs").text("Has not started")
+      } else if (header.height >= ExplorerConfig.v1DeathHeight) {
+        $("#swapPeriodIs").text("Is Complete")
+      } else {
+        $("#swapPeriodIs").text("Is Inactive")
+      }
+
+	  setInterval(() => {
+		$("#swapPeriodIs").fadeOut(1000)
+		$("#swapPeriodIs").fadeIn(1000)
+	  }, 2000)
     },
     error: function () {
       setTimeout(function () {

diff --git a/dist/js/main.js b/dist/js/main.js
@@ -183,33 +183,6 @@ function getAndDisplayLastBlockHeader() {
       const emiss = (curSupply / maxSupply) * 100
 
       $('#blockchainSupplyEmission').text(numeral(emiss).format('0.000000') + ' %')
-
-      const v2LaunchSeconds = (ExplorerConfig.v2LaunchHeight - data.height) * ExplorerConfig.blockTargetTime
-      const v1DeathSeconds = (ExplorerConfig.v1DeathHeight - data.height) * ExplorerConfig.blockTargetTime
-
-      const v2Launch = secondsToHumanReadable(v2LaunchSeconds)
-      const v1Death = secondsToHumanReadable(v1DeathSeconds)
-
-      const estimatedLaunch = (Math.floor(Date.now() / 1000) + v2LaunchSeconds)
-      const estimatedDeath = (Math.floor(Date.now() / 1000) + v1DeathSeconds)
-
-      $("#v2LaunchIn").text(v2Launch.days + 'd ' + v2Launch.hours + 'h ' + v2Launch.minutes + 'm ' + v2Launch.seconds + 's').prop('title', (new Date(estimatedLaunch * 1000)).toGMTString())
-      $("#v1DeathIn").text(v1Death.days + 'd ' + v1Death.hours + 'h ' + v1Death.minutes + 'm ' + v1Death.seconds + 's').prop('title', (new Date(estimatedDeath * 1000)).toGMTString())
-
-      if (data.height >= ExplorerConfig.v2LaunchHeight && data.height < ExplorerConfig.v1DeathHeight) {
-        $("#swapPeriodIs").text("Is Active")
-      } else if (data.height < ExplorerConfig.v2LaunchHeight) {
-        $("#swapPeriodIs").text("Has not started")
-      } else if (data.height >= ExplorerConfig.v1DeathHeight) {
-        $("#swapPeriodIs").text("Is Complete")
-      } else {
-        $("#swapPeriodIs").text("Is Inactive")
-      }
-
-	  setInterval(() => {
-		$("#swapPeriodIs").fadeOut(1000)
-		$("#swapPeriodIs").fadeIn(1000)
-	  }, 2000)
     }
   })
 }