From 0ce0db610b356ae4eee73450319a8dd30503fe20 Mon Sep 17 00:00:00 2001 From: Adam Gedeborg Date: Tue, 29 Mar 2022 21:41:14 -0600 Subject: [PATCH] AmazingFeature - Added essential mouseover handling to the OK button. --- dist/js/ok.js | 1 + runhacx.html | 5 +++-- src/js/ok.js | 33 +++++++++++++++++++++++++++++++++ 3 files changed, 37 insertions(+), 2 deletions(-) create mode 100644 dist/js/ok.js create mode 100644 src/js/ok.js diff --git a/dist/js/ok.js b/dist/js/ok.js new file mode 100644 index 0000000..1a75695 --- /dev/null +++ b/dist/js/ok.js @@ -0,0 +1 @@ + window.onload=function(){var t=document.getElementById("HacxWindow");t.style.position="relative";var e=function(t,e){var o=Math.random()*(e-t)+1+t;return result=Math.floor(o),result};document.getElementById("OkButton").onmouseover=function(o){o.target.style.position="absolute",o.target.style.left=e(0,t.clientWidth)+"px",o.target.style.top=e(0,t.clientHeight)+"px"}}; \ No newline at end of file diff --git a/runhacx.html b/runhacx.html index 581ca81..01de4db 100644 --- a/runhacx.html +++ b/runhacx.html @@ -11,10 +11,11 @@ +
-
+
RunHacx
@@ -35,7 +36,7 @@
- +
diff --git a/src/js/ok.js b/src/js/ok.js new file mode 100644 index 0000000..8cf8e11 --- /dev/null +++ b/src/js/ok.js @@ -0,0 +1,33 @@ +/** + * Wait to set up the OK functionality until after the window has completed loading. + * @remarks Why 'var' instead of 'let'? Great question! We need to support WebExplorer, a precursor to Netscape, so we'll need some ancient JavaScript. + */ +window.onload = function () { + var container = document.getElementById('HacxWindow'); // Get a pointer to the container of the OK button (HacxWindow). + container.style.position = 'relative'; // Make the position relative so we can absolutely position the OK button! + + /** + * Find a random number between the specified minimum and maximum. + * @param {Number} aMin Minimum value to use in the lookup. + * @param {Number} aMax Maximum value to use in the lookup. + */ + var GetRandomInRange = function (aMin, aMax) { + var random = Math.random(); // Get a pseudorandom number between 0 and 1. + var absoluteRange = (aMax - aMin); // Get the Absolute range (distance from aMin to aMax). + var randomInAbsoluteRange = random * absoluteRange; // Convert the random number to the Absolute range space. + var randomInRelativeRange = randomInAbsoluteRange + 1 + aMin; // Convert to the Relative range, by jumping up to the minimum amount and adding 1 so it's not Zero. + result = Math.floor(randomInRelativeRange); // Get the floor of this relative random number so it's an even integer. + return result; // Job's done! https://www.youtube.com/watch?v=5r06heQ5HsI + }; + + /** + * When a user moves their mouse over the OK button, move the button. + * @param {MouseEvent} aEvent JavaScript MouseEvent containing the target (OK button) and other relevant information. + * @remarks May have unexpected results for Mobile Devices, if those are ever invented. + */ + document.getElementById('OkButton').onmouseover = function (aEvent) { + aEvent.target.style.position = 'absolute'; // Make positioning absolute so we can move it all around in the container! + aEvent.target.style.left = GetRandomInRange(0, container.clientWidth) + 'px'; // Move the OK button to a random horizontal location (in pixels) within the container. + aEvent.target.style.top = GetRandomInRange(0, container.clientHeight) + 'px'; // Move the OK button to a random vertical location (in pixels) within the container. + }; +}; \ No newline at end of file