chore: Drafts accented icon themes

This commit is contained in:
OctoD 2017-06-12 19:49:50 +02:00
parent 35beede550
commit 00b4b0df1e
8 changed files with 222 additions and 14 deletions

View file

@ -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_ERROR: string = ' There was an issue bumping version:\n';
export const MESSAGE_BUMP_SUCCESS: string = ' Finished successfully\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_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_GENERATED: string = 'Generated';
export const MESSAGE_THEME_VARIANT_PARSE_ERROR: string = 'Error when parsing json for theme variants'; export const MESSAGE_THEME_VARIANT_PARSE_ERROR: string = 'Error when parsing json for theme variants';

View file

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

View file

@ -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>;
}

View file

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

View file

@ -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();
});

9
.vscode/launch.json vendored
View file

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

View file

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

View file

@ -23,12 +23,13 @@
"vscode": "^1.12.0" "vscode": "^1.12.0"
}, },
"scripts": { "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-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", "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": "rimraf icons && rimraf themes/Material-Theme-Icons.json",
"remove-icons-tmp": "rimraf themes/.material-theme-icons.tmp", "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": "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", "build-themes": "gulp build:themes",
"release": "npm run bump && npm run changelog", "release": "npm run bump && npm run changelog",
"postinstall": "node ./node_modules/vscode/bin/install", "postinstall": "node ./node_modules/vscode/bin/install",