Merge pull request #6237 from aschlaep/search-shortcut-selector-scoping

Change documentsearch shortcut selector to searchable class
jupyterlab · Apr 27, 2019 · 11d2e8f · 11d2e8f
2 parents e3bfff3 + 1cc82fd
commit 11d2e8f
Show file tree

Hide file tree

Showing 8 changed files with 114 additions and 12 deletions.
diff --git a/examples/notebook/index.css b/examples/notebook/index.css
@@ -20,3 +20,7 @@ body {
 .jp-NotebookPanel {
   border-bottom: 1px solid #e0e0e0;
 }
+
+.notebookCommandPalette {
+  min-width: 225px;
+}
diff --git a/examples/notebook/package.json b/examples/notebook/package.json
@@ -12,6 +12,7 @@
     "@jupyterlab/completer": "^1.0.0-alpha.6",
     "@jupyterlab/docmanager": "^1.0.0-alpha.6",
     "@jupyterlab/docregistry": "^1.0.0-alpha.6",
+    "@jupyterlab/documentsearch": "^1.0.0-alpha.7",
     "@jupyterlab/mathjax2": "^1.0.0-alpha.6",
     "@jupyterlab/notebook": "^1.0.0-alpha.7",
     "@jupyterlab/rendermime": "^1.0.0-alpha.6",

diff --git a/examples/notebook/src/commands.ts b/examples/notebook/src/commands.ts
@@ -4,6 +4,10 @@
 import { CommandRegistry } from '@phosphor/commands';
 import { CompletionHandler } from '@jupyterlab/completer';
 import { NotebookPanel, NotebookActions } from '@jupyterlab/notebook';
+import {
+  SearchInstance,
+  NotebookSearchProvider
+} from '@jupyterlab/documentsearch';
 import { CommandPalette } from '@phosphor/widgets';
 
 /**
@@ -14,6 +18,9 @@ const cmdIds = {
   select: 'completer:select',
   invokeNotebook: 'completer:invoke-notebook',
   selectNotebook: 'completer:select-notebook',
+  startSearch: 'documentsearch:start-search',
+  findNext: 'documentsearch:find-next',
+  findPrevious: 'documentsearch:find-previous',
   save: 'notebook:save',
   interrupt: 'notebook:interrupt-kernel',
   restart: 'notebook:restart-kernel',
@@ -67,6 +74,49 @@ export const SetupCommands = (
     label: 'Save',
     execute: () => nbWidget.context.save()
   });
+
+  let searchInstance: SearchInstance;
+  commands.addCommand(cmdIds.startSearch, {
+    label: 'Find...',
+    execute: () => {
+      if (searchInstance) {
+        searchInstance.focusInput();
+        return;
+      }
+      const provider = new NotebookSearchProvider();
+      searchInstance = new SearchInstance(nbWidget, provider);
+      searchInstance.disposed.connect(() => {
+        searchInstance = undefined;
+        // find next and previous are now not enabled
+        commands.notifyCommandChanged();
+      });
+      // find next and previous are now enabled
+      commands.notifyCommandChanged();
+      searchInstance.focusInput();
+    }
+  });
+  commands.addCommand(cmdIds.findNext, {
+    label: 'Find Next',
+    isEnabled: () => !!searchInstance,
+    execute: async () => {
+      if (!searchInstance) {
+        return;
+      }
+      await searchInstance.provider.highlightNext();
+      searchInstance.updateIndices();
+    }
+  });
+  commands.addCommand(cmdIds.findPrevious, {
+    label: 'Find Previous',
+    isEnabled: () => !!searchInstance,
+    execute: async () => {
+      if (!searchInstance) {
+        return;
+      }
+      await searchInstance.provider.highlightPrevious();
+      searchInstance.updateIndices();
+    }
+  });
   commands.addCommand(cmdIds.interrupt, {
     label: 'Interrupt',
     execute: async () => {
@@ -143,7 +193,10 @@ export const SetupCommands = (
     cmdIds.restart,
     cmdIds.editMode,
     cmdIds.commandMode,
-    cmdIds.switchKernel
+    cmdIds.switchKernel,
+    cmdIds.startSearch,
+    cmdIds.findNext,
+    cmdIds.findPrevious
   ].forEach(command => palette.addItem({ command, category }));
 
   category = 'Notebook Cell Operations';
@@ -180,6 +233,21 @@ export const SetupCommands = (
       keys: ['Accel S'],
       command: cmdIds.save
     },
+    {
+      selector: '.jp-Notebook',
+      keys: ['Accel F'],
+      command: cmdIds.startSearch
+    },
+    {
+      selector: '.jp-Notebook',
+      keys: ['Accel G'],
+      command: cmdIds.findNext
+    },
+    {
+      selector: '.jp-Notebook',
+      keys: ['Accel Shift G'],
+      command: cmdIds.findPrevious
+    },
     {
       selector: '.jp-Notebook.jp-mod-commandMode:focus',
       keys: ['I', 'I'],

diff --git a/examples/notebook/src/index.ts b/examples/notebook/src/index.ts
@@ -101,6 +101,7 @@ function createApp(manager: ServiceManager.IManager): void {
   let notebookPath = PageConfig.getOption('notebookPath');
   let nbWidget = docManager.open(notebookPath) as NotebookPanel;
   let palette = new CommandPalette({ commands });
+  palette.addClass('notebookCommandPalette');
 
   const editor =
     nbWidget.content.activeCell && nbWidget.content.activeCell.editor;

diff --git a/packages/documentsearch-extension/schema/plugin.json b/packages/documentsearch-extension/schema/plugin.json
@@ -5,17 +5,17 @@
     {
       "command": "documentsearch:start",
       "keys": ["Accel F"],
-      "selector": "body"
+      "selector": ".jp-mod-searchable"
     },
     {
       "command": "documentsearch:highlightNext",
       "keys": ["Accel G"],
-      "selector": "body"
+      "selector": ".jp-mod-searchable"
     },
     {
       "command": "documentsearch:highlightPrevious",
       "keys": ["Accel Shift G"],
-      "selector": "body"
+      "selector": ".jp-mod-searchable"
     }
   ],
   "properties": {},

diff --git a/packages/documentsearch-extension/src/index.ts b/packages/documentsearch-extension/src/index.ts
@@ -3,7 +3,8 @@
 
 import {
   JupyterFrontEnd,
-  JupyterFrontEndPlugin
+  JupyterFrontEndPlugin,
+  ILabShell
 } from '@jupyterlab/application';
 
 import { ICommandPalette } from '@jupyterlab/apputils';
@@ -16,14 +17,37 @@ import {
 
 import { IMainMenu } from '@jupyterlab/mainmenu';
 
+const SEARCHABLE_CLASS = 'jp-mod-searchable';
+
+const labShellWidgetListener: JupyterFrontEndPlugin<void> = {
+  id: '@jupyterlab/documentsearch:labShellWidgetListener',
+  requires: [ILabShell, ISearchProviderRegistry],
+  autoStart: true,
+  activate: (
+    app: JupyterFrontEnd,
+    labShell: ILabShell,
+    registry: ISearchProviderRegistry
+  ) => {
+    labShell.activeChanged.connect((_, args) => {
+      const oldWidget = args.oldValue;
+      const newWidget = args.newValue;
+      if (newWidget && registry.getProviderForWidget(newWidget) !== undefined) {
+        newWidget.addClass(SEARCHABLE_CLASS);
+      }
+      if (oldWidget) {
+        oldWidget.removeClass(SEARCHABLE_CLASS);
+      }
+    });
+  }
+};
+
 /**
  * Initialization data for the document-search extension.
  */
 const extension: JupyterFrontEndPlugin<ISearchProviderRegistry> = {
   id: '@jupyterlab/documentsearch:plugin',
   provides: ISearchProviderRegistry,
-  requires: [ICommandPalette],
-  optional: [IMainMenu],
+  optional: [ICommandPalette, IMainMenu],
   autoStart: true,
   activate: (
     app: JupyterFrontEnd,
@@ -126,10 +150,11 @@ const extension: JupyterFrontEndPlugin<ISearchProviderRegistry> = {
     });
 
     // Add the command to the palette.
-    palette.addItem({ command: startCommand, category: 'Main Area' });
-    palette.addItem({ command: nextCommand, category: 'Main Area' });
-    palette.addItem({ command: prevCommand, category: 'Main Area' });
-
+    if (palette) {
+      palette.addItem({ command: startCommand, category: 'Main Area' });
+      palette.addItem({ command: nextCommand, category: 'Main Area' });
+      palette.addItem({ command: prevCommand, category: 'Main Area' });
+    }
     // Add main menu notebook menu.
     if (mainMenu) {
       mainMenu.editMenu.addGroup(
@@ -147,4 +172,4 @@ const extension: JupyterFrontEndPlugin<ISearchProviderRegistry> = {
   }
 };
 
-export default extension;
+export default [extension, labShellWidgetListener];
diff --git a/packages/documentsearch/src/index.ts b/packages/documentsearch/src/index.ts
@@ -6,3 +6,5 @@ import '../style/index.css';
 export * from './interfaces';
 export * from './searchinstance';
 export * from './searchproviderregistry';
+export * from './providers/codemirrorsearchprovider';
+export * from './providers/notebooksearchprovider';
diff --git a/packages/documentsearch/src/searchinstance.ts b/packages/documentsearch/src/searchinstance.ts
@@ -35,6 +35,7 @@ export class SearchInstance implements IDisposable {
       this.dispose();
     });
     this._searchWidget.disposed.connect(() => {
+      this._widget.activate();
       this.dispose();
     });