Skip to content

Commit

Permalink
fixed isToggled param of 'apputils:theme-scrollbars' command
Browse files Browse the repository at this point in the history
`apputils-extension/src/index.ts` was getting crowded, so I also split out
the theme plugins into their own source file
  • Loading branch information
telamonian committed Aug 22, 2019
1 parent 9d1c1a4 commit d195967
Show file tree
Hide file tree
Showing 3 changed files with 264 additions and 237 deletions.
242 changes: 5 additions & 237 deletions packages/apputils-extension/src/index.ts
Expand Up @@ -14,9 +14,7 @@ import {
Dialog,
ICommandPalette,
ISplashScreen,
IThemeManager,
IWindowResolver,
ThemeManager,
WindowResolver,
Printing
} from '@jupyterlab/apputils';
Expand All @@ -32,16 +30,14 @@ import {
URLExt
} from '@jupyterlab/coreutils';

import { IMainMenu } from '@jupyterlab/mainmenu';

import { PromiseDelegate } from '@phosphor/coreutils';

import { DisposableDelegate } from '@phosphor/disposable';

import { Menu } from '@phosphor/widgets';

import { Palette } from './palette';

import { themesPlugin, themesPaletteMenuPlugin } from './themeplugins';

/**
* The interval in milliseconds before recover options appear during splash.
*/
Expand All @@ -51,14 +47,6 @@ const SPLASH_RECOVER_TIMEOUT = 12000;
* The command IDs used by the apputils plugin.
*/
namespace CommandIDs {
export const changeTheme = 'apputils:change-theme';

export const themeScrollbars = 'apputils:theme-scrollbars';

export const incrFontSize = 'apputils:incr-font-size';

export const decrFontSize = 'apputils:decr-font-size';

export const loadState = 'apputils:load-statedb';

export const print = 'apputils:print';
Expand Down Expand Up @@ -109,230 +97,10 @@ const settings: JupyterFrontEndPlugin<ISettingRegistry> = {
provides: ISettingRegistry
};

/**
* The default theme manager provider.
*/
const themes: JupyterFrontEndPlugin<IThemeManager> = {
id: '@jupyterlab/apputils-extension:themes',
requires: [ISettingRegistry, JupyterFrontEnd.IPaths],
optional: [ISplashScreen],
activate: (
app: JupyterFrontEnd,
settings: ISettingRegistry,
paths: JupyterFrontEnd.IPaths,
splash: ISplashScreen | null
): IThemeManager => {
const host = app.shell;
const commands = app.commands;
const url = URLExt.join(paths.urls.base, paths.urls.themes);
const key = themes.id;
const manager = new ThemeManager({ key, host, settings, splash, url });

// Keep a synchronously set reference to the current theme,
// since the asynchronous setting of the theme in `changeTheme`
// can lead to an incorrect toggle on the currently used theme.
let currentTheme: string;

manager.themeChanged.connect((sender, args) => {
// Set data attributes on the application shell for the current theme.
currentTheme = args.newValue;
document.body.dataset.jpThemeLight = String(
manager.isLight(currentTheme)
);
document.body.dataset.jpThemeName = currentTheme;
if (
document.body.dataset.jpThemeScrollbars !==
String(manager.themeScrollbars(currentTheme))
) {
document.body.dataset.jpThemeScrollbars = String(
manager.themeScrollbars(currentTheme)
);
}

// Set any CSS overrides
manager.loadCSSOverrides();

commands.notifyCommandChanged(CommandIDs.changeTheme);
});

commands.addCommand(CommandIDs.changeTheme, {
label: args => {
const theme = args['theme'] as string;
return args['isPalette'] ? `Use ${theme} Theme` : theme;
},
isToggled: args => args['theme'] === currentTheme,
execute: args => {
const theme = args['theme'] as string;
if (theme === manager.theme) {
return;
}
return manager.setTheme(theme);
}
});

commands.addCommand(CommandIDs.themeScrollbars, {
label: 'Theme Scrollbars',
isToggled: () => manager.themeScrollbars(currentTheme),
execute: () => manager.toggleThemeScrollbars()
});

commands.addCommand(CommandIDs.incrFontSize, {
label: args => `Increase ${args['label']} Font Size`,
execute: args => manager.incrFontSize(args['key'] as string)
});

commands.addCommand(CommandIDs.decrFontSize, {
label: args => `Decrease ${args['label']} Font Size`,
execute: args => manager.decrFontSize(args['key'] as string)
});

return manager;
},
autoStart: true,
provides: IThemeManager
};

/**
* The default theme manager's UI command palette and main menu functionality.
*
* #### Notes
* This plugin loads separately from the theme manager plugin in order to
* prevent blocking of the theme manager while it waits for the command palette
* and main menu to become available.
*/
const themesPaletteMenu: JupyterFrontEndPlugin<void> = {
id: '@jupyterlab/apputils-extension:themes-palette-menu',
requires: [IThemeManager],
optional: [ICommandPalette, IMainMenu],
activate: (
app: JupyterFrontEnd,
manager: IThemeManager,
palette: ICommandPalette | null,
mainMenu: IMainMenu | null
): void => {
const commands = app.commands;

// If we have a main menu, add the theme manager to the settings menu.
if (mainMenu) {
const themeMenu = new Menu({ commands });
themeMenu.title.label = 'JupyterLab Theme';
void app.restored.then(() => {
const isPalette = false;

// choose a theme
manager.themes.forEach(theme => {
themeMenu.addItem({
command: CommandIDs.changeTheme,
args: { isPalette, theme }
});
});
themeMenu.addItem({ type: 'separator' });

// toggle scrollbar theming
themeMenu.addItem({ command: CommandIDs.themeScrollbars });
themeMenu.addItem({ type: 'separator' });

// increase/decrease code font size
themeMenu.addItem({
command: CommandIDs.incrFontSize,
args: { label: 'Code', key: 'code-font-size' }
});
themeMenu.addItem({
command: CommandIDs.decrFontSize,
args: { label: 'Code', key: 'code-font-size' }
});
themeMenu.addItem({ type: 'separator' });

// increase/decrease content font size
themeMenu.addItem({
command: CommandIDs.incrFontSize,
args: { label: 'Content', key: 'content-font-size1' }
});
themeMenu.addItem({
command: CommandIDs.decrFontSize,
args: { label: 'Content', key: 'content-font-size1' }
});
themeMenu.addItem({ type: 'separator' });

// increase/decrease ui font size
themeMenu.addItem({
command: CommandIDs.incrFontSize,
args: { label: 'UI', key: 'ui-font-size1' }
});
themeMenu.addItem({
command: CommandIDs.decrFontSize,
args: { label: 'UI', key: 'ui-font-size1' }
});
});
mainMenu.settingsMenu.addGroup(
[
{
type: 'submenu' as Menu.ItemType,
submenu: themeMenu
}
],
0
);
}

// If we have a command palette, add theme switching options to it.
if (palette) {
void app.restored.then(() => {
const category = 'Theme';
const command = CommandIDs.changeTheme;
const isPalette = true;

// choose a theme
manager.themes.forEach(theme => {
palette.addItem({ command, args: { isPalette, theme }, category });
});

// toggle scrollbar theming
palette.addItem({ command: CommandIDs.themeScrollbars, category });

// increase/decrease code font size
palette.addItem({
command: CommandIDs.incrFontSize,
args: { label: 'Code', key: 'code-font-size' },
category
});
palette.addItem({
command: CommandIDs.decrFontSize,
args: { label: 'Code', key: 'code-font-size' },
category
});
// increase/decrease content font size
palette.addItem({
command: CommandIDs.incrFontSize,
args: { label: 'Content', key: 'content-font-size1' },
category
});
palette.addItem({
command: CommandIDs.decrFontSize,
args: { label: 'Content', key: 'content-font-size1' },
category
});
// increase/decrease ui font size
palette.addItem({
command: CommandIDs.incrFontSize,
args: { label: 'UI', key: 'ui-font-size1' },
category
});
palette.addItem({
command: CommandIDs.decrFontSize,
args: { label: 'UI', key: 'ui-font-size1' },
category
});
});
}
},
autoStart: true
};

/**
* The default window name resolver provider.
*/
const resolver: JupyterFrontEndPlugin<IWindowResolver> = {
export const resolver: JupyterFrontEndPlugin<IWindowResolver> = {
id: '@jupyterlab/apputils-extension:resolver',
autoStart: true,
provides: IWindowResolver,
Expand Down Expand Up @@ -689,8 +457,8 @@ const plugins: JupyterFrontEndPlugin<any>[] = [
settings,
state,
splash,
themes,
themesPaletteMenu,
themesPlugin,
themesPaletteMenuPlugin,
print
];
export default plugins;
Expand Down

0 comments on commit d195967

Please sign in to comment.