Add favicon util

Himir-Desai · Feb 4, 2022 · a1fcdc2 · a1fcdc2
1 parent daea29e
commit a1fcdc2
Show file tree

Hide file tree

Showing 15 changed files with 25 additions and 2 deletions.
diff --git a/assets/favicon/blue-alt.png b/assets/favicon/blue-alt.png
diff --git a/assets/favicon/blue.png b/assets/favicon/blue.png
diff --git a/assets/favicon/err.png b/assets/favicon/err.png
diff --git a/assets/favicon/loading.gif b/assets/favicon/loading.gif
diff --git a/assets/favicon/pink-alt.png b/assets/favicon/pink-alt.png
diff --git a/assets/favicon/pink.png b/assets/favicon/pink.png
diff --git a/assets/favicon/red.png b/assets/favicon/red.png
diff --git a/assets/favicon/white-alt.png b/assets/favicon/white-alt.png
diff --git a/assets/favicon/white.png b/assets/favicon/white.png
diff --git a/assets/favicon/yellow-alt.png b/assets/favicon/yellow-alt.png
diff --git a/assets/favicon.png → assets/favicon/yellow.png b/assets/favicon.png → assets/favicon/yellow.png
diff --git a/dispatch.js b/dispatch.js
@@ -12,6 +12,7 @@ import { createEval } from "./evalGameScript.js";
 import uiSounds from "./assets/ui-sounds.js";
 import notification from "./utils/notification.js";
 import validate from "./utils/validate.js";
+import favicon from "./utils/favicon.js";
 
 const STATE = {
  codemirror: undefined,
@@ -131,9 +132,16 @@ const ACTIONS = {
  } // Best(?) combination of checking if certain error properties exist
  dispatch("RENDER");
  },
- SOUND(arg, state) {
+ SOUND(arg = null, state) {
  uiSounds[arg]();
  },
+ FAVICON(arg = null, state) {
+ if (typeof arg === 'string') {
+ favicon(arg)
+ } else {
+ favicon()
+ }
+ },
  REPORT_BUG: async (args, state) => {
  state.bugReportStatus = "loading";
  notification({

diff --git a/index.html b/index.html
@@ -5,7 +5,7 @@
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>gamelab</title>
- <link rel="icon" type="image/png" href="./assets/favicon.png">
+ <link rel="icon" type="image/png" href="./assets/favicon/loading.gif">
  <link rel="stylesheet" href="./styles/editor.css"></link>
  <link rel="stylesheet" href="./styles/cursors.css"></link>
  <!-- <link rel="stylesheet" href="./styles/tooltip.css"></link> -->

diff --git a/init.js b/init.js
@@ -142,4 +142,5 @@ export async function init(state) {
 
  dispatch("LOAD_CARTRIDGE", { saved });
  dispatch("SOUND", "bootup");
+ dispatch("FAVICON")
 }
diff --git a/utils/favicon.js b/utils/favicon.js
@@ -0,0 +1,14 @@
+// ex.
+// `favicon()` to set default favicon
+// `favicon('yellow.png')` to set to a yellow variant of the favicon
+// `favicon('loading.gif)` to set to a loading icon
+export default function favicon(type = 'white.png') {
+ console.log('setting favicon', type)
+ const icon = document.querySelector("link[rel~='icon']");
+ if (!icon) {
+ icon = document.createElement('link');
+ icon.rel = 'icon';
+ document.head.appendChild(link);
+ }
+ icon.href = `./assets/favicon/${type}`
+}