add slide type/layer scope commands

js/jupyterlab-deck/src/manager.ts

@@ -1,5 +1,6 @@
 import { IFontManager } from '@deathbeds/jupyterlab-fonts';
 import { LabShell } from '@jupyterlab/application';
+import { ICommandPalette } from '@jupyterlab/apputils';
 import { ISettingRegistry } from '@jupyterlab/settingregistry';
 import { StatusBar } from '@jupyterlab/statusbar';
 import { TranslationBundle } from '@jupyterlab/translation';
@@ -28,6 +29,9 @@ import {
   TLayerScope,
   IDesignManager,
   IToolManager,
+  CATEGORY,
+  SLIDE_TYPES,
+  LAYER_SCOPES,
 } from './tokens';
 import { addDefaultDeckTools } from './tools/deckDefaults';
 import { ToolManager } from './tools/manager';
@@ -44,6 +48,7 @@ export class DeckManager implements IDeckManager {
   protected _presenters: IPresenter<any>[] = [];
   protected _appStarted: Promise<void>;
   protected _commands: CommandRegistry;
+  protected _palette: ICommandPalette | null;
   protected _settings: Promise<ISettingRegistry.ISettings>;
   protected _shell: LabShell;
   protected _statusbar: StatusBar | null;
@@ -56,6 +61,7 @@ export class DeckManager implements IDeckManager {
   constructor(options: DeckManager.IOptions) {
     this._appStarted = options.appStarted;
     this._commands = options.commands;
+    this._palette = options.palette || null;
     this._shell = options.shell;
     this._statusbar = options.statusbar;
     this._trans = options.translator;
@@ -69,6 +75,7 @@ export class DeckManager implements IDeckManager {
     this._shell.layoutModified.connect(this._addDeckStylesLater, this);
     this._addCommands();
     this._addKeyBindings();
+    this._addPaletteItems();
 
     // settings
     this._settings
@@ -373,6 +380,92 @@ export class DeckManager implements IDeckManager {
         execute: () => go(direction as TDirection),
       });
     }
+
+    _commands.addCommand(CommandIds.setSlideType, {
+      label: this._makeCommandLabelCallback('Slideshow Type: %1', 'slideType'),
+      icon: (args: any) => {
+        let slideType: TSlideType = args.slideType || 'null';
+        return ICONS.slideshow[slideType as any] || ICONS.deckStart;
+      },
+      isToggleable: true,
+      isToggled: (args: any) => {
+        const activeSlideType = this.getSlideType();
+        return activeSlideType == null
+          ? args.slideType == null
+          : activeSlideType == args.slideType;
+      },
+      isVisible: (args: any): boolean => {
+        return this.activePresenter?.capabilities.slideType || false;
+      },
+      execute: async (args: any) => {
+        this.setSlideType(args.slideType || null);
+      },
+    });
+
+    _commands.addCommand(CommandIds.setLayerScope, {
+      label: this._makeCommandLabelCallback('Layer Scope Type: %1', 'layerScope'),
+      icon: (args: any) => {
+        let layerScope: TLayerScope = args.layerScope || 'null';
+        return ICONS.slideshow[layerScope as any] || ICONS.deckStart;
+      },
+      isToggleable: true,
+      isToggled: (args: any) => {
+        const activeLayerScope = this.getLayerScope();
+        return activeLayerScope == null
+          ? args.layerScope == null
+          : activeLayerScope == args.layerScope;
+      },
+      isVisible: (args: any): boolean => {
+        return this.activePresenter?.capabilities.layerScope || false;
+      },
+      execute: async (args: any) => {
+        this.setLayerScope(args.layerScope || null);
+      },
+    });
+  }
+
+  protected _makeCommandLabelCallback(text: string, argField: string) {
+    return (args: any) => {
+      return this.__(text, args[argField] || 'null');
+    };
+  }
+
+  protected _addPaletteItems(): void {
+    const { _palette, __ } = this;
+
+    if (_palette) {
+      let category = __(CATEGORY);
+      const isPalette = true;
+
+      let simpleCommands = [
+        CommandIds.start,
+        CommandIds.stop,
+        CommandIds.showLayover,
+        CommandIds.hideLayover,
+      ];
+
+      for (const command of simpleCommands) {
+        _palette.addItem({ command, category });
+      }
+
+      for (const slideType of SLIDE_TYPES) {
+        _palette.addItem({
+          command: CommandIds.setSlideType,
+          category,
+          args: { slideType, isPalette },
+        });
+      }
+
+      for (const layerScope of LAYER_SCOPES) {
+        _palette.addItem({
+          command: CommandIds.setLayerScope,
+          category,
+          args: { layerScope, isPalette },
+        });
+      }
+    } else {
+      console.warn(`${EMOJI} the JupyterLab command palette is not available`);
+    }
   }
 
   protected get _dockpanel(): DockPanel {
@@ -499,6 +592,7 @@ export namespace DeckManager {
     settings: Promise<ISettingRegistry.ISettings>;
     appStarted: Promise<void>;
     fonts: IFontManager;
+    palette?: ICommandPalette | null;
   }
   export interface IExtent {
     onScreen: number[];

js/jupyterlab-deck/src/plugin.ts

@@ -13,7 +13,7 @@ import { ITranslator, nullTranslator } from '@jupyterlab/translation';
 import { DeckManager } from './manager';
 import { simpleMarkdownPlugin } from './markdown/plugin';
 import { notebookPlugin } from './notebook/plugin';
-import { NS, IDeckManager, CommandIds, CATEGORY, PLUGIN_ID } from './tokens';
+import { NS, IDeckManager, PLUGIN_ID } from './tokens';
 
 import '../style/index.css';
 
@@ -40,6 +40,7 @@ const plugin: JupyterFrontEndPlugin<IDeckManager> = {
 
     const manager = new DeckManager({
       commands,
+      palette,
       shell,
       translator: (translator || /* istanbul ignore next */ nullTranslator).load(NS),
       statusbar: theStatusBar,
@@ -48,17 +49,6 @@ const plugin: JupyterFrontEndPlugin<IDeckManager> = {
       appStarted: Promise.all([app.started, restorer.restored]).then(() => void 0),
     });
 
-    const { __ } = manager;
-
-    let category = __(CATEGORY);
-
-    if (palette) {
-      palette.addItem({ command: CommandIds.start, category });
-      palette.addItem({ command: CommandIds.stop, category });
-      palette.addItem({ command: CommandIds.showLayover, category });
-      palette.addItem({ command: CommandIds.hideLayover, category });
-    }
-
     return manager;
   },
 };

js/jupyterlab-deck/src/tokens.ts

@@ -258,6 +258,9 @@ export namespace CommandIds {
   /* layover */
   export const showLayover = 'deck:show-layover';
   export const hideLayover = 'deck:hide-layover';
+  /* deck structure */
+  export const setSlideType = 'deck:set-slide-type';
+  export const setLayerScope = 'deck:set-layer-scope';
 }
 
 export namespace META {