Merge branch 'develop'
This commit is contained in:
commit
35367addb7
38 changed files with 1608 additions and 331 deletions
2
.babelrc
2
.babelrc
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"presets": [
|
"presets": [
|
||||||
"es2015"
|
"env"
|
||||||
]
|
]
|
||||||
}
|
}
|
1
.gitignore
vendored
1
.gitignore
vendored
|
@ -12,3 +12,4 @@ node_modules/
|
||||||
/src/icons/svgs/*.svg
|
/src/icons/svgs/*.svg
|
||||||
.tmp-output-remote-icons
|
.tmp-output-remote-icons
|
||||||
_tmp-output-remote-icons
|
_tmp-output-remote-icons
|
||||||
|
/ui/
|
||||||
|
|
|
@ -7,6 +7,7 @@ export * from './tasks/themes';
|
||||||
export * from './tasks/watcher';
|
export * from './tasks/watcher';
|
||||||
export * from './tasks/changelog-title';
|
export * from './tasks/changelog-title';
|
||||||
export * from './tasks/get-remote-icons';
|
export * from './tasks/get-remote-icons';
|
||||||
|
export * from './tasks/copy-ui';
|
||||||
|
|
||||||
// export default script
|
// export default script
|
||||||
export default ['build:themes'];
|
export default ['build:themes'];
|
||||||
|
|
28
.gulp/tasks/copy-ui.ts
Normal file
28
.gulp/tasks/copy-ui.ts
Normal file
|
@ -0,0 +1,28 @@
|
||||||
|
import * as fs from 'fs';
|
||||||
|
import * as path from 'path';
|
||||||
|
import * as gulp from 'gulp';
|
||||||
|
|
||||||
|
import {PATHS} from '../../extensions/consts/paths';
|
||||||
|
import {ensureDir} from '../../extensions/helpers/fs';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* For each ThemeIconVariant create a Material-Theme-Icons-{variant}.json
|
||||||
|
* depends on default Material-Theme-Icons.json
|
||||||
|
*/
|
||||||
|
export default gulp.task('build:copy-ui', callback => {
|
||||||
|
try {
|
||||||
|
ensureDir(path.resolve(PATHS.UI));
|
||||||
|
fs.copyFileSync(
|
||||||
|
path.join(PATHS.SRC, 'webviews', 'ui', 'release-notes', 'release-notes.html'),
|
||||||
|
path.join(PATHS.UI, 'release-notes.html')
|
||||||
|
);
|
||||||
|
fs.copyFileSync(
|
||||||
|
path.join(PATHS.SRC, 'webviews', 'ui', 'release-notes', 'style.css'),
|
||||||
|
path.join(PATHS.UI, 'release-notes.css')
|
||||||
|
);
|
||||||
|
} catch (error) {
|
||||||
|
return callback(error);
|
||||||
|
}
|
||||||
|
|
||||||
|
callback();
|
||||||
|
});
|
9
.vscode/tasks.json
vendored
9
.vscode/tasks.json
vendored
|
@ -84,6 +84,15 @@
|
||||||
"command": "npm",
|
"command": "npm",
|
||||||
"dependsOn": "clean project",
|
"dependsOn": "clean project",
|
||||||
"label": "tsc"
|
"label": "tsc"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"args": [
|
||||||
|
"run",
|
||||||
|
"build-ui-only"
|
||||||
|
],
|
||||||
|
"command": "npm",
|
||||||
|
"label": "UI: build UI only",
|
||||||
|
"problemMatcher": []
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
|
@ -1,9 +1,9 @@
|
||||||
|
|
||||||
<p align="center"><img width="980px" src="https://i.imgur.com/qvxc7OA.jpg"></p>
|
<p align="center"><img width="980px" src="https://i.imgur.com/qvxc7OA.jpg"></p>
|
||||||
|
|
||||||
[![Twitter](https://img.shields.io/twitter/url/https/github.com/equinusocio/vsc-material-theme.svg?style=flat-square)](https://twitter.com/intent/tweet?text=This%20is%20the%20most%20epic%20theme:&url=https%3A%2F%2Fgithub.com%2Fequinusocio%2Fvsc-material-theme)
|
[![Twitter](https://img.shields.io/twitter/url/https/github.com/equinusocio/vsc-material-theme.svg?style=flat-square)](https://twitter.com/intent/tweet?text=Check%20the%20most%20epic%20theme%20for%20Visual%20Studio%20Code:&url=https%3A%2F%2Fgithub.com%2Fequinusocio%2Fvsc-material-theme)
|
||||||
[![GitHub tag](https://img.shields.io/github/release/equinusocio/vsc-material-theme.svg?style=flat-square)](https://github.com/equinusocio/vsc-material-theme/releases)
|
[![GitHub tag](https://img.shields.io/github/release/equinusocio/vsc-material-theme.svg?style=flat-square)](https://github.com/equinusocio/vsc-material-theme/releases)
|
||||||
<a href="https://code.visualstudio.com/updates/v1_19"><img src="https://img.shields.io/badge/VS_Code-v1.19+-373277.svg?style=flat-square"/></a> <a href="https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-material-theme"><img src="https://vsmarketplacebadge.apphb.com/installs/Equinusocio.vsc-material-theme.svg?style=flat-square"/></a>
|
<a href="https://code.visualstudio.com/updates/v1_25"><img src="https://img.shields.io/badge/VS_Code-v1.25+-373277.svg?style=flat-square"/></a> <a href="https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-material-theme"><img src="https://vsmarketplacebadge.apphb.com/installs/Equinusocio.vsc-material-theme.svg?style=flat-square"/></a>
|
||||||
<a href="https://opencollective.com/vsc-material-theme"><img src="https://img.shields.io/badge/Support%20this%20project-%F0%9F%92%96%EF%B8%8F-green.svg?style=flat-square"/></a>
|
<a href="https://opencollective.com/vsc-material-theme"><img src="https://img.shields.io/badge/Support%20this%20project-%F0%9F%92%96%EF%B8%8F-green.svg?style=flat-square"/></a>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -35,37 +35,46 @@ const isValidColour = (colour: string | null | undefined): boolean =>
|
||||||
/**
|
/**
|
||||||
* Sets workbench options
|
* Sets workbench options
|
||||||
*/
|
*/
|
||||||
const setWorkbenchOptions = (accentSelected: string | undefined, config: any): Thenable<string> =>
|
const setWorkbenchOptions = (config: any): Thenable<boolean> =>
|
||||||
vscode.workspace.getConfiguration().update('workbench.colorCustomizations', config, true)
|
vscode.workspace.getConfiguration().update('workbench.colorCustomizations', config, true)
|
||||||
.then(() => updateAccent(accentSelected),
|
.then(() => true, reason => vscode.window.showErrorMessage(reason));
|
||||||
reason => vscode.window.showErrorMessage(reason));
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* VSCode command
|
* VSCode command
|
||||||
*/
|
*/
|
||||||
export default async (): Promise<boolean> => {
|
export default async (accent?: string): Promise<boolean> => {
|
||||||
const themeConfigCommon = getDefaultValues();
|
const themeConfigCommon = getDefaultValues();
|
||||||
const purgeColourKey: string = 'Remove accents';
|
const purgeColourKey: string = 'Remove accents';
|
||||||
const options: string[] = Object.keys(themeConfigCommon.accents).concat(purgeColourKey);
|
const shouldUpdateAccent = Boolean(!accent);
|
||||||
|
let accentToSelect = accent;
|
||||||
|
|
||||||
// shows the quick pick dropdown and wait response
|
// If called without accent shows the quick pick dropdown and wait response
|
||||||
|
if (!accentToSelect) {
|
||||||
|
const options: string[] = Object.keys(themeConfigCommon.accents).concat(purgeColourKey);
|
||||||
const accentSelected = await vscode.window.showQuickPick(options);
|
const accentSelected = await vscode.window.showQuickPick(options);
|
||||||
|
|
||||||
if (accentSelected === null || accentSelected === undefined) {
|
if (accentSelected === null || accentSelected === undefined) {
|
||||||
return Promise.resolve(null);
|
return Promise.resolve(null);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
accentToSelect = accentSelected;
|
||||||
|
}
|
||||||
|
|
||||||
const config: any = vscode.workspace.getConfiguration().get('workbench.colorCustomizations');
|
const config: any = vscode.workspace.getConfiguration().get('workbench.colorCustomizations');
|
||||||
|
|
||||||
switch (accentSelected) {
|
switch (accentToSelect) {
|
||||||
case purgeColourKey:
|
case purgeColourKey:
|
||||||
assignColorCustomizations(undefined, config);
|
assignColorCustomizations(undefined, config);
|
||||||
await setWorkbenchOptions(undefined, config);
|
return setWorkbenchOptions(config)
|
||||||
return Promise.resolve(true);
|
.then(() => updateAccent(undefined))
|
||||||
|
.then(() => Promise.resolve(true));
|
||||||
default:
|
default:
|
||||||
assignColorCustomizations(themeConfigCommon.accents[accentSelected], config);
|
assignColorCustomizations(themeConfigCommon.accents[accentToSelect], config);
|
||||||
await setWorkbenchOptions(accentSelected, config);
|
return setWorkbenchOptions(config)
|
||||||
return Promise.resolve(true);
|
.then(() =>
|
||||||
|
shouldUpdateAccent ? updateAccent(accentToSelect) : Promise.resolve(accentToSelect)
|
||||||
|
)
|
||||||
|
.then(() => Promise.resolve(true));
|
||||||
}
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,4 +1,3 @@
|
||||||
export {default as accentsSetter} from './accents-setter';
|
export {default as accentsSetter} from './accents-setter';
|
||||||
export {default as fixIcons} from './theme-icons';
|
export {default as fixIcons} from './theme-icons';
|
||||||
export {default as toggleApplyIcons} from './toggle-apply-icons';
|
export {default as toggleApplyIcons} from './toggle-apply-icons';
|
||||||
export {default as showChangelog} from './show-changelog';
|
|
||||||
|
|
|
@ -1,28 +0,0 @@
|
||||||
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)
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -29,8 +29,6 @@ const replaceIconPathWithAccent = (iconPath: string, accentName: string): string
|
||||||
return iconPath.replace('.svg', `.accent.${ accentName }.svg`);
|
return iconPath.replace('.svg', `.accent.${ accentName }.svg`);
|
||||||
};
|
};
|
||||||
|
|
||||||
let fixIconsRunning: boolean = false;
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Fix icons when flag auto-fix is active and current theme is Material
|
* Fix icons when flag auto-fix is active and current theme is Material
|
||||||
*/
|
*/
|
||||||
|
@ -41,10 +39,6 @@ export default async () => {
|
||||||
deferred.reject = reject;
|
deferred.reject = reject;
|
||||||
});
|
});
|
||||||
|
|
||||||
if (fixIconsRunning) {
|
|
||||||
return deferred.resolve();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Current theme id set on VSCode ("label" of the package.json)
|
// Current theme id set on VSCode ("label" of the package.json)
|
||||||
const themeLabel = getCurrentThemeID();
|
const themeLabel = getCurrentThemeID();
|
||||||
|
|
||||||
|
@ -53,8 +47,6 @@ export default async () => {
|
||||||
return deferred.resolve();
|
return deferred.resolve();
|
||||||
}
|
}
|
||||||
|
|
||||||
fixIconsRunning = true;
|
|
||||||
|
|
||||||
const DEFAULTS = getDefaultValues();
|
const DEFAULTS = getDefaultValues();
|
||||||
const CUSTOM_SETTINGS = getCustomSettings();
|
const CUSTOM_SETTINGS = getCustomSettings();
|
||||||
|
|
||||||
|
@ -96,8 +88,6 @@ export default async () => {
|
||||||
deferred.reject(err);
|
deferred.reject(err);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
fixIconsRunning = false;
|
|
||||||
deferred.resolve();
|
deferred.resolve();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -7,6 +7,7 @@ export const PATHS: IPaths = {
|
||||||
ICONS: './icons',
|
ICONS: './icons',
|
||||||
SRC: './src',
|
SRC: './src',
|
||||||
THEMES: './themes',
|
THEMES: './themes',
|
||||||
|
UI: './ui',
|
||||||
VSIX_DIR: path.join(__dirname, '../../'),
|
VSIX_DIR: path.join(__dirname, '../../'),
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -19,6 +19,7 @@
|
||||||
},
|
},
|
||||||
"accentableIcons": [
|
"accentableIcons": [
|
||||||
"_folder_open",
|
"_folder_open",
|
||||||
|
"_folder_root_open",
|
||||||
"_folder_open_build",
|
"_folder_open_build",
|
||||||
"_folder_vscode_open",
|
"_folder_vscode_open",
|
||||||
"_folder_gulp_open",
|
"_folder_gulp_open",
|
||||||
|
@ -89,7 +90,7 @@
|
||||||
"alpha": 100,
|
"alpha": 100,
|
||||||
"value": null
|
"value": null
|
||||||
},
|
},
|
||||||
"settings.modifiedItemForeground": {
|
"settings.modifiedItemIndicator": {
|
||||||
"alpha": 100,
|
"alpha": 100,
|
||||||
"value": null
|
"value": null
|
||||||
},
|
},
|
||||||
|
@ -108,14 +109,10 @@
|
||||||
"menubar.selectionForeground": {
|
"menubar.selectionForeground": {
|
||||||
"alpha": 100,
|
"alpha": 100,
|
||||||
"value": null
|
"value": null
|
||||||
},
|
|
||||||
"settings.headerForeground": {
|
|
||||||
"alpha": 100,
|
|
||||||
"value": null
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"changelog": {
|
"changelog": {
|
||||||
"lastversion": "2.2.0"
|
"lastversion": "2.3.0"
|
||||||
},
|
},
|
||||||
"icons": {
|
"icons": {
|
||||||
"theme": {
|
"theme": {
|
||||||
|
@ -216,6 +213,12 @@
|
||||||
"_folder_light": {
|
"_folder_light": {
|
||||||
"iconPath": "../icons/folder_light.svg"
|
"iconPath": "../icons/folder_light.svg"
|
||||||
},
|
},
|
||||||
|
"_folder_root_dark": {
|
||||||
|
"iconPath": "../icons/folder_root_dark.svg"
|
||||||
|
},
|
||||||
|
"_folder_root_light": {
|
||||||
|
"iconPath": "../icons/folder_root_light.svg"
|
||||||
|
},
|
||||||
"_file_folder": {
|
"_file_folder": {
|
||||||
"iconPath": "../icons/file_folder.svg"
|
"iconPath": "../icons/file_folder.svg"
|
||||||
},
|
},
|
||||||
|
@ -225,6 +228,9 @@
|
||||||
"_folder_open": {
|
"_folder_open": {
|
||||||
"iconPath": "../icons/folder_open.svg"
|
"iconPath": "../icons/folder_open.svg"
|
||||||
},
|
},
|
||||||
|
"_folder_root_open": {
|
||||||
|
"iconPath": "../icons/folder_root_open.svg"
|
||||||
|
},
|
||||||
"_folder_open_build": {
|
"_folder_open_build": {
|
||||||
"iconPath": "../icons/folder_open_build.svg"
|
"iconPath": "../icons/folder_open_build.svg"
|
||||||
}
|
}
|
||||||
|
@ -290,6 +296,8 @@
|
||||||
"_folder_node",
|
"_folder_node",
|
||||||
"_folder_vscode",
|
"_folder_vscode",
|
||||||
"_folder_dark",
|
"_folder_dark",
|
||||||
"_folder_light"
|
"_folder_light",
|
||||||
|
"_folder_root_dark",
|
||||||
|
"_folder_root_light"
|
||||||
]
|
]
|
||||||
}
|
}
|
|
@ -1,10 +1,10 @@
|
||||||
import {
|
import {
|
||||||
ConfigurationChangeEvent
|
ConfigurationChangeEvent
|
||||||
} from 'vscode';
|
} from 'vscode';
|
||||||
import {isMaterialThemeIcons, isMaterialTheme} from './settings';
|
import {isMaterialThemeIcons, isMaterialTheme, getAccent} from './settings';
|
||||||
import {getCurrentThemeIconsID, getCurrentThemeID} from './vscode';
|
import {getCurrentThemeIconsID, getCurrentThemeID} from './vscode';
|
||||||
|
|
||||||
import handleAutoapply from './handle-autoapply';
|
import handleAutoapply from './handle-autoapply';
|
||||||
|
import {accentsSetter} from '../commands';
|
||||||
|
|
||||||
const onIconsChanged = () => {
|
const onIconsChanged = () => {
|
||||||
const currentIconsTheme = getCurrentThemeIconsID();
|
const currentIconsTheme = getCurrentThemeIconsID();
|
||||||
|
@ -16,10 +16,24 @@ const onThemeChanged = () => {
|
||||||
return handleAutoapply(isMaterialTheme(currentTheme));
|
return handleAutoapply(isMaterialTheme(currentTheme));
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const onAccentChanged = () => {
|
||||||
|
const currentTheme = getCurrentThemeID();
|
||||||
|
const currentIconsTheme = getCurrentThemeIconsID();
|
||||||
|
const currentAccent = getAccent();
|
||||||
|
return accentsSetter(currentAccent)
|
||||||
|
.then(() =>
|
||||||
|
handleAutoapply(
|
||||||
|
isMaterialTheme(currentTheme) && isMaterialThemeIcons(currentIconsTheme)
|
||||||
|
)
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
export const onChangeConfiguration = (event: ConfigurationChangeEvent) => {
|
export const onChangeConfiguration = (event: ConfigurationChangeEvent) => {
|
||||||
const isColorTheme = event.affectsConfiguration('workbench.colorTheme');
|
const isColorTheme = event.affectsConfiguration('workbench.colorTheme');
|
||||||
const isIconTheme = event.affectsConfiguration('workbench.iconTheme');
|
const isIconTheme = event.affectsConfiguration('workbench.iconTheme');
|
||||||
|
const isAccent = event.affectsConfiguration('materialTheme.accent');
|
||||||
|
|
||||||
return isIconTheme ? onIconsChanged() :
|
return isIconTheme ? onIconsChanged() :
|
||||||
isColorTheme ? onThemeChanged() : null;
|
isColorTheme ? onThemeChanged() :
|
||||||
|
isAccent ? onAccentChanged() : null;
|
||||||
};
|
};
|
||||||
|
|
|
@ -2,13 +2,16 @@ import {isAutoApplyEnable, isReloadNotificationEnable} from './settings';
|
||||||
import {infoMessage} from './messages';
|
import {infoMessage} from './messages';
|
||||||
import {fixIcons} from '../commands';
|
import {fixIcons} from '../commands';
|
||||||
|
|
||||||
|
let fixIconsRunning: boolean = false;
|
||||||
|
|
||||||
export default async (doubleCheck: boolean) => {
|
export default async (doubleCheck: boolean) => {
|
||||||
if (!doubleCheck) {
|
if (!doubleCheck || fixIconsRunning) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isAutoApplyEnable()) {
|
if (isAutoApplyEnable()) {
|
||||||
return fixIcons();
|
fixIconsRunning = true;
|
||||||
|
return fixIcons().then(() => fixIconsRunning = false);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!isReloadNotificationEnable()) {
|
if (!isReloadNotificationEnable()) {
|
||||||
|
@ -18,6 +21,7 @@ export default async (doubleCheck: boolean) => {
|
||||||
const result = await infoMessage();
|
const result = await infoMessage();
|
||||||
|
|
||||||
if (result.reload) {
|
if (result.reload) {
|
||||||
return fixIcons();
|
fixIconsRunning = true;
|
||||||
|
return fixIcons().then(() => fixIconsRunning = false);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import * as vscode from 'vscode';
|
import * as vscode from 'vscode';
|
||||||
|
|
||||||
import {IDefaults} from './../interfaces/idefaults';
|
import {IDefaults} from './../interfaces/idefaults';
|
||||||
import {IThemeCustomProperties} from './../interfaces/itheme-custom-properties';
|
import {IThemeCustomSettings} from './../interfaces/itheme-custom-properties';
|
||||||
import {getPackageJSON} from './fs';
|
import {getPackageJSON} from './fs';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -14,8 +14,8 @@ export function getAccent(): string | undefined {
|
||||||
/**
|
/**
|
||||||
* Gets custom settings
|
* Gets custom settings
|
||||||
*/
|
*/
|
||||||
export function getCustomSettings(): IThemeCustomProperties {
|
export function getCustomSettings(): IThemeCustomSettings {
|
||||||
return vscode.workspace.getConfiguration().get<IThemeCustomProperties>('materialTheme', {});
|
return vscode.workspace.getConfiguration().get<IThemeCustomSettings>('materialTheme', {});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -19,4 +19,8 @@ export interface IPaths {
|
||||||
* Extension directory
|
* Extension directory
|
||||||
*/
|
*/
|
||||||
VSIX_DIR: string;
|
VSIX_DIR: string;
|
||||||
|
/**
|
||||||
|
* UI directory
|
||||||
|
*/
|
||||||
|
UI: string;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
export interface IThemeCustomProperties {
|
export interface IThemeCustomSettings {
|
||||||
accent?: string;
|
accent?: string;
|
||||||
autoApplyIcons?: boolean;
|
autoApplyIcons?: boolean;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import {
|
import {
|
||||||
workspace as Workspace,
|
workspace as Workspace,
|
||||||
commands as Commands
|
commands as Commands,
|
||||||
|
ExtensionContext
|
||||||
} from 'vscode';
|
} from 'vscode';
|
||||||
|
|
||||||
import * as ThemeCommands from './commands';
|
import * as ThemeCommands from './commands';
|
||||||
|
@ -9,11 +10,13 @@ import {onChangeConfiguration} from './helpers/configuration-change';
|
||||||
import {changelogMessage, installationMessage} from './helpers/messages';
|
import {changelogMessage, installationMessage} from './helpers/messages';
|
||||||
import checkInstallation from './helpers/check-installation';
|
import checkInstallation from './helpers/check-installation';
|
||||||
import writeChangelog from './helpers/write-changelog';
|
import writeChangelog from './helpers/write-changelog';
|
||||||
|
import {ReleaseNotesWebview} from '../src/webviews/ReleaseNotes';
|
||||||
import handleAutoapply from './helpers/handle-autoapply';
|
import handleAutoapply from './helpers/handle-autoapply';
|
||||||
|
|
||||||
export async function activate() {
|
export async function activate(context: ExtensionContext) {
|
||||||
const config = Workspace.getConfiguration();
|
const config = Workspace.getConfiguration();
|
||||||
const installationType = checkInstallation();
|
const installationType = checkInstallation();
|
||||||
|
const releaseNotesView = new ReleaseNotesWebview(context);
|
||||||
|
|
||||||
writeChangelog();
|
writeChangelog();
|
||||||
|
|
||||||
|
@ -34,7 +37,7 @@ export async function activate() {
|
||||||
|
|
||||||
const shouldShowChangelog = (installationType.isFirstInstall || installationType.isUpdate) && await changelogMessage();
|
const shouldShowChangelog = (installationType.isFirstInstall || installationType.isUpdate) && await changelogMessage();
|
||||||
if (shouldShowChangelog) {
|
if (shouldShowChangelog) {
|
||||||
ThemeCommands.showChangelog();
|
releaseNotesView.show();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Registering commands
|
// Registering commands
|
||||||
|
@ -44,5 +47,6 @@ export async function activate() {
|
||||||
});
|
});
|
||||||
Commands.registerCommand('materialTheme.fixIcons', () => ThemeCommands.fixIcons());
|
Commands.registerCommand('materialTheme.fixIcons', () => ThemeCommands.fixIcons());
|
||||||
Commands.registerCommand('materialTheme.toggleApplyIcons', () => ThemeCommands.toggleApplyIcons());
|
Commands.registerCommand('materialTheme.toggleApplyIcons', () => ThemeCommands.toggleApplyIcons());
|
||||||
Commands.registerCommand('materialTheme.showChangelog', () => ThemeCommands.showChangelog());
|
|
||||||
|
Commands.registerCommand('materialTheme.showReleaseNotes', () => releaseNotesView.show());
|
||||||
}
|
}
|
||||||
|
|
45
package.json
45
package.json
|
@ -20,7 +20,7 @@
|
||||||
"url": "https://github.com/equinusocio/vsc-material-theme/issues"
|
"url": "https://github.com/equinusocio/vsc-material-theme/issues"
|
||||||
},
|
},
|
||||||
"engines": {
|
"engines": {
|
||||||
"vscode": "^1.24.0"
|
"vscode": "^1.25.0"
|
||||||
},
|
},
|
||||||
"standard-version": {
|
"standard-version": {
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
@ -28,17 +28,22 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"build": "rimraf _tmp-output-remote-icons/ && yarn get-remote-icons && yarn build-icons && yarn build-themes && yarn build-icons-accents && yarn build-icons-variants && yarn build-icons-variants-json",
|
"build": "yarn cleanup && yarn get-remote-icons && yarn build-icons && yarn build-themes && yarn build-icons-accents && yarn build-icons-variants && yarn build-icons-variants-json && yarn build-ui",
|
||||||
|
"build-icons": "yarn remove-icons && yarn minimize-icons && gulp build:icons && yarn minimize-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",
|
||||||
"remove-icons-tmp": "rimraf themes/.material-theme-icons.tmp",
|
"remove-icons-tmp": "rimraf themes/.material-theme-icons.tmp",
|
||||||
"get-remote-icons": "yarn gulp build:get-remote-icons",
|
"get-remote-icons": "gulp build:get-remote-icons",
|
||||||
"build-icons": "yarn remove-icons && yarn minimize-icons && yarn gulp build:icons && yarn minimize-json",
|
"cleanup": "rimraf _tmp-output-remote-icons/ && rimraf ui",
|
||||||
"build-icons-accents": "yarn gulp build:icons.accents",
|
"build-icons-accents": "gulp build:icons.accents",
|
||||||
"build-icons-variants": "yarn gulp build:icons.variants",
|
"build-icons-variants": "gulp build:icons.variants",
|
||||||
"build-icons-variants-json": "yarn gulp build:icons.variants-json",
|
"build-icons-variants-json": "gulp build:icons.variants-json",
|
||||||
"build-themes": "yarn gulp build:themes",
|
"build-themes": "gulp build:themes",
|
||||||
|
"build-ui": "yarn copy-ui && yarn build-ui-release-notes",
|
||||||
|
"copy-ui": "gulp build:copy-ui",
|
||||||
|
"build-ui-release-notes": "browserify src/webviews/ui/release-notes/index.js > ui/release-notes.js",
|
||||||
|
"build-ui-only": "yarn cleanup && yarn build-ts && yarn build-ui",
|
||||||
"build-ts": "tsc -p ./tsconfig.json",
|
"build-ts": "tsc -p ./tsconfig.json",
|
||||||
"test": "tslint **.ts",
|
"test": "tslint **.ts",
|
||||||
"release": "standard-version",
|
"release": "standard-version",
|
||||||
|
@ -74,8 +79,8 @@
|
||||||
"category": "🎨 Material Theme"
|
"category": "🎨 Material Theme"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"command": "materialTheme.showChangelog",
|
"command": "materialTheme.showReleaseNotes",
|
||||||
"title": "Show changelog",
|
"title": "Release Notes",
|
||||||
"category": "🎨 Material Theme"
|
"category": "🎨 Material Theme"
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
@ -214,16 +219,18 @@
|
||||||
"@types/gulp": "4.0.5",
|
"@types/gulp": "4.0.5",
|
||||||
"@types/gulp-if": "0.0.33",
|
"@types/gulp-if": "0.0.33",
|
||||||
"@types/gulp-util": "3.0.34",
|
"@types/gulp-util": "3.0.34",
|
||||||
"@types/mustache": "0.8.30",
|
"@types/mustache": "0.8.31",
|
||||||
"@types/ncp": "2.0.1",
|
"@types/ncp": "2.0.1",
|
||||||
"@types/rimraf": "2.0.2",
|
"@types/rimraf": "2.0.2",
|
||||||
"@types/run-sequence": "0.0.30",
|
"@types/run-sequence": "0.0.30",
|
||||||
"@types/through2": "2.0.33",
|
"@types/through2": "2.0.33",
|
||||||
"@types/yamljs": "0.2.30",
|
"@types/yamljs": "0.2.30",
|
||||||
"@types/yargs": "10.0.1",
|
"@types/yargs": "11.0.0",
|
||||||
"babel-core": "6.26.0",
|
"babel-core": "6.26.3",
|
||||||
|
"babel-preset-env": "1.7.0",
|
||||||
"babel-preset-es2015": "6.24.1",
|
"babel-preset-es2015": "6.24.1",
|
||||||
"babel-root-import": "4.1.8",
|
"babel-root-import": "4.1.8",
|
||||||
|
"browserify": "16.2.2",
|
||||||
"cpx": "1.5.0",
|
"cpx": "1.5.0",
|
||||||
"execa": "0.10.0",
|
"execa": "0.10.0",
|
||||||
"gulp": "3.9.1",
|
"gulp": "3.9.1",
|
||||||
|
@ -237,12 +244,12 @@
|
||||||
"mustache": "2.3.0",
|
"mustache": "2.3.0",
|
||||||
"ncp": "2.0.0",
|
"ncp": "2.0.0",
|
||||||
"run-sequence": "2.2.1",
|
"run-sequence": "2.2.1",
|
||||||
"standard-version": "4.3.0",
|
"standard-version": "4.4.0",
|
||||||
"svgo": "1.0.4",
|
"svgo": "1.0.5",
|
||||||
"tslint": "5.9.1",
|
"tslint": "5.10.0",
|
||||||
"tslint-xo": "0.7.2",
|
"tslint-xo": "0.8.0",
|
||||||
"typescript": "2.8.3",
|
"typescript": "2.9.2",
|
||||||
"vscode": "1.1.10",
|
"vscode": "1.1.18",
|
||||||
"yamljs": "0.3.0",
|
"yamljs": "0.3.0",
|
||||||
"yargs": "11.0.0"
|
"yargs": "11.0.0"
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
"fileExtensions": {
|
"fileExtensions": {
|
||||||
|
"cabal": "_file_cabal",
|
||||||
"cfc": "_file_coldfusion",
|
"cfc": "_file_coldfusion",
|
||||||
"cfm": "_file_coldfusion",
|
"cfm": "_file_coldfusion",
|
||||||
"mdx": "_file_mdx",
|
"mdx": "_file_mdx",
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
"file": "_file_dark",
|
"file": "_file_dark",
|
||||||
"folder": "_folder_dark",
|
"folder": "_folder_dark",
|
||||||
"folderExpanded": "_folder_open",
|
"folderExpanded": "_folder_open",
|
||||||
|
"rootFolder": "_folder_root_dark",
|
||||||
|
"rootFolderExpanded": "_folder_root_open",
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
"folderNames": {
|
"folderNames": {
|
||||||
"ci": "_folder_ci",
|
"ci": "_folder_ci",
|
||||||
"test": "_folder_test",
|
"test": "_folder_test",
|
||||||
|
"tests": "_folder_test",
|
||||||
"node_modules": "_folder_node",
|
"node_modules": "_folder_node",
|
||||||
"assets": "_folder_assets",
|
"assets": "_folder_assets",
|
||||||
"bower_components": "_folder_bower",
|
"bower_components": "_folder_bower",
|
||||||
|
@ -23,6 +24,7 @@
|
||||||
"folderNamesExpanded": {
|
"folderNamesExpanded": {
|
||||||
"ci": "_folder_ci_open",
|
"ci": "_folder_ci_open",
|
||||||
"test": "_folder_test_open",
|
"test": "_folder_test_open",
|
||||||
|
"tests": "_folder_test_open",
|
||||||
"node_modules": "_folder_node_open",
|
"node_modules": "_folder_node_open",
|
||||||
"bower_components": "_folder_bower_open",
|
"bower_components": "_folder_bower_open",
|
||||||
"assets": "_folder_assets_open",
|
"assets": "_folder_assets_open",
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
"light": {
|
"light": {
|
||||||
"folderExpanded": "_folder_open",
|
"folderExpanded": "_folder_open",
|
||||||
"folder": "_folder_light",
|
"folder": "_folder_light",
|
||||||
|
"rootFolder": "_folder_root_light",
|
||||||
|
"rootFolderExpanded": "_folder_root_open",
|
||||||
"folderNames": {
|
"folderNames": {
|
||||||
"test": "_folder_test",
|
"test": "_folder_test",
|
||||||
"node_modules": "_folder_node",
|
"node_modules": "_folder_node",
|
||||||
|
|
|
@ -823,14 +823,14 @@
|
||||||
"gitDecoration.untrackedResourceForeground": "{{variant.scheme.base.green}}90",
|
"gitDecoration.untrackedResourceForeground": "{{variant.scheme.base.green}}90",
|
||||||
"gitDecoration.ignoredResourceForeground": "{{variant.scheme.sidebarForeground}}90",
|
"gitDecoration.ignoredResourceForeground": "{{variant.scheme.sidebarForeground}}90",
|
||||||
"peekViewResult.selectionBackground": "{{variant.scheme.sidebarForeground}}70",
|
"peekViewResult.selectionBackground": "{{variant.scheme.sidebarForeground}}70",
|
||||||
"settings.modifiedItemForeground": "{{commons.accents.Teal}}",
|
"breadcrumb.background": "{{variant.scheme.background}}",
|
||||||
"breadcrumb.foreground": "{{variant.scheme.sidebarForeground}}",
|
"breadcrumb.foreground": "{{variant.scheme.sidebarForeground}}",
|
||||||
"breadcrumb.focusForeground": "{{variant.scheme.foreground}}",
|
"breadcrumb.focusForeground": "{{variant.scheme.foreground}}",
|
||||||
"breadcrumb.activeSelectionForeground": "{{commons.accents.Teal}}",
|
"breadcrumb.activeSelectionForeground": "{{commons.accents.Teal}}",
|
||||||
"breadcrumbPicker.background": "{{variant.scheme.backgroundAlt}}",
|
"breadcrumbPicker.background": "{{variant.scheme.backgroundAlt}}",
|
||||||
"menu.background": "{{variant.scheme.background}}",
|
"menu.background": "{{variant.scheme.background}}",
|
||||||
"menu.foreground": "{{variant.scheme.foreground}}",
|
"menu.foreground": "{{variant.scheme.foreground}}",
|
||||||
"menu.selectionBackground": "{{variant.scheme.inactiveSelectionBackground}}",
|
"menu.selectionBackground": "{{variant.scheme.lineHighlight}}50",
|
||||||
"menu.selectionForeground": "{{commons.accents.Teal}}",
|
"menu.selectionForeground": "{{commons.accents.Teal}}",
|
||||||
"menu.selectionBorder": "{{variant.scheme.inactiveSelectionBackground}}",
|
"menu.selectionBorder": "{{variant.scheme.inactiveSelectionBackground}}",
|
||||||
"menubar.selectionBackground": "{{variant.scheme.inactiveSelectionBackground}}",
|
"menubar.selectionBackground": "{{variant.scheme.inactiveSelectionBackground}}",
|
||||||
|
@ -842,6 +842,9 @@
|
||||||
"settings.numberInputBackground": "{{variant.scheme.backgroundAlt}}",
|
"settings.numberInputBackground": "{{variant.scheme.backgroundAlt}}",
|
||||||
"settings.textInputForeground": "{{variant.scheme.foreground}}",
|
"settings.textInputForeground": "{{variant.scheme.foreground}}",
|
||||||
"settings.textInputBackground": "{{variant.scheme.backgroundAlt}}",
|
"settings.textInputBackground": "{{variant.scheme.backgroundAlt}}",
|
||||||
"settings.headerForeground": "{{commons.accents.Teal}}"
|
"settings.headerForeground": "{{commons.scheme.foreground}}",
|
||||||
|
"settings.modifiedItemIndicator": "{{commons.accents.Teal}}",
|
||||||
|
"settings.checkboxBackground": "{{variant.scheme.backgroundAlt}}",
|
||||||
|
"settings.checkboxForeground": "{{variant.scheme.foreground}}"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
33
src/webviews/ReleaseNotes.ts
Normal file
33
src/webviews/ReleaseNotes.ts
Normal file
|
@ -0,0 +1,33 @@
|
||||||
|
import {WebviewController} from './Webview';
|
||||||
|
import {
|
||||||
|
ExtensionContext
|
||||||
|
} from 'vscode';
|
||||||
|
import {ReleaseNotesBootstrap} from './interfaces';
|
||||||
|
|
||||||
|
export class ReleaseNotesWebview extends WebviewController<ReleaseNotesBootstrap> {
|
||||||
|
constructor(context: ExtensionContext) {
|
||||||
|
super(context);
|
||||||
|
}
|
||||||
|
|
||||||
|
get filename(): string {
|
||||||
|
return 'release-notes.html';
|
||||||
|
}
|
||||||
|
|
||||||
|
get id(): string {
|
||||||
|
return 'materialTheme.releaseNotes';
|
||||||
|
}
|
||||||
|
|
||||||
|
get title(): string {
|
||||||
|
return 'Material Theme Release Notes';
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* This will be called by the WebviewController when init the view
|
||||||
|
* passing as `window.bootstrap` to the view.
|
||||||
|
*/
|
||||||
|
getBootstrap() {
|
||||||
|
return {
|
||||||
|
something: 'something'
|
||||||
|
} as ReleaseNotesBootstrap;
|
||||||
|
}
|
||||||
|
}
|
50
src/webviews/Settings.ts
Normal file
50
src/webviews/Settings.ts
Normal file
|
@ -0,0 +1,50 @@
|
||||||
|
import {WebviewController} from './Webview';
|
||||||
|
import {
|
||||||
|
workspace as Workspace,
|
||||||
|
|
||||||
|
ExtensionContext
|
||||||
|
} from 'vscode';
|
||||||
|
import {SettingsBootstrap} from './interfaces';
|
||||||
|
import {getCustomSettings} from '../../extensions/helpers/settings';
|
||||||
|
import {getDefaultValues} from '../../extensions/helpers/fs';
|
||||||
|
|
||||||
|
export class SettingsWebview extends WebviewController<SettingsBootstrap> {
|
||||||
|
constructor(context: ExtensionContext) {
|
||||||
|
super(context);
|
||||||
|
}
|
||||||
|
|
||||||
|
get filename(): string {
|
||||||
|
return 'settings.html';
|
||||||
|
}
|
||||||
|
|
||||||
|
get id(): string {
|
||||||
|
return 'materialTheme.settings';
|
||||||
|
}
|
||||||
|
|
||||||
|
get title(): string {
|
||||||
|
return 'Material Theme Settings';
|
||||||
|
}
|
||||||
|
|
||||||
|
private getAvailableScopes(): ['user' | 'workspace', string][] {
|
||||||
|
const scopes: ['user' | 'workspace', string][] = [['user', 'User']];
|
||||||
|
return scopes
|
||||||
|
.concat(
|
||||||
|
Workspace.workspaceFolders !== undefined && Workspace.workspaceFolders.length ?
|
||||||
|
['workspace', 'Workspace'] :
|
||||||
|
[]
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* This will be called by the WebviewController when init the view
|
||||||
|
* passing as `window.bootstrap` to the view.
|
||||||
|
*/
|
||||||
|
getBootstrap() {
|
||||||
|
return {
|
||||||
|
config: getCustomSettings(),
|
||||||
|
defaults: getDefaultValues(),
|
||||||
|
scope: 'user',
|
||||||
|
scopes: this.getAvailableScopes()
|
||||||
|
} as SettingsBootstrap;
|
||||||
|
}
|
||||||
|
}
|
157
src/webviews/Webview.ts
Normal file
157
src/webviews/Webview.ts
Normal file
|
@ -0,0 +1,157 @@
|
||||||
|
import * as path from 'path';
|
||||||
|
|
||||||
|
import {
|
||||||
|
workspace as Workspace,
|
||||||
|
|
||||||
|
Disposable,
|
||||||
|
ExtensionContext,
|
||||||
|
WebviewPanel,
|
||||||
|
ViewColumn,
|
||||||
|
window,
|
||||||
|
WebviewPanelOnDidChangeViewStateEvent,
|
||||||
|
Uri
|
||||||
|
} from 'vscode';
|
||||||
|
|
||||||
|
import {getCustomSettings} from '../../extensions/helpers/settings';
|
||||||
|
import {Invalidates, Message, SettingsChangedMessage} from './interfaces';
|
||||||
|
|
||||||
|
export abstract class WebviewController<TBootstrap> extends Disposable {
|
||||||
|
private panel: WebviewPanel | undefined;
|
||||||
|
private disposablePanel: Disposable | undefined;
|
||||||
|
private invalidateOnVisible: Invalidates;
|
||||||
|
private context: ExtensionContext;
|
||||||
|
|
||||||
|
constructor(context: ExtensionContext) {
|
||||||
|
// Applying dispose callback for our disposable function
|
||||||
|
super(() => this.dispose());
|
||||||
|
|
||||||
|
this.context = context;
|
||||||
|
}
|
||||||
|
|
||||||
|
abstract get filename(): string;
|
||||||
|
abstract get id(): string;
|
||||||
|
abstract get title(): string;
|
||||||
|
|
||||||
|
abstract getBootstrap(): TBootstrap;
|
||||||
|
|
||||||
|
dispose() {
|
||||||
|
if (this.disposablePanel) {
|
||||||
|
this.disposablePanel.dispose();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private async getHtml(): Promise<string> {
|
||||||
|
const doc = await Workspace
|
||||||
|
.openTextDocument(this.context.asAbsolutePath(path.join('ui', this.filename)));
|
||||||
|
return doc.getText();
|
||||||
|
}
|
||||||
|
|
||||||
|
private postMessage(message: Message, invalidates: Invalidates = 'all') {
|
||||||
|
if (this.panel === undefined) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
const result = this.panel.webview.postMessage(message);
|
||||||
|
|
||||||
|
// If post was ok, update invalidateOnVisible if different than default
|
||||||
|
if (!result && this.invalidateOnVisible !== 'all') {
|
||||||
|
this.invalidateOnVisible = invalidates;
|
||||||
|
}
|
||||||
|
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
private postUpdatedConfiguration() {
|
||||||
|
// Post full raw configuration
|
||||||
|
return this.postMessage({
|
||||||
|
type: 'settingsChanged',
|
||||||
|
config: getCustomSettings()
|
||||||
|
} as SettingsChangedMessage, 'config');
|
||||||
|
}
|
||||||
|
|
||||||
|
private onPanelDisposed() {
|
||||||
|
if (this.disposablePanel) {
|
||||||
|
this.disposablePanel.dispose();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.panel = undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
private onViewStateChanged(event: WebviewPanelOnDidChangeViewStateEvent) {
|
||||||
|
console.log('WebviewEditor.onViewStateChanged', event.webviewPanel.visible);
|
||||||
|
|
||||||
|
if (!this.invalidateOnVisible || !event.webviewPanel.visible) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update the view since it can be outdated
|
||||||
|
const invalidContext = this.invalidateOnVisible;
|
||||||
|
this.invalidateOnVisible = undefined;
|
||||||
|
|
||||||
|
switch (invalidContext) {
|
||||||
|
case 'config':
|
||||||
|
// Post the new configuration to the view
|
||||||
|
return this.postUpdatedConfiguration();
|
||||||
|
default:
|
||||||
|
return this.show();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
protected async onMessageReceived(event: Message) {
|
||||||
|
if (event === null) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log(`WebviewEditor.onMessageReceived: type=${event.type}, data=${JSON.stringify(event)}`);
|
||||||
|
|
||||||
|
switch (event.type) {
|
||||||
|
case 'saveSettings':
|
||||||
|
// TODO: update settings
|
||||||
|
return;
|
||||||
|
|
||||||
|
default:
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async show(): Promise<void> {
|
||||||
|
const html = await this.getHtml();
|
||||||
|
|
||||||
|
const rootPath = Uri
|
||||||
|
.file(this.context.asAbsolutePath('.'))
|
||||||
|
.with({scheme: 'vscode-resource'}).toString();
|
||||||
|
|
||||||
|
// Replace placeholders in html content for assets and adding configurations as `window.bootstrap`
|
||||||
|
const fullHtml = html
|
||||||
|
.replace(/{{root}}/g, rootPath)
|
||||||
|
.replace('\'{{bootstrap}}\'', JSON.stringify(this.getBootstrap()));
|
||||||
|
|
||||||
|
// If panel already opened just reveal
|
||||||
|
if (this.panel !== undefined) {
|
||||||
|
this.panel.webview.html = fullHtml;
|
||||||
|
return this.panel.reveal(ViewColumn.Active);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.panel = window.createWebviewPanel(
|
||||||
|
this.id,
|
||||||
|
this.title,
|
||||||
|
ViewColumn.Active,
|
||||||
|
{
|
||||||
|
retainContextWhenHidden: true,
|
||||||
|
enableFindWidget: true,
|
||||||
|
enableCommandUris: true,
|
||||||
|
enableScripts: true
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
// Applying listeners
|
||||||
|
this.disposablePanel = Disposable.from(
|
||||||
|
this.panel,
|
||||||
|
this.panel.onDidDispose(this.onPanelDisposed, this),
|
||||||
|
this.panel.onDidChangeViewState(this.onViewStateChanged, this),
|
||||||
|
this.panel.webview.onDidReceiveMessage(this.onMessageReceived, this)
|
||||||
|
);
|
||||||
|
|
||||||
|
this.panel.webview.html = fullHtml;
|
||||||
|
}
|
||||||
|
}
|
38
src/webviews/interfaces.ts
Normal file
38
src/webviews/interfaces.ts
Normal file
|
@ -0,0 +1,38 @@
|
||||||
|
import {IThemeCustomSettings} from '../../extensions/interfaces/itheme-custom-properties';
|
||||||
|
import {IDefaults} from '../../extensions/interfaces/idefaults';
|
||||||
|
|
||||||
|
export interface SettingsChangedMessage {
|
||||||
|
type: 'settingsChanged';
|
||||||
|
config: IThemeCustomSettings;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface SaveSettingsMessage {
|
||||||
|
type: 'saveSettings';
|
||||||
|
changes: {
|
||||||
|
[key: string]: any;
|
||||||
|
};
|
||||||
|
removes: string[];
|
||||||
|
scope: 'user' | 'workspace';
|
||||||
|
uri: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export type Message = SaveSettingsMessage | SettingsChangedMessage;
|
||||||
|
export type Invalidates = 'all' | 'config' | undefined;
|
||||||
|
|
||||||
|
export interface Bootstrap {
|
||||||
|
config: IThemeCustomSettings;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface SettingsBootstrap extends Bootstrap {
|
||||||
|
scope: 'user' | 'workspace';
|
||||||
|
scopes: ['user' | 'workspace', string][];
|
||||||
|
defaults: IDefaults;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface ReleaseNotesBootstrap extends Bootstrap {
|
||||||
|
something: 'something';
|
||||||
|
}
|
||||||
|
|
||||||
|
declare global {
|
||||||
|
interface Window { bootstrap: Bootstrap | SettingsBootstrap; }
|
||||||
|
}
|
1
src/webviews/ui/release-notes/index.ts
Normal file
1
src/webviews/ui/release-notes/index.ts
Normal file
|
@ -0,0 +1 @@
|
||||||
|
console.log('ReleaseNotes');
|
39
src/webviews/ui/release-notes/release-notes.html
Normal file
39
src/webviews/ui/release-notes/release-notes.html
Normal file
|
@ -0,0 +1,39 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
<title>Material Theme Release Notes</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="{{root}}/ui/release-notes.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<main class="Container">
|
||||||
|
|
||||||
|
<section class="Release">
|
||||||
|
<header class="Release__Header">
|
||||||
|
<span class="Release__Number">2.3.0</span>
|
||||||
|
<h2 class="Release__Title">August 2018</h2>
|
||||||
|
</header>
|
||||||
|
<ul class="Release-List">
|
||||||
|
<li data-type="breaking">New file icons auto applying and notifications behaviors</li>
|
||||||
|
<li data-type="fixed">Many UI fixes and small improvements</li>
|
||||||
|
<li data-type="fixed">General colors and contrast</li>
|
||||||
|
<li data-type="fixed">Fix color contrast for hovered custom menu items (Win/Lin)</li>
|
||||||
|
<li data-type="new">New file icons</li>
|
||||||
|
<li data-type="new">Support for custom menus (Windows/Linux)</li>
|
||||||
|
<li data-type="new">Support for the editor breadcrumb</li>
|
||||||
|
<li data-type="new">Support for editor new settings view</li>
|
||||||
|
<li data-type="new">Add new Release Notes command</li>
|
||||||
|
<li data-type="new">Add icons to root folders</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
<script type="text/javascript">
|
||||||
|
window.bootstrap = '{{bootstrap}}';
|
||||||
|
</script>
|
||||||
|
<script type="text/javascript" src="{{root}}/ui/release-notes.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
137
src/webviews/ui/release-notes/style.css
Normal file
137
src/webviews/ui/release-notes/style.css
Normal file
|
@ -0,0 +1,137 @@
|
||||||
|
body {
|
||||||
|
font-size: 100%;
|
||||||
|
font-family: sans-serif;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.Container {
|
||||||
|
max-width: 900px;
|
||||||
|
min-width: 500px;
|
||||||
|
width: 100%;
|
||||||
|
display: block;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 32px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.Release {
|
||||||
|
padding: 40px 0;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.Release:first-of-type::before {
|
||||||
|
background-image: linear-gradient(
|
||||||
|
to bottom,
|
||||||
|
rgba(255,255,255,0),
|
||||||
|
rgba(255,255,255,0.1)
|
||||||
|
50px
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
.Release:last-of-type::before,
|
||||||
|
.Release:only-of-type::before {
|
||||||
|
background-image: linear-gradient(
|
||||||
|
to bottom,
|
||||||
|
rgba(255,255,255,0.1),
|
||||||
|
rgba(255,255,255,0)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
.Release::before {
|
||||||
|
content: "";
|
||||||
|
background-image: linear-gradient(to bottom, rgba(255,255,255,0.1), rgba(255,255,255,0.1));
|
||||||
|
width: 3px;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: calc(65px / 2);
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.Release__Header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.Release__Number {
|
||||||
|
background-color: rgba(0, 0, 0, 0.5);
|
||||||
|
color: #FFF;
|
||||||
|
font-weight: 700;
|
||||||
|
text-align: center;
|
||||||
|
padding: 4px;
|
||||||
|
width: 65px;
|
||||||
|
margin-right: 16px;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
line-height: 1.5;
|
||||||
|
border-radius: 4px;
|
||||||
|
cursor: default;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.Release__Title {
|
||||||
|
margin-top: 0;
|
||||||
|
line-height: 1;
|
||||||
|
margin-bottom: 0;
|
||||||
|
font-weight: 400;
|
||||||
|
cursor: default;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.Release-List {
|
||||||
|
list-style: none;
|
||||||
|
padding-left: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Release-List li {
|
||||||
|
line-height: 1.5;
|
||||||
|
display: flex;
|
||||||
|
font-size: 14px;
|
||||||
|
margin: 8px 0;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
cursor: default;
|
||||||
|
white
|
||||||
|
}
|
||||||
|
|
||||||
|
.Release-List li::before {
|
||||||
|
content: attr(data-type);
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 10px;
|
||||||
|
line-height: 1;
|
||||||
|
box-sizing: border-box;
|
||||||
|
width: 64px;
|
||||||
|
height: 16px;
|
||||||
|
border-radius: 3px;
|
||||||
|
margin-right: 8px;
|
||||||
|
padding: 4px 5px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
text-align: center;
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
[data-type="fixed"]::before {
|
||||||
|
background-color: #4242f4;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-type="improved"]::before {
|
||||||
|
background-color: #6f42c1;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-type="new"]::before {
|
||||||
|
background-color: #05a87a;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-type="breaking"]::before {
|
||||||
|
background-color: #ba0935;
|
||||||
|
}
|
20
src/webviews/ui/settings/index.ts
Normal file
20
src/webviews/ui/settings/index.ts
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
import {SettingsBootstrap} from '../../interfaces';
|
||||||
|
import accentsSelector from './lib/accents-selector';
|
||||||
|
|
||||||
|
const run = () => {
|
||||||
|
bind();
|
||||||
|
|
||||||
|
const {config, defaults} = window.bootstrap as SettingsBootstrap;
|
||||||
|
accentsSelector('[data-setting="accentSelector"]', defaults.accents, config.accent);
|
||||||
|
|
||||||
|
console.log(defaults);
|
||||||
|
console.log(config);
|
||||||
|
};
|
||||||
|
|
||||||
|
const bind = () => {
|
||||||
|
document.querySelector('#fixIconsCTA').addEventListener('click', () => {
|
||||||
|
console.log('Test click');
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
run();
|
26
src/webviews/ui/settings/lib/accents-selector.ts
Normal file
26
src/webviews/ui/settings/lib/accents-selector.ts
Normal file
|
@ -0,0 +1,26 @@
|
||||||
|
import {IAccents} from '../../../../../extensions/interfaces/idefaults';
|
||||||
|
|
||||||
|
const templateSingleAccent = (accentName: string, accentColor: string): string => {
|
||||||
|
const dashAccentName = accentName.toLowerCase().replace(/ /gi, '-');
|
||||||
|
|
||||||
|
return `
|
||||||
|
<label for="${dashAccentName}" data-color="${accentColor}">${accentName}</label>
|
||||||
|
<input type="radio" name="accents" id="${dashAccentName}" value="${dashAccentName}" />
|
||||||
|
`;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default (containerSelector: string, accentsObject: IAccents, currentAccent: string) => {
|
||||||
|
const container = document.querySelector(containerSelector);
|
||||||
|
|
||||||
|
for (const accentKey of Object.keys(accentsObject)) {
|
||||||
|
const el = document.createElement('div');
|
||||||
|
el.innerHTML = templateSingleAccent(accentKey, accentsObject[accentKey]);
|
||||||
|
|
||||||
|
if (accentKey === currentAccent) {
|
||||||
|
el.setAttribute('selected', 'true');
|
||||||
|
el.querySelector('input').setAttribute('checked', 'checked');
|
||||||
|
}
|
||||||
|
|
||||||
|
container.appendChild(el);
|
||||||
|
}
|
||||||
|
};
|
|
@ -1,7 +1,8 @@
|
||||||
{
|
{
|
||||||
"compilerOptions": {
|
"compilerOptions": {
|
||||||
"lib": [
|
"lib": [
|
||||||
"es6"
|
"es6",
|
||||||
|
"dom"
|
||||||
],
|
],
|
||||||
"module": "commonjs",
|
"module": "commonjs",
|
||||||
"allowUnreachableCode": false,
|
"allowUnreachableCode": false,
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
"extends": "tslint-xo",
|
"extends": "tslint-xo",
|
||||||
"rules": {
|
"rules": {
|
||||||
"comment-format": false,
|
"comment-format": false,
|
||||||
"indent": [true, "spaces"]
|
"indent": [true, "spaces"],
|
||||||
|
"no-inner-html": false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue