171 lines
4.9 KiB
JavaScript
171 lines
4.9 KiB
JavaScript
/* Test command for console
|
|
Snapshot: timeNow = timeSnapshot
|
|
Confetti: showConfetti()
|
|
*/
|
|
|
|
var canShowCountdown = true;
|
|
var setArcs = false;
|
|
var doConfettiResize = true;
|
|
|
|
var RADIUS = 54;
|
|
var CIRCUMFERENCE = 2 * Math.PI * RADIUS;
|
|
|
|
// Set the date and time after which the snapshot will occur (next discovered block)
|
|
var timeSnapshot = 1519837200; // 28th Feb 2018 @ 17:00:00 UTC
|
|
|
|
|
|
// Get current timestamp and set as timeNow via response header of a tiny file at endpoint
|
|
var timeNow;
|
|
fetch('/favicons/manifest.json?rand='+Math.floor((Math.random()*10000000)+1)).then(function(response) {
|
|
var headerDate = response.headers.get('Date')
|
|
Date.prototype.getUnixTime = function() { return this.getTime()/1000|0 };
|
|
timeNow = new Date(headerDate).getUnixTime();
|
|
|
|
// Every 1 sec, count down the timer, establish unit values
|
|
// and if we've passed the snapshot date & time, switch to that message display
|
|
if (canShowCountdown && timeSnapshot > timeNow) {
|
|
$("#countdownRoot").css('display',' block');
|
|
|
|
tickoverCountdown = setInterval(function() {
|
|
countdownTime();
|
|
establishCountdownValues();
|
|
|
|
if (timeSnapshot < timeNow) {
|
|
showAwaitingBlock();
|
|
clearInterval(tickoverCountdown);
|
|
}
|
|
},1000);
|
|
} else {
|
|
$("#splashRoot").css('display','block');
|
|
}
|
|
});
|
|
|
|
|
|
// Increment timer
|
|
var countdownTime = function() {
|
|
timeNow++;
|
|
}
|
|
|
|
|
|
// Establish new unit values
|
|
var establishCountdownValues = function() {
|
|
var timeRemaining = timeSnapshot-timeNow;
|
|
daysRemaining = parseInt(timeRemaining/60/60/24,10);
|
|
hoursRemaining = parseInt((timeRemaining-(daysRemaining*60*60*24))/60/60,10);
|
|
minsRemaining = parseInt((timeRemaining-(daysRemaining*60*60*24)-(hoursRemaining*60*60))/60,10);
|
|
secsRemaining = parseInt(timeRemaining-(daysRemaining*60*60*24)-(hoursRemaining*60*60)-(minsRemaining*60),10);
|
|
|
|
setUnitPosition('Days', 7, daysRemaining);
|
|
setUnitPosition('Hours', 24, hoursRemaining);
|
|
setUnitPosition('Mins',60, minsRemaining);
|
|
setUnitPosition('Secs',60, secsRemaining);
|
|
|
|
// If we haven't set arcs around units yet, set animation delay offsets
|
|
if (!setArcs) {
|
|
// Fade in counter container now
|
|
fadeInCountdownContainer();
|
|
// Set flag so we don't get here again
|
|
setArcs = true;
|
|
}
|
|
}
|
|
|
|
|
|
// Fade in the counter container
|
|
var fadeInCountdownContainer = function() {
|
|
$('#countdownContainer').css('opacity', 1);
|
|
}
|
|
|
|
|
|
var foundBlocks = {
|
|
zcl: false,
|
|
btc: false,
|
|
}
|
|
|
|
// Show the awaiting next block message
|
|
var showAwaitingBlock = function() {
|
|
$('#countdownContainer').css('display','none');
|
|
$('#awaitingContainer').css('display','block');
|
|
$('#blockDetails').css('display','block');
|
|
$('#confetti').css('display','none');
|
|
$('#snapshotContainer').css('display','none');
|
|
|
|
// First Try fetching blocks
|
|
fetchBlocks();
|
|
|
|
// Then poll for blocks every 5 secs
|
|
var getBlocksPolling = setInterval(function() {
|
|
// Fetch and update blocks
|
|
fetchBlocks();
|
|
updateBlocks(foundBlocks.zcl, foundBlocks.btc);
|
|
// If we have block heights on both ZCL and BTC, show confetti
|
|
if (foundBlocks.zcl !== false && foundBlocks.btc !== false) {
|
|
clearInterval(getBlocksPolling);
|
|
showConfetti();
|
|
}
|
|
},5000);
|
|
}
|
|
|
|
|
|
// Fetch new data from blocks
|
|
var fetchBlocks = function() {
|
|
// Get block height data from JSON file
|
|
fetch('/javascript/blocks.json?rand='+Math.floor((Math.random()*10000000)+1))
|
|
// Return the data
|
|
.then(function(response) {
|
|
return response.json();
|
|
// Process the data
|
|
}).then(function(jsonData) {
|
|
foundBlocks = jsonData;
|
|
// Set ZCL block height or placeholder text
|
|
$('#awaitingContainerZclassic').html(
|
|
foundBlocks.zcl !== false
|
|
? foundBlocks.zcl
|
|
: "Awaiting..."
|
|
);
|
|
// Set BTC block height or placeholder text
|
|
$('#awaitingContainerBitcoin').html(
|
|
foundBlocks.btc !== false
|
|
? foundBlocks.btc
|
|
: "Awaiting..."
|
|
);
|
|
// Output error message to console
|
|
}).catch(function(err) {
|
|
console.log("getBlocksPolling - failed!", err);
|
|
})
|
|
}
|
|
|
|
// Update ZCL & BTC block
|
|
var updateBlocks = function(zcl, btc) {
|
|
if (zcl !== false) {
|
|
$('#awaitingContainerZclassic').html(zcl);
|
|
}
|
|
if (btc !== false) {
|
|
$('#awaitingContainerBitcoin').html(btc);
|
|
}
|
|
}
|
|
|
|
|
|
// Show confetti and snapshot message
|
|
var showConfetti = function() {
|
|
$('#countdownContainer').css('display','none');
|
|
$('#awaitingContainer').css('display','none');
|
|
$('#confetti').css('display','block');
|
|
$('#snapshotContainer').css('display','block');
|
|
$('#blockDetails').css('display','block');
|
|
var script = document.createElement('script');
|
|
script.type = 'text/javascript';
|
|
script.src = '/javascript/Confetti.js';
|
|
document.getElementsByTagName('head')[0].appendChild(script);
|
|
}
|
|
|
|
|
|
// Countdown initial style
|
|
var setUnitPosition = function(unit, size, remaining) {
|
|
// Set values in DOM elems
|
|
$('.counter__'+unit.toLowerCase() + '_progress').attr("stroke-dasharray", CIRCUMFERENCE);
|
|
$('#countdown'+unit).text(remaining);
|
|
$('#countdown'+unit).attr("data-size", size);
|
|
var current = CIRCUMFERENCE - ((CIRCUMFERENCE / size) * remaining)
|
|
$('.counter__'+unit.toLowerCase() + '_progress').attr("stroke-dashoffset", current);
|
|
}
|