From 11166aff8ff1ba36475d4c3d7420be05c67481ab Mon Sep 17 00:00:00 2001
From: black-backdoor <145743369+black-backdoor@users.noreply.github.com>
Date: Sat, 4 Jan 2025 12:32:14 +0100
Subject: [PATCH] Update console-related scripts (#140)
---
src/_includes/partials/head.njk | 3 +-
src/data/index.html | 2 +-
src/index.html | 11 +--
src/js/{console.js => console/banner.js} | 9 ++-
src/js/{batteryLog.js => console/battery.js} | 16 ++--
src/js/{ => console}/network.js | 2 +-
src/js/console/storage.js | 61 ++++++++++++++
src/js/performance.js | 35 --------
src/js/storage.js | 85 --------------------
src/modules/utils/storage.js | 14 ++++
10 files changed, 98 insertions(+), 140 deletions(-)
rename src/js/{console.js => console/banner.js} (58%)
rename src/js/{batteryLog.js => console/battery.js} (87%)
rename src/js/{ => console}/network.js (95%)
create mode 100644 src/js/console/storage.js
delete mode 100644 src/js/performance.js
delete mode 100644 src/js/storage.js
create mode 100644 src/modules/utils/storage.js
diff --git a/src/_includes/partials/head.njk b/src/_includes/partials/head.njk
index 997e91c..cecf6dc 100644
--- a/src/_includes/partials/head.njk
+++ b/src/_includes/partials/head.njk
@@ -35,4 +35,5 @@
}
-
\ No newline at end of file
+
+
diff --git a/src/data/index.html b/src/data/index.html
index 9f95ebb..5e617db 100644
--- a/src/data/index.html
+++ b/src/data/index.html
@@ -23,7 +23,7 @@
-
+
diff --git a/src/index.html b/src/index.html
index fe314cf..3f5bba5 100644
--- a/src/index.html
+++ b/src/index.html
@@ -16,19 +16,14 @@
-
+
+
+
-
-
-
-
-
-
-
diff --git a/src/js/console.js b/src/js/console/banner.js
similarity index 58%
rename from src/js/console.js
rename to src/js/console/banner.js
index 639c1cc..8b9923e 100644
--- a/src/js/console.js
+++ b/src/js/console/banner.js
@@ -1,3 +1,8 @@
+(() => {
+
+// Check if the current window is the top window
+if (window.top !== window.self) { return; }
+
console.log(
`
_____ _____ _____
@@ -9,4 +14,6 @@ Version: 3.18.3
Made by @black-backdoor
`
-);
\ No newline at end of file
+);
+
+})();
\ No newline at end of file
diff --git a/src/js/batteryLog.js b/src/js/console/battery.js
similarity index 87%
rename from src/js/batteryLog.js
rename to src/js/console/battery.js
index c3a52d4..01c641f 100644
--- a/src/js/batteryLog.js
+++ b/src/js/console/battery.js
@@ -1,8 +1,9 @@
-/*
- Log battery status
-*/
+(function () {
+ if (!('getBattery' in navigator)) {
+ console.info('%c[Battery]%c battery status is not supported', 'color: green', 'color: inherit');
+ return;
+ }
-if ('getBattery' in navigator) {
console.info('%c[Battery]%c battery status is supported', 'color: green', 'color: inherit');
navigator.getBattery().then((battery) => {
@@ -19,12 +20,14 @@ if ('getBattery' in navigator) {
`color: ${charging ? 'green' : 'red'}`,
);
+ /*
console.groupCollapsed(`%c[Battery]%c Info`, 'color: green', 'color: inherit');
console.debug("IsCharging", charging);
console.debug("Percentage", percent);
console.debug("chargingTime", battery.chargingTime);
console.debug("dischargingTime", battery.dischargingTime);
console.groupEnd();
+ */
}
logBatteryStatus(battery);
@@ -33,7 +36,4 @@ if ('getBattery' in navigator) {
battery.addEventListener('dischargingtimechange', () => logBatteryStatus(battery));
battery.addEventListener('levelchange', () => logBatteryStatus(battery));
});
-
-} else {
- console.info('%c[Battery]%c battery status is not supported', 'color: green', 'color: inherit');
-}
\ No newline at end of file
+})();
\ No newline at end of file
diff --git a/src/js/network.js b/src/js/console/network.js
similarity index 95%
rename from src/js/network.js
rename to src/js/console/network.js
index 4723f02..8cf2559 100644
--- a/src/js/network.js
+++ b/src/js/console/network.js
@@ -1,6 +1,6 @@
function printNetworkInfo() {
// Function to calculate console.log color based on value and thresholds
- function calculateColor(value, middle, max, lowerIsBetter = false) {
+ const calculateColor = (value, middle, max, lowerIsBetter = false) => {
if (!lowerIsBetter) {
if (value < middle) {
return 'green';
diff --git a/src/js/console/storage.js b/src/js/console/storage.js
new file mode 100644
index 0000000..0072fb9
--- /dev/null
+++ b/src/js/console/storage.js
@@ -0,0 +1,61 @@
+import { convertStorageUnit } from '/modules/utils/storage.js';
+
+
+(function () {
+ const logStorage = true;
+
+ if ('storage' in navigator) {
+ navigator.storage.estimate().then((estimate) => {
+ const { quota, usage, usageDetails } = estimate;
+
+ console.info(`%c[Storage]%c Using ${convertStorageUnit(usage)} of ${convertStorageUnit(quota)}`, 'color: DarkOrchid', 'color: inherit');
+ console.groupCollapsed(`%c[Storage]%c Usage Details (${convertStorageUnit(usage)})`, 'color: DarkOrchid', 'color: inherit');
+ for (const key in usageDetails) {
+ console.debug(`%c${key}%c ${convertStorageUnit(usageDetails[key])}`, 'color: DarkOrchid', 'color: inherit');
+ }
+ console.groupEnd();
+ });
+ }
+
+
+ function calculateStorageSize(storageType, storageName) {
+ let size = {};
+
+ let totalSize = 0,
+ keyLength, key;
+
+ for (key in storageType) {
+ if (!storageType.hasOwnProperty(key)) {
+ continue;
+ }
+ keyLength = ((storageType[key].length + key.length) * 2);
+ totalSize += keyLength;
+
+ size[key] = keyLength;
+ };
+
+ if (logStorage === false) {
+ // EXAMPLE: [Storage] localStorage: 2.65 KB
+ console.info(`%c[Storage]%c ${storageName}: ${convertStorageUnit(totalSize)}`, "color: DarkOrchid", "color: inherit");
+ return;
+ }
+
+ // sort by key name (alphabetical)
+ size = Object.fromEntries(Object.entries(size).sort());
+
+ console.groupCollapsed(`%c[Storage]%c ${storageName} (${convertStorageUnit(totalSize)})`, "color: DarkOrchid", "color: inherit");
+ for (key in size) {
+ console.debug(`${key} = ${convertStorageUnit(size[key])}`);
+ }
+ console.groupEnd();
+ }
+
+
+ if ('localStorage' in window) {
+ calculateStorageSize(localStorage, 'localStorage');
+ }
+
+ if ('sessionStorage' in window) {
+ calculateStorageSize(sessionStorage, 'sessionStorage');
+ }
+})();
\ No newline at end of file
diff --git a/src/js/performance.js b/src/js/performance.js
deleted file mode 100644
index b26622b..0000000
--- a/src/js/performance.js
+++ /dev/null
@@ -1,35 +0,0 @@
-function logResourceTimings(resourceType) {
- console.groupCollapsed(`%c[PERFORMANCE]%c Network Resources: ${resourceType}`, 'color: gold', 'color: inherit;');
-
- const resourceList = window.performance.getEntriesByType("resource");
- for (let i = 0; i < resourceList.length; i++) {
- if (resourceList[i].initiatorType == resourceType) {
- console.debug(`Name: ${resourceList[i].name}, Duration: ${resourceList[i].duration.toFixed(1)} ms`);
- }
- }
-
- console.groupEnd();
-}
-
-function logPerformance() {
- /*
- if ('performance' in window) {
- logPageTimings();
- } else {
- console.info("Page Timing API is not present");
- }
- */
-
- if (window.performance && window.performance.getEntriesByName) {
- logResourceTimings("img");
- logResourceTimings("link");
- logResourceTimings("script");
- logResourceTimings("iframe");
- } else {
- console.info("Resource Timing API is not present");
- }
-}
-
-// all images have finished loading once onload is called
-// but set a timeout, so that the load event finishes, and all page timers complete (some end after onload finishes)
-window.onload = setTimeout(logPerformance, 500);
\ No newline at end of file
diff --git a/src/js/storage.js b/src/js/storage.js
deleted file mode 100644
index c984328..0000000
--- a/src/js/storage.js
+++ /dev/null
@@ -1,85 +0,0 @@
-if ('storage' in navigator) {
- function convertStorageUnit(bytes) {
- const units = ['B', 'KB', 'MB', 'GB', 'TB'];
- let unitIndex = 0;
- while (bytes >= 1024) {
- bytes /= 1024;
- unitIndex++;
- }
- return `${bytes.toFixed(1)} ${units[unitIndex]}`;
- }
-
- navigator.storage.estimate().then((estimate) => {
- const { quota, usage, usageDetails } = estimate;
-
- console.info(`%c[Storage]%c Using ${convertStorageUnit(usage)} of ${convertStorageUnit(quota)}`, 'color: DarkOrchid', 'color: inherit');
- console.groupCollapsed(`%c[Storage]%c Usage Details (${convertStorageUnit(usage)})`, 'color: DarkOrchid', 'color: inherit');
- for (const key in usageDetails) {
- console.debug(`%c${key}%c ${convertStorageUnit(usageDetails[key])}`, 'color: DarkOrchid', 'color: inherit');
- }
- console.groupEnd();
- });
-}
-
-
-
-function calculateLocalStorageSize() {
- let size = {};
-
- let totalSize = 0,
- keyLength, key;
-
- for (key in localStorage) {
- if (!localStorage.hasOwnProperty(key)) {
- continue;
- }
- keyLength = ((localStorage[key].length + key.length) * 2);
- totalSize += keyLength;
-
- size[key] = keyLength;
- };
-
- const total = (totalSize / 1024).toFixed(2) + " KB";
- console.info(`%c[Storage]%c localStorage: ${total}`, "color: DarkOrchid", "color: inherit");
- console.groupCollapsed(`%c[Storage]%c localStorage (${total})`, "color: DarkOrchid", "color: inherit");
- for (key in size) {
- console.debug(`${key} = ${(size[key] / 1024).toFixed(2)} KB`);
- }
- console.groupEnd();
-}
-
-if ('localStorage' in window) {
- calculateLocalStorageSize();
-}
-
-
-
-
-function calculateSessionStorageSize() {
- let size = {};
-
- let totalSize = 0,
- keyLength, key;
-
- for (key in sessionStorage) {
- if (!sessionStorage.hasOwnProperty(key)) {
- continue;
- }
- keyLength = ((sessionStorage[key].length + key.length) * 2);
- totalSize += keyLength;
-
- size[key] = keyLength;
- };
-
- const total = (totalSize / 1024).toFixed(2) + " KB";
- console.info(`%c[Storage]%c sessionStorage: ${total}`, "color: DarkOrchid", "color: inherit");
- console.groupCollapsed(`%c[Storage]%c sessionStorage (${total})`, "color: DarkOrchid", "color: inherit");
- for (key in size) {
- console.debug(`${key} = ${(size[key] / 1024).toFixed(2)} KB`);
- }
- console.groupEnd();
-}
-
-if ('sessionStorage' in window) {
- calculateSessionStorageSize();
-}
diff --git a/src/modules/utils/storage.js b/src/modules/utils/storage.js
new file mode 100644
index 0000000..52f3976
--- /dev/null
+++ b/src/modules/utils/storage.js
@@ -0,0 +1,14 @@
+/**
+ * Convert bytes to human-readable storage units
+ * @param {number} bytes - The number of bytes
+ * @returns {string} - The human-readable storage unit (e.g., 1.2 KiB)
+ */
+export const convertStorageUnit = (bytes) => {
+ const units = ['B', 'KiB', 'MiB', 'GiB', 'TiB'];
+ let unitIndex = 0;
+ while (bytes >= 1024 && unitIndex < units.length - 1) {
+ bytes /= 1024;
+ unitIndex++;
+ }
+ return `${bytes.toFixed(1)} ${units[unitIndex]}`;
+};
\ No newline at end of file