From 52c5afa836e34e2bb48f76feea6b1a29fa04ee96 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adrian=20Karl=C3=A9n?=
 <113891532+adriankarlen@users.noreply.github.com>
Date: Wed, 28 Aug 2024 00:02:04 +0200
Subject: [PATCH] fix: improve icon handling (#5)

* check for title aswell (useful for windows applications)
* default check applicationframehost (win apps)
* add more icons
---
 config.yaml        |  2 +-
 scripts/glazewm.js | 35 ++++++++++++++++++++++++++---------
 2 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/config.yaml b/config.yaml
index 1adf220..bc6503b 100644
--- a/config.yaml
+++ b/config.yaml
@@ -115,7 +115,7 @@ window/bar:
           @for (child of glazewm.focusedWorkspace.children) {
             @if (child.state.type != "minimized") {
               <span class="process {{ child.hasFocus && "current"}}">
-                <i class="ti" data-process-name="{{ child.processName.toLowerCase() }}"></i>
+                <i class="ti" data-title="{{ child.title.toLowerCase() }}" data-process-name="{{ child.processName.toLowerCase() }}"></i>
               </span> 
             }
           }
diff --git a/scripts/glazewm.js b/scripts/glazewm.js
index 7f0ef4d..59654fb 100644
--- a/scripts/glazewm.js
+++ b/scripts/glazewm.js
@@ -1,8 +1,8 @@
-const processIconMap = {
+const iconMap = {
   // Terminals
   "wezterm-gui": { icon: "ti-terminal-2" },
   alacritty: { icon: "ti-terminal-2" },
-  WindowsTerminal: { icon: "ti-terminal-2" },
+  windowsterminal: { icon: "ti-terminal-2" },
 
   // Editors
   code: { icon: "ti-brand-vscode" }, // VS Code
@@ -10,13 +10,26 @@ const processIconMap = {
 
   // Communication
   "ms-teams": { icon: "ti-brand-teams" },
-  olk: { icon: "ti-mail" }, //Outlook
+  olk: { icon: "ti-mail" }, // Outlook
 
   // VPN
-  applicationframehost: { icon: "ti-spy" }, // Azure VPN Client
+  "azure vpn client": { icon: "ti-spy" }, // Azure VPN Client
 
   // Browsers
   zen: { icon: "ti-circle-letter-z" },
+  msedge: { icon: "ti-brand-edge" },
+
+  // Utils
+  snippingtool: { icon: "ti-screenshot" },
+  "control panel": { icon: "ti-settings" },
+  explorer: { icon: "ti-folder" },
+  photos: { icon: "ti-photo" },
+  sound: { icon: "ti-headphones" },
+  excel: { icon: "ti-file-spreadsheet" },
+  onenote: { icon: "ti-note" },
+  powerpnt: { icon: "ti-presentation" },
+  winword: { icon: "ti-file-word" },
+  mspaint: { icon: "ti-palette" },
 
   // Ignore
   msedgewebview2: { ignore: true },
@@ -36,17 +49,22 @@ const addProcessIconCallback = (mutationsList) => {
 
         iconNodes.forEach((iconNode) => {
           const processName = iconNode.getAttribute("data-process-name");
+          const title = iconNode.getAttribute("data-title");
 
-          if (!processName) return;
-
-          const process = processIconMap[processName];
-
+          if (!processName && !title) return;
+          const process = iconMap[processName] || iconMap[title];
           const unmapped = process == null;
           if (!unmapped && process.ignore) {
             iconNode.remove();
             return;
           }
 
+          /** INFO: Edge case, all Windows apps has this process name,
+           * to avoid some manual mapping, use title without brand */
+          if (unmapped && processName == "applicationframehost") {
+            iconNode.classList.add(`ti-${title}`);
+          }
+
           iconNode.classList.add(
             unmapped ? `ti-brand-${processName}` : process.icon,
           );
@@ -64,4 +82,3 @@ if (parentNode) {
 } else {
   console.error("Parent node #glazewm-workspaces not found.");
 }
-;