Small refactor + UX improvements [WIP] (#190)

* chore: small cleanup helper

* chore: adding interfaces for icon variants

* feat: You can now switch between Material Theme icons

* chore: helpers small fix

* chore(helpers): small fix helpers

* refactor: refactoring fixIcons command, ready for new prop autoFix

* refactor: accentsSetter command, ready for autoFix prop

* chore: added new exports file for all commands

* refactor: main theme file, ready for autoFix prop

* chore: added listener also when changing iconTheme

* feat: autoApplyIcons added as option and toggleApplyIcons as command

* chore: added check for autoApplyIcons flag. Removed listen icon change

* feat: Notification shows up when the window needs reload

* chore: Update CTA's

* chore: Make consistent indent guides and add support to editorIndentGuide.activeBackground

Close #188

* chore: fix check on CTA ok

* chore: split up configurationChange and changelog  (added to commands)

* chore: small change settings method

* feat: Now the theme will auto fix if needed on change icons theme
This commit is contained in:
Alessio Occhipinti 2018-05-18 13:47:22 +02:00 committed by Mattia Astorino
parent c924c1ccb2
commit 82cfb4587b
28 changed files with 343 additions and 192 deletions

View file

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

View file

@ -0,0 +1,37 @@
import * as fs from 'fs';
import * as gulp from 'gulp';
import {resolve} from 'path';
import {IDefaultsThemeIconVariant} from './../../extensions/interfaces/idefaults';
import {getDefaultValues, getVariantIcons} from './../../extensions/helpers/fs';
import {PATHS} from '../../extensions/consts/paths';
import {CHARSET} from '../../extensions/consts/files';
/**
* For each ThemeIconVariant create a Material-Theme-Icons-{variant}.json
* depends on default Material-Theme-Icons.json
*/
export default gulp.task('build:icons.variants-json', callback => {
try {
const variants: IDefaultsThemeIconVariant = getDefaultValues().themeIconVariants;
const defaults = fs.readFileSync(resolve(`${PATHS.THEMES}/Material-Theme-Icons.json`), 'utf8');
Object.keys(variants).forEach(variantName => {
const jsonDefaults = JSON.parse(defaults);
getVariantIcons().forEach(iconname => {
const newIconPath = jsonDefaults.iconDefinitions[iconname].iconPath.replace('.svg', `${variantName}.svg`);
jsonDefaults.iconDefinitions[iconname].iconPath = newIconPath;
fs.writeFileSync(
`${PATHS.THEMES}/Material-Theme-Icons-${variantName}.json`,
JSON.stringify(jsonDefaults),
{encoding: CHARSET}
);
});
});
} catch (error) {
return callback(error);
}
callback();
});

View file

@ -4,16 +4,8 @@ import {IAccentCustomProperty} from './../../interfaces/iaccent-custom-property'
import {IGenericObject} from './../../interfaces/igeneric-object'; import {IGenericObject} from './../../interfaces/igeneric-object';
import { import {
updateAccent, updateAccent,
isMaterialTheme,
isMaterialThemeIcons
} from './../../helpers/settings'; } from './../../helpers/settings';
import {
getCurrentThemeID,
getCurrentThemeIconsID,
reloadWindow
} from './../../helpers/vscode';
import {getDefaultValues} from './../../helpers/fs'; import {getDefaultValues} from './../../helpers/fs';
import {THEME_ICONS} from './../theme-icons/index';
const REGEXP_HEX: RegExp = /^#([0-9A-F]{6}|[0-9A-F]{8})$/i; const REGEXP_HEX: RegExp = /^#([0-9A-F]{6}|[0-9A-F]{8})$/i;
@ -62,11 +54,11 @@ const accentsProperties: IGenericObject <IAccentCustomProperty> = {
alpha: 100, alpha: 100,
value: undefined value: undefined
}, },
"editor.findWidgetResizeBorder": { 'editor.findWidgetResizeBorder': {
alpha: 100, alpha: 100,
value: undefined value: undefined
}, },
"editorWidget.border": { 'editorWidget.border': {
alpha: 100, alpha: 100,
value: undefined value: undefined
} }
@ -101,47 +93,37 @@ const isValidColour = (colour: string | null | undefined): boolean =>
/** /**
* Sets workbench options * Sets workbench options
*/ */
const setWorkbenchOptions = (accentSelected: string | undefined, config: any): void => { const setWorkbenchOptions = (accentSelected: string | undefined, config: any): Thenable<string> =>
vscode.workspace.getConfiguration().update('workbench.colorCustomizations', config, true).then(() => { vscode.workspace.getConfiguration().update('workbench.colorCustomizations', config, true)
const themeID = getCurrentThemeID(); .then(() => updateAccent(accentSelected),
const themeIconsID = getCurrentThemeIconsID(); reason => vscode.window.showErrorMessage(reason));
updateAccent(accentSelected).then(() => {
if (isMaterialTheme(themeID) && isMaterialThemeIcons(themeIconsID)) {
THEME_ICONS().then(() => reloadWindow());
}
});
}, reason => {
vscode.window.showErrorMessage(reason);
});
};
/** /**
* VSCode command * VSCode command
*/ */
export const THEME_ACCENTS_SETTER = () => { export default async (): Promise<boolean> => {
const themeConfigCommon = getDefaultValues(); const themeConfigCommon = getDefaultValues();
// shows the quick pick dropdown
const options: string[] = Object.keys(themeConfigCommon.accents);
const purgeColourKey: string = 'Remove accents'; const purgeColourKey: string = 'Remove accents';
const options: string[] = Object.keys(themeConfigCommon.accents).concat(purgeColourKey);
options.push(purgeColourKey); // shows the quick pick dropdown and wait response
const accentSelected = await vscode.window.showQuickPick(options);
vscode.window.showQuickPick(options).then(accentSelected => { if (accentSelected === null || accentSelected === undefined) {
if (accentSelected === null || accentSelected === undefined) { Promise.resolve(null);
return; }
}
const config: any = vscode.workspace.getConfiguration().get('workbench.colorCustomizations'); const config: any = vscode.workspace.getConfiguration().get('workbench.colorCustomizations');
switch (accentSelected) {
case purgeColourKey:
assignColorCustomizations(undefined, config);
await setWorkbenchOptions(undefined, config);
return Promise.resolve(true);
default:
assignColorCustomizations(themeConfigCommon.accents[accentSelected], config);
await setWorkbenchOptions(accentSelected, config);
return Promise.resolve(true);
}
switch (accentSelected) {
case purgeColourKey:
assignColorCustomizations(undefined, config);
setWorkbenchOptions(undefined, config);
break;
default:
assignColorCustomizations(themeConfigCommon.accents[accentSelected], config);
setWorkbenchOptions(accentSelected, config);
}
});
}; };

View file

@ -0,0 +1,4 @@
export {default as accentsSetter} from './accents-setter';
export {default as fixIcons} from './theme-icons';
export {default as toggleApplyIcons} from './toggle-apply-icons';
export {default as showChangelog} from './show-changelog';

View file

@ -0,0 +1,28 @@
import * as path from 'path';
import * as vscode from 'vscode';
import {PATHS} from './../../consts/paths';
const previewFile = (): void => {
const uri = vscode.Uri.file(path.join(PATHS.VSIX_DIR, './CHANGELOG.md'));
vscode.commands.executeCommand('markdown.showPreview', uri);
};
export default (): void => {
const extname: string = 'vscode.markdown';
const md = vscode.extensions.getExtension<any>(extname);
if (md === undefined) {
console.warn(`Ext not found ${ extname }`);
return;
}
if (md.isActive) {
return previewFile();
}
md.activate()
.then(() => previewFile(),
reason => console.warn(reason)
);
};

View file

@ -6,20 +6,21 @@ import {
getDefaultValues, getDefaultValues,
getThemeIconsByContributeID, getThemeIconsByContributeID,
getThemeIconsContribute, getThemeIconsContribute,
getVariantIcons getIconVariantFromTheme
} from './../../helpers/fs'; } from './../../helpers/fs';
import { import {
isAccent, isAccent,
isMaterialThemeIcons, getCustomSettings,
getCustomSettings isMaterialTheme,
setCustomSetting
} from './../../helpers/settings'; } from './../../helpers/settings';
import {getCurrentThemeIconsID, getCurrentThemeID} from './../../helpers/vscode'; import {getCurrentThemeID, setIconsID, getCurrentThemeIconsID, reloadWindow} from './../../helpers/vscode';
import {CHARSET} from './../../consts/files'; import {CHARSET} from './../../consts/files';
import {IPackageJSONThemeIcons} from './../../interfaces/ipackage.json'; import {IPackageJSONThemeIcons} from './../../interfaces/ipackage.json';
import {IThemeIconsIconPath, IThemeIcons} from './../../interfaces/itheme-icons'; import {IThemeIconsIconPath, IThemeIcons} from './../../interfaces/itheme-icons';
const getIconDefinition = (definitions: any, iconname: string): IThemeIconsIconPath => { const getIconDefinition = (definitions: any, iconName: string): IThemeIconsIconPath => {
return (definitions as any)[iconname]; return (definitions as any)[iconName];
}; };
/** /**
@ -29,80 +30,73 @@ const replaceIconPathWithAccent = (iconPath: string, accentName: string): string
return iconPath.replace('.svg', `.accent.${ accentName }.svg`); return iconPath.replace('.svg', `.accent.${ accentName }.svg`);
}; };
const getVariantFromColor = (color: string): string => { /**
switch (true) { * Fix icons when flag auto-fix is active and current theme is Material
case color === undefined || color === 'Material Theme': */
return 'Default'; export default async () => {
case color === 'Material Theme High Contrast':
return 'Default High Contrast';
case color.includes('Material Theme Lighter'):
return 'Light';
default:
return color.replace(/Material Theme /gi, '');
}
};
export const THEME_ICONS = () => {
const deferred: any = {}; const deferred: any = {};
const promise = new Promise((resolve, reject) => { const promise = new Promise((resolve, reject) => {
deferred.resolve = resolve; deferred.resolve = resolve;
deferred.reject = reject; deferred.reject = reject;
}); });
const themeIconsID: string = getCurrentThemeIconsID();
if (isMaterialThemeIcons(themeIconsID)) { // Current theme id set on VSCode ("label" of the package.json)
const themeID = getCurrentThemeID(); const themeLabel = getCurrentThemeID();
const customSettings = getCustomSettings();
const defaults = getDefaultValues();
const accentName = customSettings.accent;
const variantName: string = getVariantFromColor(themeID);
const themeContribute: IPackageJSONThemeIcons = getThemeIconsContribute(themeIconsID); // If this method was called without Material Theme set, just return
const theme: IThemeIcons = getThemeIconsByContributeID(themeIconsID); if (!isMaterialTheme(themeLabel)) {
const themepath: string = getAbsolutePath(themeContribute.path); return deferred.resolve();
if (isAccent(accentName, defaults)) {
const realAccentName = accentName.replace(/\s+/, '-');
getAccentableIcons().forEach(iconname => {
const distIcon = getIconDefinition(theme.iconDefinitions, iconname);
const outIcon = getIconDefinition(defaults.icons.theme.iconDefinitions, iconname);
if (typeof distIcon === 'object' && typeof outIcon === 'object') {
distIcon.iconPath = replaceIconPathWithAccent(outIcon.iconPath, realAccentName);
}
});
} else {
getAccentableIcons().forEach(iconname => {
const distIcon = getIconDefinition(theme.iconDefinitions, iconname);
const outIcon = getIconDefinition(defaults.icons.theme.iconDefinitions, iconname);
distIcon.iconPath = outIcon.iconPath;
});
}
getVariantIcons().forEach(iconname => {
const distIcon = getIconDefinition(theme.iconDefinitions, iconname);
const outIcon = getIconDefinition(defaults.icons.theme.iconDefinitions, iconname);
if (distIcon && outIcon) {
distIcon.iconPath = outIcon.iconPath.replace('.svg', `${ variantName }.svg`);
}
});
fs.writeFile(themepath, JSON.stringify(theme), {
encoding: CHARSET
}, err => {
if (err) {
deferred.reject(err);
return;
}
deferred.resolve();
});
} else {
deferred.resolve();
} }
return promise; await setCustomSetting('fixIconsRunning', true);
const DEFAULTS = getDefaultValues();
const CUSTOM_SETTINGS = getCustomSettings();
const materialIconVariantID: string | null = getIconVariantFromTheme(themeLabel);
const currentThemeIconsID: string = getCurrentThemeIconsID();
const newThemeIconsID = materialIconVariantID ?
`eq-material-theme-icons-${materialIconVariantID}` : 'eq-material-theme-icons';
// Just set the correct Material Theme icons variant if wasn't
// Or also change the current icons set to the Material Theme icons variant
// (this is intended: this command was called directly or `autoFix` flag was already checked by other code)
if (currentThemeIconsID !== newThemeIconsID) {
await setIconsID(newThemeIconsID);
}
// package.json iconThemes object for the current icons set
const themeIconsContribute: IPackageJSONThemeIcons = getThemeIconsContribute(newThemeIconsID);
// Actual json file of the icons theme (eg. Material-Theme-Icons-Darker.json)
const theme: IThemeIcons = getThemeIconsByContributeID(newThemeIconsID);
const newIconPath = (outIcon: IThemeIconsIconPath) => isAccent(CUSTOM_SETTINGS.accent, DEFAULTS) ?
replaceIconPathWithAccent(outIcon.iconPath, CUSTOM_SETTINGS.accent.replace(/\s+/, '-')) : outIcon.iconPath;
getAccentableIcons().forEach(iconName => {
const distIcon = getIconDefinition(theme.iconDefinitions, iconName);
const outIcon = getIconDefinition(DEFAULTS.icons.theme.iconDefinitions, iconName);
if (typeof distIcon === 'object' && typeof outIcon === 'object') {
distIcon.iconPath = newIconPath(outIcon);
}
});
// Path of the icons theme .json
const themePath: string = getAbsolutePath(themeIconsContribute.path);
fs.writeFile(themePath, JSON.stringify(theme), {
encoding: CHARSET
}, async err => {
if (err) {
deferred.reject(err);
return;
}
await setCustomSetting('fixIconsRunning', false);
deferred.resolve();
});
return promise
.then(() => reloadWindow())
.catch((error: NodeJS.ErrnoException) => console.trace(error));
}; };

View file

@ -0,0 +1,11 @@
import * as vscode from 'vscode';
export default async (): Promise<void> => {
// shows the quick pick dropdown and wait response
const optionSelected = await vscode.window.showQuickPick(['Enable', 'Disable']);
const isEnable = optionSelected === 'Enable';
return Promise.resolve(vscode.workspace
.getConfiguration().update('materialTheme.autoApplyIcons', isEnable, true)
);
};

View file

@ -145,6 +145,12 @@
} }
} }
}, },
"themeIconVariants": {
"Darker": "eq-material-theme-icons-darker",
"Light": "eq-material-theme-icons-light",
"Palenight": "eq-material-theme-icons-palenight",
"Ocean": "eq-material-theme-icons-ocean"
},
"themeVariants": { "themeVariants": {
"Darker": "./themes/Material-Theme-Darker.json", "Darker": "./themes/Material-Theme-Darker.json",
"Darker High Contrast": "./themes/Material-Theme-Darker-High-Contrast.json", "Darker High Contrast": "./themes/Material-Theme-Darker-High-Contrast.json",

View file

@ -0,0 +1,42 @@
import {
ConfigurationChangeEvent
} from 'vscode';
import {getCustomSettings, isMaterialThemeIcons, isAutoApplyEnable, isMaterialTheme} from './settings';
import {getCurrentThemeIconsID, getCurrentThemeID} from './vscode';
import * as ThemeCommands from './../commands';
import {infoMessage} from './messages';
const icons = () => isAutoApplyEnable() ? ThemeCommands.fixIcons() : infoMessage();
const onIconsChanged = () => {
const customSettings = getCustomSettings();
if (customSettings.fixIconsRunning) {
return;
}
const currentIconsTheme = getCurrentThemeIconsID();
if (isMaterialThemeIcons(currentIconsTheme)) {
return icons();
}
};
const onThemeChanged = () => {
const currentTheme = getCurrentThemeID();
if (isMaterialTheme(currentTheme)) {
return icons();
}
};
export const onChangeConfiguration = (event: ConfigurationChangeEvent) => {
const isColorTheme = event.affectsConfiguration('workbench.colorTheme');
const isIconTheme = event.affectsConfiguration('workbench.iconTheme');
if (isIconTheme) {
return onIconsChanged();
}
if (isColorTheme) {
return onThemeChanged();
}
};

View file

@ -52,6 +52,15 @@ export function getThemeIconsContribute(ID: string): IPackageJSONThemeIcons {
return contributes[0] !== undefined ? contributes[0] : null; return contributes[0] !== undefined ? contributes[0] : null;
} }
/**
* Icon variant name from theme name
*/
export function getIconVariantFromTheme(theme: string): string {
const {themeIconVariants} = getDefaultValues();
const found = Object.keys(themeIconVariants).find(variant => theme.includes(variant));
return found ? found.toLowerCase() : null;
}
/** /**
* Gets package JSON * Gets package JSON
*/ */

View file

@ -0,0 +1,14 @@
import {
window as Window
} from 'vscode';
import * as ThemeCommands from './../commands';
const INFO_MESSAGE = 'You should reload the window for full activate the Material Theme.';
const OPTIONS = {ok: 'Reload now', cancel: 'Cancel'};
export const infoMessage = async () => {
if (await Window.showInformationMessage(INFO_MESSAGE, OPTIONS.ok, OPTIONS.cancel) === OPTIONS.ok) {
ThemeCommands.fixIcons();
}
};

View file

@ -18,11 +18,18 @@ export function getCustomSettings(): IThemeCustomProperties {
return vscode.workspace.getConfiguration().get<IThemeCustomProperties>('materialTheme', {}); return vscode.workspace.getConfiguration().get<IThemeCustomProperties>('materialTheme', {});
} }
/**
* Get autoApplyIcons
*/
export function isAutoApplyEnable(): boolean {
return vscode.workspace.getConfiguration().get<boolean>('materialTheme.autoApplyIcons', true);
}
/** /**
* Checks if a given string could be an accent * Checks if a given string could be an accent
*/ */
export function isAccent(accentName: string, defaults: IDefaults): boolean { export function isAccent(accentName: string, defaults: IDefaults): boolean {
return Object.keys(defaults.accents).filter(name => name === accentName).length > 0; return Boolean(Object.keys(defaults.accents).find(name => name === accentName));
} }
/** /**
@ -30,7 +37,7 @@ export function isAccent(accentName: string, defaults: IDefaults): boolean {
*/ */
export function isMaterialTheme(themeName: string): boolean { export function isMaterialTheme(themeName: string): boolean {
const packageJSON = getPackageJSON(); const packageJSON = getPackageJSON();
return packageJSON.contributes.themes.filter(contrib => contrib.label === themeName).length > 0; return Boolean(packageJSON.contributes.themes.find(contrib => contrib.label === themeName));
} }
/** /**
@ -38,20 +45,20 @@ export function isMaterialTheme(themeName: string): boolean {
*/ */
export function isMaterialThemeIcons(themeIconsName: string): boolean { export function isMaterialThemeIcons(themeIconsName: string): boolean {
const packageJSON = getPackageJSON(); const packageJSON = getPackageJSON();
return packageJSON.contributes.iconThemes.filter(contribute => contribute.id === themeIconsName).length > 0; return Boolean(packageJSON.contributes.iconThemes.find(contribute => contribute.id === themeIconsName));
} }
/** /**
* Sets a custom property in custom settings * Sets a custom property in custom settings
*/ */
export function setCustomSetting(settingName: string, value: any): Thenable<void> { export function setCustomSetting(settingName: string, value: any): Thenable<string> {
return vscode.workspace.getConfiguration().update(`materialTheme.${settingName}`, value, true); return vscode.workspace.getConfiguration().update(`materialTheme.${settingName}`, value, true).then(() => settingName);
} }
/** /**
* Updates accent name * Updates accent name
*/ */
export function updateAccent(accentName: string): Thenable<void> { export function updateAccent(accentName: string): Thenable<string> {
const prevAccent = getAccent(); const prevAccent = getAccent();
return setCustomSetting('accentPrevious', prevAccent) return setCustomSetting('accentPrevious', prevAccent)
.then(() => setCustomSetting('accent', accentName)); .then(() => setCustomSetting('accent', accentName));

View file

@ -1,15 +1,8 @@
import * as path from 'path'; import * as path from 'path';
import * as vscode from 'vscode';
import {IDefaults} from './../interfaces/idefaults'; import {IDefaults} from './../interfaces/idefaults';
import {getDefaultValues, getPackageJSON, writeFile} from './fs'; import {getDefaultValues, getPackageJSON, writeFile} from './fs';
import {PATHS} from './../consts/paths';
const previewFile = (): void => {
const uri = vscode.Uri.file(path.join(PATHS.VSIX_DIR, './CHANGELOG.md'));
vscode.commands.executeCommand('markdown.showPreview', uri);
};
const splitVersion = (input: string): {major: number; minor: number; patch: number} => { const splitVersion = (input: string): {major: number; minor: number; patch: number} => {
const [major, minor, patch] = input.split('.').map(i => parseInt(i, 10)); const [major, minor, patch] = input.split('.').map(i => parseInt(i, 10));
@ -19,26 +12,7 @@ const splitVersion = (input: string): {major: number; minor: number; patch: numb
const writeDefaults = (defaults: IDefaults) => const writeDefaults = (defaults: IDefaults) =>
writeFile(path.join('./extensions/defaults.json'), JSON.stringify(defaults, null, 2)); writeFile(path.join('./extensions/defaults.json'), JSON.stringify(defaults, null, 2));
export const showChangelog = (): void => { export default (): boolean => {
const extname: string = 'vscode.markdown';
const md = vscode.extensions.getExtension<any>(extname);
if (md === undefined) {
console.warn(`Ext not found ${ extname }`);
return;
}
if (md.isActive) {
return previewFile();
}
md.activate()
.then(() => previewFile(),
reason => console.warn(reason)
);
};
export const shouldShowChangelog = (): boolean => {
const defaults = getDefaultValues(); const defaults = getDefaultValues();
const packageJSON = getPackageJSON(); const packageJSON = getPackageJSON();

View file

@ -4,6 +4,7 @@ export interface IDefaults {
changelog: IChangelog; changelog: IChangelog;
icons: IDefaultsThemeIcons; icons: IDefaultsThemeIcons;
themeVariants: IDefaultsThemeVariant; themeVariants: IDefaultsThemeVariant;
themeIconVariants: IDefaultsThemeIconVariant;
themeVariantsColours: IDefaultsThemeVariant; themeVariantsColours: IDefaultsThemeVariant;
themeVariantsUITheme: IDefaultsThemeVariant; themeVariantsUITheme: IDefaultsThemeVariant;
variantsIcons: string[]; variantsIcons: string[];
@ -54,4 +55,14 @@ export interface IDefaultsThemeVariant {
Light: string; Light: string;
LightHighContrast: string; LightHighContrast: string;
PalenightHighContrast: string; PalenightHighContrast: string;
Ocean: string;
OceanHighContrast: string;
}
export interface IDefaultsThemeIconVariant {
[index: string]: string;
Darker: string;
Light: string;
Palenight: string;
Ocean: string;
} }

View file

@ -1,4 +1,6 @@
export interface IThemeCustomProperties { export interface IThemeCustomProperties {
accent?: string; accent?: string;
accentPrevious?: string; accentPrevious?: string;
autoApplyIcons?: boolean;
fixIconsRunning?: boolean;
} }

View file

@ -3,28 +3,17 @@ import {
commands as Commands commands as Commands
} from 'vscode'; } from 'vscode';
import {THEME_ACCENTS_SETTER} from './commands/accents-setter/index'; import * as ThemeCommands from './commands';
import {THEME_ICONS} from './commands/theme-icons/index'; import {isAutoApplyEnable} from './helpers/settings';
import {shouldShowChangelog, showChangelog} from './helpers/changelog'; import {onChangeConfiguration} from './helpers/configuration-change';
import {reloadWindow, getCurrentThemeID, setIconsID} from './helpers/vscode'; import {infoMessage} from './helpers/messages';
import shouldShowChangelog from './helpers/should-show-changelog';
const isMaterialTheme = (currentTheme: string): boolean =>
currentTheme.includes('Material Theme');
export function activate() { export function activate() {
const config = Workspace.getConfiguration(); const config = Workspace.getConfiguration();
// Listen on set theme: when the theme is Material Theme, just adjust icon and accent. // Listen on set theme: when the theme is Material Theme, just adjust icon and accent.
Workspace.onDidChangeConfiguration(event => { Workspace.onDidChangeConfiguration(onChangeConfiguration);
const isColorTheme = event.affectsConfiguration('workbench.colorTheme');
const currentTheme = getCurrentThemeID();
// tslint:disable-next-line:early-exit
if (isColorTheme && isMaterialTheme(currentTheme)) {
setIconsID('eq-material-theme-icons')
.then(() => THEME_ICONS().catch(error => console.trace(error)))
.then(() => reloadWindow());
}
});
// Delete old configuration, must remove with next major release // Delete old configuration, must remove with next major release
if (config.has('materialTheme.cache.workbench')) { if (config.has('materialTheme.cache.workbench')) {
@ -32,15 +21,18 @@ export function activate() {
} }
if (shouldShowChangelog()) { if (shouldShowChangelog()) {
showChangelog(); ThemeCommands.showChangelog();
} }
// Registering commands // Registering commands
Commands.registerCommand('materialTheme.setAccent', () => THEME_ACCENTS_SETTER()); Commands.registerCommand('materialTheme.setAccent', async () => {
Commands.registerCommand('materialTheme.fixIcons', () => const wasSet = await ThemeCommands.accentsSetter();
THEME_ICONS()
.then(() => reloadWindow()) if (wasSet) {
.catch(err => console.trace(err)) return isAutoApplyEnable() ? ThemeCommands.fixIcons() : infoMessage();
); }
Commands.registerCommand('materialTheme.showChangelog', () => showChangelog()); });
Commands.registerCommand('materialTheme.fixIcons', () => ThemeCommands.fixIcons());
Commands.registerCommand('materialTheme.toggleApplyIcons', () => ThemeCommands.toggleApplyIcons());
Commands.registerCommand('materialTheme.showChangelog', () => ThemeCommands.showChangelog());
} }

View file

@ -28,7 +28,7 @@
} }
}, },
"scripts": { "scripts": {
"build": "yarn build-icons && yarn build-themes && yarn build-icons-accents && yarn build-icons-variants", "build": "yarn build-icons && yarn build-themes && yarn build-icons-accents && yarn build-icons-variants && yarn build-icons-variants-json",
"minimize-icons": "mkdir icons && svgo -f src/icons/svgs -o icons/", "minimize-icons": "mkdir icons && svgo -f src/icons/svgs -o icons/",
"minimize-json": "json-minify themes/.material-theme-icons.tmp > themes/Material-Theme-Icons.json && yarn remove-icons-tmp", "minimize-json": "json-minify themes/.material-theme-icons.tmp > themes/Material-Theme-Icons.json && yarn remove-icons-tmp",
"remove-icons": "rimraf icons && rimraf themes/Material-Theme-Icons.json", "remove-icons": "rimraf icons && rimraf themes/Material-Theme-Icons.json",
@ -36,6 +36,7 @@
"build-icons": "yarn remove-icons && yarn minimize-icons && yarn gulp build:icons && yarn minimize-json", "build-icons": "yarn remove-icons && yarn minimize-icons && yarn gulp build:icons && yarn minimize-json",
"build-icons-accents": "yarn gulp build:icons.accents", "build-icons-accents": "yarn gulp build:icons.accents",
"build-icons-variants": "yarn gulp build:icons.variants", "build-icons-variants": "yarn gulp build:icons.variants",
"build-icons-variants-json": "yarn gulp build:icons.variants-json",
"build-themes": "yarn gulp build:themes", "build-themes": "yarn gulp build:themes",
"build-ts": "tsc -p ./tsconfig.json", "build-ts": "tsc -p ./tsconfig.json",
"test": "tslint **.ts", "test": "tslint **.ts",
@ -52,6 +53,11 @@
"main": "./extensions/material.theme.config.js", "main": "./extensions/material.theme.config.js",
"contributes": { "contributes": {
"commands": [ "commands": [
{
"command": "materialTheme.toggleApplyIcons",
"title": "Toggle icons auto-apply ",
"category": "🎨 Material Theme"
},
{ {
"command": "materialTheme.setAccent", "command": "materialTheme.setAccent",
"title": "Set accent color", "title": "Set accent color",
@ -79,6 +85,16 @@
"materialTheme.accentPrevious": { "materialTheme.accentPrevious": {
"type": "string", "type": "string",
"description": "Previous accent color selected" "description": "Previous accent color selected"
},
"materialTheme.autoApplyIcons": {
"type": "boolean",
"description": "Enable/disable auto-apply of Material Theme icons",
"default": true
},
"materialTheme.fixIconsRunning": {
"type": "boolean",
"description": "For checking if the command is currently acting",
"default": false
} }
} }
}, },
@ -139,6 +155,26 @@
"id": "eq-material-theme-icons", "id": "eq-material-theme-icons",
"label": "Material Theme Icons", "label": "Material Theme Icons",
"path": "./themes/Material-Theme-Icons.json" "path": "./themes/Material-Theme-Icons.json"
},
{
"id": "eq-material-theme-icons-darker",
"label": "Material Theme Icons Darker",
"path": "./themes/Material-Theme-Icons-Darker.json"
},
{
"id": "eq-material-theme-icons-palenight",
"label": "Material Theme Icons Palenight",
"path": "./themes/Material-Theme-Icons-Palenight.json"
},
{
"id": "eq-material-theme-icons-ocean",
"label": "Material Theme Icons Ocean",
"path": "./themes/Material-Theme-Icons-Ocean.json"
},
{
"id": "eq-material-theme-icons-light",
"label": "Material Theme Icons Light",
"path": "./themes/Material-Theme-Icons-Light.json"
} }
] ]
}, },

View file

@ -13,7 +13,7 @@
"findHighlight": "#FFCC00", "findHighlight": "#FFCC00",
"foreground": "#EEFFFF", "foreground": "#EEFFFF",
"focusBorder": "#FFFFFF", "focusBorder": "#FFFFFF",
"guides": "#42424270", "guides": "#424242",
"lineNumbers": "#424242", "lineNumbers": "#424242",
"invisibles": "#65737E", "invisibles": "#65737E",
"lineHighlight": "#000000", "lineHighlight": "#000000",

View file

@ -11,7 +11,7 @@
"findHighlight": "#FFCC00", "findHighlight": "#FFCC00",
"foreground": "#EEFFFF", "foreground": "#EEFFFF",
"focusBorder": "#FFFFFF", "focusBorder": "#FFFFFF",
"guides": "#42424270", "guides": "#424242",
"lineNumbers": "#424242", "lineNumbers": "#424242",
"invisibles": "#65737E", "invisibles": "#65737E",
"lineHighlight": "#000000", "lineHighlight": "#000000",

View file

@ -13,7 +13,7 @@
"findHighlight": "#FFCC00", "findHighlight": "#FFCC00",
"foreground": "#EEFFFF", "foreground": "#EEFFFF",
"focusBorder": "#FFFFFF", "focusBorder": "#FFFFFF",
"guides": "#37474F80", "guides": "#37474F",
"lineNumbers": "#37474F", "lineNumbers": "#37474F",
"invisibles": "#65737E", "invisibles": "#65737E",
"lineHighlight": "#000000", "lineHighlight": "#000000",

View file

@ -11,7 +11,7 @@
"findHighlight": "#FFCC00", "findHighlight": "#FFCC00",
"foreground": "#EEFFFF", "foreground": "#EEFFFF",
"focusBorder": "#FFFFFF", "focusBorder": "#FFFFFF",
"guides": "#37474F80", "guides": "#37474F",
"lineNumbers": "#37474F", "lineNumbers": "#37474F",
"invisibles": "#65737E", "invisibles": "#65737E",
"lineHighlight": "#000000", "lineHighlight": "#000000",

View file

@ -13,7 +13,7 @@
"findHighlight": "#FFCC00", "findHighlight": "#FFCC00",
"foreground": "#90A4AE", "foreground": "#90A4AE",
"focusBorder": "#FFFFFF", "focusBorder": "#FFFFFF",
"guides": "#B0BEC570", "guides": "#B0BEC5",
"lineNumbers": "#CFD8DC", "lineNumbers": "#CFD8DC",
"invisibles": "#E7EAEC", "invisibles": "#E7EAEC",
"lineHighlight": "#CCD7DA", "lineHighlight": "#CCD7DA",

View file

@ -11,7 +11,7 @@
"findHighlight": "#FFCC00", "findHighlight": "#FFCC00",
"foreground": "#90A4AE", "foreground": "#90A4AE",
"focusBorder": "#FFFFFF", "focusBorder": "#FFFFFF",
"guides": "#B0BEC570", "guides": "#B0BEC5",
"lineNumbers": "#CFD8DC", "lineNumbers": "#CFD8DC",
"invisibles": "#E7EAEC", "invisibles": "#E7EAEC",
"lineHighlight": "#CCD7DA", "lineHighlight": "#CCD7DA",

View file

@ -11,7 +11,7 @@
"findHighlight": "#FFCC00", "findHighlight": "#FFCC00",
"foreground": "#8F93A2", "foreground": "#8F93A2",
"focusBorder": "#FFFFFF", "focusBorder": "#FFFFFF",
"guides": "#3B3F5150", "guides": "#3B3F51",
"lineNumbers": "#3B3F5180", "lineNumbers": "#3B3F5180",
"invisibles": "#80869E50", "invisibles": "#80869E50",
"lineHighlight": "#000000", "lineHighlight": "#000000",

View file

@ -11,7 +11,7 @@
"findHighlight": "#FFCC00", "findHighlight": "#FFCC00",
"foreground": "#8F93A2", "foreground": "#8F93A2",
"focusBorder": "#FFFFFF", "focusBorder": "#FFFFFF",
"guides": "#3B3F5150", "guides": "#3B3F51",
"lineNumbers": "#3B3F5180", "lineNumbers": "#3B3F5180",
"invisibles": "#80869E50", "invisibles": "#80869E50",
"lineHighlight": "#000000", "lineHighlight": "#000000",

View file

@ -13,7 +13,7 @@
"findHighlight": "#FFCC00", "findHighlight": "#FFCC00",
"foreground": "#A6ACCD", "foreground": "#A6ACCD",
"focusBorder": "#FFFFFF", "focusBorder": "#FFFFFF",
"guides": "#4E557980", "guides": "#4E5579",
"lineNumbers": "#3A3F58", "lineNumbers": "#3A3F58",
"invisibles": "#4E5579", "invisibles": "#4E5579",
"lineHighlight": "#000000", "lineHighlight": "#000000",

View file

@ -11,7 +11,7 @@
"findHighlight": "#FFCC00", "findHighlight": "#FFCC00",
"foreground": "#A6ACCD", "foreground": "#A6ACCD",
"focusBorder": "#FFFFFF", "focusBorder": "#FFFFFF",
"guides": "#4E557980", "guides": "#4E5579",
"lineNumbers": "#3A3F58", "lineNumbers": "#3A3F58",
"invisibles": "#4E5579", "invisibles": "#4E5579",
"lineHighlight": "#000000", "lineHighlight": "#000000",

View file

@ -706,7 +706,8 @@
"editorOverviewRuler.border": "{{variant.scheme.background}}", "editorOverviewRuler.border": "{{variant.scheme.background}}",
"editorHoverWidget.background": "{{variant.scheme.background}}", "editorHoverWidget.background": "{{variant.scheme.background}}",
"editorHoverWidget.border": "{{variant.scheme.inputBorder}}", "editorHoverWidget.border": "{{variant.scheme.inputBorder}}",
"editorIndentGuide.background": "{{variant.scheme.guides}}", "editorIndentGuide.background": "{{variant.scheme.guides}}70",
"editorIndentGuide.activeBackground": "{{variant.scheme.guides}}",
"editorGroupHeader.tabsBackground": "{{variant.scheme.background}}", "editorGroupHeader.tabsBackground": "{{variant.scheme.background}}",
"editorGroup.border": "{{variant.scheme.shadow}}", "editorGroup.border": "{{variant.scheme.shadow}}",
"editorGutter.modifiedBackground": "{{variant.scheme.base.blue}}60", "editorGutter.modifiedBackground": "{{variant.scheme.base.blue}}60",