Merge pull request #2 from elluminance/master

added custom icons for mods/tabs

ccmod.json

@@ -5,7 +5,7 @@
     "description": "Mod manager for CrossCode!",
     "repository": "https://github.com/CCDirectLink/CCModManager",
     "tags": ["QoL"],
-    "authors": ["krypek", "dmitmel", "2767mr"],
+    "authors": ["krypek", "dmitmel", "2767mr", "elluminance"],
     "icons": {
         "24": "icon/icon.png"
     },

package.json

@@ -4,7 +4,7 @@
     "scripts": {
         "start": "npx esbuild --target=es2018 --format=esm --platform=node --bundle --sourcemap=inline --outfile=plugin.js src/plugin.ts",
         "watch": "npx esbuild --target=es2018 --format=esm --platform=node --bundle --sourcemap=inline --watch --outfile=plugin.js src/plugin.ts",
-        "build": "npx esbuild --target=es2018 --format=esm --platform=node --bundle --outfile='plugin.js' 'src/plugin.ts'",
+        "build": "npx esbuild --target=es2018 --format=esm --platform=node --bundle --outfile=plugin.js src/plugin.ts",
         "format": "prettier ./src -w; npx prettier ./assets -w --tab-width 4 --no-semi --print-width 500 --bracket-same-line",
         "types": "tsc --noEmit false --outDir types --emitDeclarationOnly true --declaration --isolatedModules false"
     },

src/gui/gui.ts

@@ -1,13 +1,22 @@
 import { Lang } from '../lang-manager.js'
 import './menu.js'
 
-const iconsFont = new ig.Font('media/ccmodmanager-icons.png', 16, 16)
-const page = sc.fontsystem.font.iconSets.push(iconsFont) - 1
-const icons = ['ccmodmanager-git'] as const
-for (const iconName of icons) {
-    sc.fontsystem.font.mapping[iconName] = [page, 0]
-    sc.fontsystem.font.indexMapping.push(iconName)
+const iconsFont = new ig.Font('media/font/ccmodmanager-icons.png', 16, 16)
+const page = sc.fontsystem.font.iconSets.length;
+sc.fontsystem.font.pushIconSet(iconsFont);
+const icons = [
+    'ccmodmanager-git',
+    'mod-icon',
+    'mod-icon-online',
+    'mod-icon-selected',
+    'mod-icon-enabled',
+    'mod-icon-disabled'
+] as const
+let mapping: Record<string, [number, number]> = {};
+for (let i = 0; i < icons.length; i++) {
+    mapping[icons[i]] = [page, i];
 }
+sc.fontsystem.font.setMapping(mapping);
 
 // @ts-expect-error
 sc.MENU_SUBMENU.MODS = Math.max(...Object.values(sc.MENU_SUBMENU)) + 1

src/gui/list.ts

@@ -72,10 +72,10 @@ sc.ModMenuList = sc.ListTabbedPane.extend({
         this.gridColumns = 3
 
         this.tabz = [
-            { name: Lang.onlineTab, populateFunc: this.populateOnline, icon: 'quest-all' },
-            { name: Lang.selectedModsTab, populateFunc: this.populateSelected, icon: 'quest-fav' },
-            { name: Lang.enabledTab, populateFunc: this.populateEnabled, icon: 'quest-solve' },
-            { name: Lang.disabledTab, populateFunc: this.populateDisabled, icon: 'quest-elite' },
+            { name: Lang.onlineTab, populateFunc: this.populateOnline, icon: 'mod-icon-online' },
+            { name: Lang.selectedModsTab, populateFunc: this.populateSelected, icon: 'mod-icon-selected' },
+            { name: Lang.enabledTab, populateFunc: this.populateEnabled, icon: 'mod-icon-enabled' },
+            { name: Lang.disabledTab, populateFunc: this.populateDisabled, icon: 'mod-icon-disabled' },
             { name: Lang.settingsTab, populateFunc: this.populateSettings, icon: 'stats-log' },
         ]
         this.filters = {}