chore: Drafts accented icon themes

.gulp/consts/log.ts

@@ -2,5 +2,6 @@ export const HR: string = '\n—————————————————
 export const MESSAGE_BUMP_ERROR: string = ' There was an issue bumping version:\n';
 export const MESSAGE_BUMP_SUCCESS: string = ' Finished successfully\n';
 export const MESSAGE_ICON_ERROR: string = 'There is an error with JSON generated for icons';
+export const MESSAGE_ICON_ACCENTS_ERROR: string = 'Failed to create accents icon themes, please read the log file.';
 export const MESSAGE_GENERATED: string = 'Generated';
 export const MESSAGE_THEME_VARIANT_PARSE_ERROR: string = 'Error when parsing json for theme variants';

.gulp/index.ts

@@ -2,6 +2,7 @@
 export * from './tasks/changelog';
 export * from './tasks/bump';
 export * from './tasks/icons';
+export * from './tasks/icons-accents';
 export * from './tasks/themes';
 export * from './tasks/watcher';
 

.gulp/interfaces/ipackage.json.ts

@@ -0,0 +1,54 @@
+import { IGenericObject } from '../../extensions/interfaces/igeneric-object';
+
+export interface IPackageJSONBadge {
+  description: string;
+  href: string;
+  url: string;
+}
+
+export interface IPackageJSONContributes {
+  commands: IPackageJSONCommand[];
+  iconThemes: IPackageJSONThemeIcons[];
+  themes: IPackageJSONTheme[];
+}
+
+export interface IPackageJSONCommand {
+  category: string;
+  command: string;
+  title: string;
+}
+
+export interface IPackageJSONTheme {
+  label: string;
+  path: string;
+  uiTheme: string;
+}
+
+export interface IPackageJSONThemeIcons {
+  id: string;
+  label: string;
+  path: string;
+}
+
+export interface IPackageJSON {
+  "activationEvents": string[]
+  "badges": IPackageJSONBadge[];
+  "contributes": IPackageJSONContributes;
+  "bugs": IGenericObject<string>;
+  "categories": string[];
+  "description": string;
+  "displayName": string;
+  "engines": IGenericObject<string>;
+  "galleryBanner": IGenericObject<string>;
+  "homepage": string;
+  "icon": string;
+  "license": string;
+  "main": string;
+  "name": string;
+  "preview": boolean;
+  "publisher": string;
+  "repository": IGenericObject<string>;
+  "scripts": IGenericObject<string>;
+  "version": string;
+  "devDependencies": IGenericObject<string>;
+}

.gulp/interfaces/itheme-icons-accents.ts

@@ -0,0 +1,10 @@
+interface IIconObject {
+  iconPath: string
+}
+
+export interface IThemeIconsAccents {
+  iconDefinitions: {
+    _folder_open: IIconObject;
+    _folder_open_build: IIconObject;
+  }
+}

.gulp/tasks/icons-accents.ts

@@ -0,0 +1,132 @@
+import * as fs from 'fs';
+import * as gulp from 'gulp';
+import * as gutil from 'gulp-util';
+import * as path from 'path';
+
+import { IPackageJSON, IPackageJSONThemeIcons } from "../interfaces/ipackage.json";
+import { MESSAGE_GENERATED, MESSAGE_ICON_ACCENTS_ERROR } from "../consts/log";
+
+import { CHARSET } from "../consts/files";
+import { IThemeConfigCommons } from '../../extensions/interfaces/icommons';
+import { IThemeIconsAccents } from "../interfaces/itheme-icons-accents";
+import PATHS from '../consts/paths'
+
+const BASE_ICON_THEME_PATH: string = path.join(process.cwd(), PATHS.THEMES, './Material-Theme-Icons.json');
+const THEME_COMMONS: IThemeConfigCommons = require('../../extensions/accents-setter/commons.json');
+const PACKAGE_JSON: IPackageJSON = require('../../package.json');
+
+const PACKAGE_JSON_ICON_THEME: IPackageJSONThemeIcons = {
+  id: "material-theme-icons",
+  label: "Material Theme Icons",
+  path: "./themes/Material-Theme-Icons.json"
+}
+
+/**
+ * Gets file path
+ * @param {string} filename
+ * @returns {string}
+ */
+function getFilepath(filename: string): string {
+  return path.join(PATHS.THEMES, filename);
+}
+
+/**
+ * Icon theme name
+ * @param {string} accentName
+ * @returns {string}
+ */
+function makefileName(accentName: string): string {
+  return `./Material-Theme-Icons-${ accentName }.json`;
+}
+
+/**
+ * Normalizes icon path
+ * @param {string} iconPath
+ * @returns {string}
+ */
+function normalizeIconPath(iconPath: string): string {
+  return path.join(process.cwd(), PATHS.ICONS, iconPath);
+}
+
+/**
+ * Replaces a file name with the accented filename
+ * @param {string} name
+ * @param {string} accentName
+ * @returns {string}
+ */
+function replaceNameWithAccent(name: string, accentName: string): string {
+  return name.replace('.svg', `.accent.${ accentName }.svg`);
+}
+
+/**
+ * Replaces a SVG colour
+ *
+ * @param {string} filecontent
+ * @param {string} colour
+ * @returns {string}
+ */
+function replaceSVGColour(filecontent: string, colour: string): string {
+  return filecontent.replace(/\.st0\s{0,}\{fill:#([a-zA-Z0-9]{6});\}/, ($0, $1) => $0.replace($1, colour));
+}
+
+/**
+ * Replaces white spaces in accents' names
+ * @param {string} input
+ * @returns {string}
+ */
+function replaceWhiteSpaces(input: string): string {
+  return input.replace(/\s+/g, '-');
+}
+
+/**
+ * Writes a new svg file
+ * @param {string} fromFile
+ * @param {string} toFile
+ * @param {string} accentColour
+ */
+function writeSVGIcon(fromFile: string, toFile: string, accent: string): void {
+  let fileContent: string = fs.readFileSync(normalizeIconPath(fromFile), CHARSET);
+  let content: string = replaceSVGColour(normalizeIconPath(fileContent), THEME_COMMONS.accents[accent]);
+  toFile = normalizeIconPath(toFile);
+
+  fs.writeFileSync(toFile, content);
+}
+
+// Exports task to index.ts
+export default gulp.task('build:icons.accents', cb => {
+  let basetheme: IThemeIconsAccents;
+
+  PACKAGE_JSON.contributes.iconThemes = [ PACKAGE_JSON_ICON_THEME ];
+
+  try {
+    basetheme = require(BASE_ICON_THEME_PATH);
+
+    Object.keys(THEME_COMMONS.accents).forEach(key => {
+      let iconName = replaceWhiteSpaces(key);
+      let themecopy: IThemeIconsAccents = JSON.parse(JSON.stringify(basetheme));
+      let themePath: string = getFilepath(makefileName(key));
+
+      themecopy.iconDefinitions._folder_open.iconPath = replaceNameWithAccent(basetheme.iconDefinitions._folder_open.iconPath, iconName);
+      themecopy.iconDefinitions._folder_open_build.iconPath = replaceNameWithAccent(basetheme.iconDefinitions._folder_open_build.iconPath, iconName);
+
+      writeSVGIcon(basetheme.iconDefinitions._folder_open.iconPath, themecopy.iconDefinitions._folder_open.iconPath, THEME_COMMONS.accents[key]);
+      writeSVGIcon(basetheme.iconDefinitions._folder_open_build.iconPath, themecopy.iconDefinitions._folder_open_build.iconPath, THEME_COMMONS.accents[key]);
+
+      fs.writeFileSync(themePath, JSON.stringify(themecopy));
+
+      PACKAGE_JSON
+
+      gutil.log(gutil.colors.green(MESSAGE_GENERATED, themePath));
+    });
+
+    fs.writeFileSync(path.join(process.cwd(), './package.test.json'), JSON.stringify(PACKAGE_JSON, null, 2), CHARSET);
+
+  } catch (error) {
+    // http://ragefaces.memesoftware.com/faces/large/misc-le-fu-l.png
+    gutil.log(gutil.colors.red(MESSAGE_ICON_ACCENTS_ERROR));
+    cb(error);
+    return;
+  }
+
+  cb();
+});

.vscode/launch.json

@@ -4,6 +4,15 @@
   // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
   "version": "0.2.0",
   "configurations": [
+    {
+      "type": "node",
+      "request": "launch",
+      "name": "Gulp build-icons",
+      "program": "${workspaceRoot}/node_modules/gulp/bin/gulp.js",
+      "args": [
+        "build:icons.accents"
+      ]
+    },
     {
       "name": "Launch Extension",
       "type": "extensionHost",

extensions/accents-setter/index.ts

@@ -93,10 +93,10 @@ function setWorkbenchOptions(accentSelected: string, config: any): void {
 export const THEME_ACCENTS_SETTER = () => {
   // shows the quick pick dropdown
   let options: string[] = Object.keys(themeConfigCommon.accents);
-  let customColourKey: string = 'Custom colour';
+  // let customColourKey: string = 'Custom colour';
   let purgeColourKey: string = 'Remove accents';
 
-  options.push(customColourKey);
+  // options.push(customColourKey);
   options.push(purgeColourKey);
 
   vscode.window.showQuickPick(options).then(accentSelected => {
@@ -105,19 +105,19 @@ export const THEME_ACCENTS_SETTER = () => {
     let config: any = vscode.workspace.getConfiguration().get('workbench.colorCustomizations');
 
     switch(accentSelected) {
-      case customColourKey:
-        vscode.window.showInputBox().then(colourCode => {
-          if (colourCode === null || colourCode === undefined) return;
+      // case customColourKey:
+      //   vscode.window.showInputBox().then(colourCode => {
+      //     if (colourCode === null || colourCode === undefined) return;
 
-          if (colourCode && !isValidColour(colourCode)) {
-            vscode.window.showWarningMessage('Invalid colour set, aborting.');
-            return;
-          }
+      //     if (colourCode && !isValidColour(colourCode)) {
+      //       vscode.window.showWarningMessage('Invalid colour set, aborting.');
+      //       return;
+      //     }
 
-          assignColorCustomizations(colourCode, config);
-          setWorkbenchOptions(accentSelected, config);
-        });
-      break;
+      //     assignColorCustomizations(colourCode, config);
+      //     setWorkbenchOptions(accentSelected, config);
+      //   });
+      // break;
       case purgeColourKey:
         assignColorCustomizations(undefined, config);
         setWorkbenchOptions(accentSelected, config);

package.json

@@ -23,12 +23,13 @@
     "vscode": "^1.12.0"
   },
   "scripts": {
-    "build": "npm run build-icons && npm run build-themes",
+    "build": "npm run build-icons && npm run build-themes && npm run build-icons-accents",
     "minimize-icons": "svgo -f src/icons/svgs -o icons",
     "minimize-json": "json-minify themes/.material-theme-icons.tmp > themes/Material-Theme-Icons.json && npm run remove-icons-tmp",
     "remove-icons": "rimraf icons && rimraf themes/Material-Theme-Icons.json",
     "remove-icons-tmp": "rimraf themes/.material-theme-icons.tmp",
     "build-icons": "npm run remove-icons && npm run minimize-icons && gulp build:icons && npm run minimize-json",
+    "build-icons-accents": "gulp build:icons.accents",
     "build-themes": "gulp build:themes",
     "release": "npm run bump && npm run changelog",
     "postinstall": "node ./node_modules/vscode/bin/install",