Create the Tauon theme.

.gitignore

@@ -117,3 +117,6 @@ source/vscode/themes/love-light.color-theme.json
 source/sublime-text/love-dark.sublime-color-scheme
 source/sublime-text/love-light.sublime-color-scheme
 source/sublime-text/Love.sublime-package
+source/tauon/Love Dark.ttheme
+source/tauon/Love Light.ttheme
+source/tauon/love-tauon.zip

.gitlab-ci.yml

@@ -23,7 +23,8 @@ pages:
   script:
     - yarn build
     - cp 'public/index.html' 'public/404.html'
-    - cp 'source/sublime-text/Love.sublime-package' 'public/'
+    # Copy various theme output files over so they're available through the website.
+    - yarn copy-themes
   artifacts:
     paths:
       - public

package.json

@@ -6,14 +6,16 @@
   "homepage": "https://love.holllo.cc",
   "repository": "https://gitlab.com/holllo/love",
   "scripts": {
-    "build": "yarn build:atom && yarn build:images && yarn build:pages && yarn build:sublime-text && yarn build:vscode",
+    "build": "yarn build:atom && yarn build:images && yarn build:pages && yarn build:sublime-text && yarn build:tauon && yarn build:vscode && yarn copy-themes",
     "build:atom": "ts-node 'source/scripts/atom.ts'",
     "build:images": "cpy 'source/pages/images/**' 'public/images/'",
     "build:pages": "ts-node 'source/scripts/pages.ts'",
     "build:sublime-text": "ts-node 'source/scripts/sublime-text.ts'",
+    "build:tauon": "ts-node 'source/scripts/tauon.ts'",
     "build:vscode": "ts-node 'source/scripts/vscode.ts'",
     "watch:atom": "chokidar 'source/atom/*.less' 'source/atom/ui-template/*.less' -c 'yarn build:atom'",
     "watch:vscode": "chokidar 'source/vscode/themes/love-template.color-theme.json' -c 'yarn build:vscode'",
+    "copy-themes": "cp 'source/sublime-text/Love.sublime-package' 'public/' && cp 'source/tauon/love-tauon.zip' 'public/'",
     "test": "xo && stylelint 'source/pages/scss/**'"
   },
   "dependencies": {

source/pages/index.html

@@ -169,6 +169,9 @@
           <li>
             <a class="fake-external" href="Love.sublime-package">Sublime Text</a>
           </li>
+          <li>
+            <a class="fake-external" href="love-tauon.zip">Tauon Music Box</a>
+          </li>
           <li>
             <a href="https://marketplace.visualstudio.com/items?itemName=Holllo.love">Visual Studio Code</a>
           </li>

source/scripts/tauon.ts

@@ -0,0 +1,73 @@
+import {promises as fsp} from 'fs';
+import {join} from 'path';
+import Zip from 'jszip';
+import nunjucks from 'nunjucks';
+import {generateLove, LoveVariant} from './love';
+
+export async function entry(): Promise<void> {
+  const themeDirectory: string = join(__dirname, '../tauon/');
+  // Configure Nunjucks to use the templates for `source/tauon/`.
+  nunjucks.configure(themeDirectory, {
+    lstripBlocks: true,
+    trimBlocks: true,
+    throwOnUndefined: true
+  });
+
+  // Create a new zip archive.
+  const tauonPackage: Zip = new Zip();
+
+  // Generate the Love variants.
+  const love: LoveVariant[] = generateLove();
+
+  for (const variant of love) {
+    const themeName = `Love ${variant.name.slice(0, 1).toUpperCase() +
+      variant.name.slice(1)}.ttheme`;
+    const outputPath: string = join(themeDirectory, themeName);
+
+    // Render the template.
+    const theme: string = nunjucks.render('love-template.ttheme', {
+      love: variant,
+      rgb: hexToRGB
+    });
+
+    // Write the theme to file and add it to the zip archive.
+    await fsp.writeFile(outputPath, theme);
+    tauonPackage.file(themeName, theme);
+  }
+
+  // Write the zip archive to file.
+  const zip: Buffer = await tauonPackage.generateAsync({type: 'nodebuffer'});
+  await fsp.writeFile(join(themeDirectory, 'love-tauon.zip'), zip);
+}
+
+// A quick helper function to take a 3 or 6 character hex color and have it return
+// the RGB values from 0 to 256 as an `r,g,b` string since that's how Tauon
+// defines its colors in the themes.
+export function hexToRGB(hex: string): string {
+  // If the color starts with a #, remove it.
+  if (hex.startsWith('#')) {
+    hex = hex.slice(1);
+  }
+
+  if (hex.length === 3) {
+    return [
+      parseInt(hex[0], 16),
+      parseInt(hex[1], 16),
+      parseInt(hex[2], 16)
+    ].join(',');
+  }
+
+  if (hex.length === 6) {
+    return [
+      parseInt(hex.slice(0, 2), 16),
+      parseInt(hex.slice(2, 4), 16),
+      parseInt(hex.slice(4, 6), 16)
+    ].join(',');
+  }
+
+  throw new Error(`Unsupported hex "${hex}" used`);
+}
+
+if (require.main === module) {
+  entry();
+}

source/tauon/love-template.ttheme

@@ -0,0 +1,84 @@
+# The Love Theme for Tauon Music Box
+# Version: 0.1.0
+# https://love.holllo.cc
+
+{% if love.name === 'light' %}
+light-mode
+{% endif %}
+
+# Backgrounds
+
+{{ rgb(love.colors.background2) }} player background (top panel)
+{{ rgb(love.colors.background1) }} playlist panel
+{{ rgb(love.colors.background2) }} side panel
+{{ rgb(love.colors.background1) }} bottom panel
+{{ rgb(love.colors.background2) }} gallery background
+
+# Frame
+# Don't know where these colors are used. ☹️
+
+rgb(255,0,255) sep line
+rgb(255,0,255) bb line
+rgb(255,0,255) tb line
+
+# Playlist
+
+{{ rgb(love.colors.foreground1) }} track line
+{{ rgb(love.colors.foreground1) }} track time
+{{ rgb(love.colors.accents[4]) }} track index
+{{ rgb(love.colors.accents[6]) }} track artist
+{{ rgb(love.colors.accents[9]) }} album line
+
+{{ rgb(love.colors.accents[3]) }} track playing
+{{ rgb(love.colors.accents[3]) }} time playing
+{{ rgb(love.colors.accents[3]) }} index playing
+{{ rgb(love.colors.accents[3]) }} artist playing
+{{ rgb(love.colors.accents[3]) }} album playing
+
+{{ rgb(love.colors.accents[0]) }} track missing
+
+{{ rgb(love.colors.accents[2]) }} fav line
+{{ rgb(love.colors.foreground1) }} folder line
+{{ rgb(love.colors.foreground1) }} folder title
+
+{{ rgb(love.colors.accents[6]) + ',30' }} playing highlight
+{{ rgb(love.colors.foreground1) + ',20' }} select highlight
+{{ rgb(love.colors.foreground1) }} gallery highlight
+
+# Bottom Panel
+
+{{ rgb(love.colors.foreground1) + ',40' }} buttons off
+{{ rgb(love.colors.accents[4]) }} buttons over
+{{ rgb(love.colors.accents[6]) }} buttons active
+
+{{ rgb(love.colors.foreground1) }} playing time
+
+{{ rgb(love.colors.accents[6]) }} seek bar
+{{ rgb(love.colors.accents[6]) }} volume bar
+{{ rgb(love.colors.accents[6]) + ',40' }} seek bg
+{{ rgb(love.colors.accents[6]) + ',40' }} volume bg
+{{ rgb(love.colors.foreground1) }} scroll bar
+
+{{ rgb(love.colors.foreground1) + ',40' }} mode off
+{{ rgb(love.colors.accents[4]) }} mode over
+{{ rgb(love.colors.accents[6]) }} mode on
+
+# Top Panel
+
+{{ rgb(love.colors.background1) }} tab active line
+{{ rgb(love.colors.foreground1) }} tab line
+{{ rgb(love.colors.background1) }} tab background
+{{ rgb(love.colors.background2) }} tab over
+{{ rgb(love.colors.foreground1) }} tab active background
+{{ rgb(love.colors.foreground1) }} music vis
+
+# Side Panel
+
+{{ rgb(love.colors.foreground1) }} title info
+{{ rgb(love.colors.foreground1) }} extra info
+{{ rgb(love.colors.foreground1) }} art border
+
+# Mini Mode
+
+{{ rgb(love.colors.background1) }} mini bg
+{{ rgb(love.colors.foreground1) }} mini border