当前位置: 首页>>代码示例>>TypeScript>>正文


TypeScript apputils.ThemeManager类代码示例

本文整理汇总了TypeScript中@jupyterlab/apputils.ThemeManager的典型用法代码示例。如果您正苦于以下问题:TypeScript ThemeManager类的具体用法?TypeScript ThemeManager怎么用?TypeScript ThemeManager使用的例子?那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。


在下文中一共展示了ThemeManager类的8个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。

示例1: ThemeManager

  activate: (app: JupyterLab, settingRegistry: ISettingRegistry, splash: ISplashScreen, palette: ICommandPalette | null, mainMenu: IMainMenu | null): IThemeManager => {
    const host = app.shell;
    const when = app.started;
    const commands = app.commands;

    const manager = new ThemeManager({
      key: themes.id,
      host, settingRegistry,
      url: app.info.urls.themes,
      splash,
      when
    });

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

    // 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';
      manager.ready.then(() => {
        const command = CommandIDs.changeTheme;
        const isPalette = false;

        manager.themes.forEach(theme => {
          themeMenu.addItem({ command, args: { isPalette, theme } });
        });
      });
      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) {
      manager.ready.then(() => {
        const category = 'Settings';
        const command = CommandIDs.changeTheme;
        const isPalette = true;

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

    return manager;
  },
开发者ID:7125messi,项目名称:jupyterlab,代码行数:60,代码来源:index.ts

示例2: ThemeManager

  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;

    // Set data attributes on the application shell for the current theme.
    manager.themeChanged.connect((sender, args) => {
      currentTheme = args.newValue;
      app.shell.dataset.themeLight = String(manager.isLight(currentTheme));
      app.shell.dataset.themeName = currentTheme;
      if (
        app.shell.dataset.themeScrollbars !==
        String(manager.themeScrollbars(currentTheme))
      ) {
        app.shell.dataset.themeScrollbars = String(
          manager.themeScrollbars(currentTheme)
        );
      }
      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);
      }
    });

    return manager;
  },
开发者ID:jupyter,项目名称:jupyterlab,代码行数:50,代码来源:index.ts

示例3: ThemeManager

  activate: (
    app: JupyterLab,
    settings: ISettingRegistry,
    splash: ISplashScreen,
    palette: ICommandPalette | null,
    mainMenu: IMainMenu | null
  ): IThemeManager => {
    const host = app.shell;
    const commands = app.commands;
    const url = URLExt.join(app.info.urls.base, app.info.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;

    // Set data attributes on the application shell for the current theme.
    manager.themeChanged.connect((sender, args) => {
      currentTheme = args.newValue;
      app.shell.dataset.themeLight = String(manager.isLight(currentTheme));
      app.shell.dataset.themeName = currentTheme;
      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;
        }
        manager.setTheme(theme);
      }
    });

    // 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';
      app.restored.then(() => {
        const command = CommandIDs.changeTheme;
        const isPalette = false;

        manager.themes.forEach(theme => {
          themeMenu.addItem({ command, args: { isPalette, theme } });
        });
      });
      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) {
      app.restored.then(() => {
        const category = 'Settings';
        const command = CommandIDs.changeTheme;
        const isPalette = true;
        currentTheme = manager.theme;

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

    return manager;
  },
开发者ID:willingc,项目名称:jupyterlab,代码行数:80,代码来源:index.ts

示例4: String

 manager.themeChanged.connect((sender, args) => {
   currentTheme = args.newValue;
   app.shell.dataset.themeLight = String(manager.isLight(currentTheme));
   app.shell.dataset.themeName = currentTheme;
   if (
     app.shell.dataset.themeScrollbars !==
     String(manager.themeScrollbars(currentTheme))
   ) {
     app.shell.dataset.themeScrollbars = String(
       manager.themeScrollbars(currentTheme)
     );
   }
   commands.notifyCommandChanged(CommandIDs.changeTheme);
 });
开发者ID:jupyter,项目名称:jupyterlab,代码行数:14,代码来源:index.ts

示例5:

 execute: args => {
   const theme = args['theme'] as string;
   if (theme === manager.theme) {
     return;
   }
   manager.setTheme(theme);
 }
开发者ID:willingc,项目名称:jupyterlab,代码行数:7,代码来源:index.ts

示例6:

 execute: args => {
   const theme = args['theme'] as string;
   if (theme === manager.theme) {
     return;
   }
   currentTheme = theme;
   manager.setTheme(theme);
   commands.notifyCommandChanged(CommandIDs.changeTheme);
 }
开发者ID:dalejung,项目名称:jupyterlab,代码行数:9,代码来源:index.ts

示例7:

 execute: args => {
   if (args['theme'] === manager.theme) {
     return;
   }
   manager.setTheme(args['theme'] as string).then(() => {
     // The theme manager only loads new CSS onto the page,
     // and anything that has rendered this command's `isToggled`
     // state will not have updated when that happens (such as
     // the application command palette). Force a refresh of those
     // rendered commands.
     commands.notifyCommandChanged(CommandIDs.changeTheme);
   });
 }
开发者ID:cfsmile,项目名称:jupyterlab,代码行数:13,代码来源:index.ts

示例8:

 execute: args => {
   if (args['theme'] === manager.theme) {
     return;
   }
   manager.setTheme(args['theme'] as string);
 }
开发者ID:7125messi,项目名称:jupyterlab,代码行数:6,代码来源:index.ts


注:本文中的@jupyterlab/apputils.ThemeManager类示例由纯净天空整理自Github/MSDocs等开源代码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。