mirrors/CyberChef
1
0
Fork 0
mirror of https://github.com/gchq/CyberChef.git synced 2025-04-20 23:06:16 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Replaced loading animation with animated Bombe SVG

Browse source
This commit is contained in:
n1474335 2019-01-15 19:03:17 +00:00 • committed by s2224834
parent ffc4b0a0a8
commit 02b9dbdee9
6 changed files with 349 additions and 66 deletions
Download patch file Download diff file Expand all files Collapse all files

41
src/web/OutputWaiter.mjs
View file

@ -334,24 +334,55 @@ class OutputWaiter {
/**
* Shows or hides the loading icon.
* Save bombe object before it is removed so that it can be used later
*/
saveBombe() {
this.bombeEl = document.getElementById("bombe").cloneNode();
this.bombeEl.setAttribute("width", "100%");
this.bombeEl.setAttribute("height", "100%");
}
/**
* Shows or hides the output loading screen.
* The animated Bombe SVG, whilst quite aesthetically pleasing, is reasonably CPU
* intensive, so we remove it from the DOM when not in use. We only show it if the
* recipe is taking longer than 200ms. We add it to the DOM just before that so that
* it is ready to fade in without stuttering.
*
* @param {boolean} value
* @param {boolean} value - true == show loader
*/
toggleLoader(value) {
clearTimeout(this.appendBombeTimeout);
clearTimeout(this.outputLoaderTimeout);
const outputLoader = document.getElementById("output-loader"),
outputElement = document.getElementById("output-text");
outputElement = document.getElementById("output-text"),
loader = outputLoader.querySelector(".loader");
if (value) {
this.manager.controls.hideStaleIndicator();
this.bakingStatusTimeout = setTimeout(function() {
// Start a timer to add the Bombe to the DOM just before we make it
// visible so that there is no stuttering
this.appendBombeTimeout = setTimeout(function() {
loader.appendChild(this.bombeEl);
}.bind(this), 150);
// Show the loading screen
this.outputLoaderTimeout = setTimeout(function() {
outputElement.disabled = true;
outputLoader.style.visibility = "visible";
outputLoader.style.opacity = 1;
this.manager.controls.toggleBakeButtonFunction(true);
}.bind(this), 200);
} else {
clearTimeout(this.bakingStatusTimeout);
// Remove the Bombe from the DOM to save resources
this.outputLoaderTimeout = setTimeout(function () {
try {
loader.removeChild(this.bombeEl);
} catch (err) {}
}.bind(this), 500);
outputElement.disabled = false;
outputLoader.style.opacity = 0;
outputLoader.style.visibility = "hidden";