Add all proposed Keyboard shortcuts (#451)

* Add more keybindings

* Make keybindings work in leftpanel, rightpanel & mainview

* Use a standard selector for keybindings

* `Accel Shift Z` for redo

Author: arjxn-py

packages/base/src/3dview/mainview.tsx

@@ -1390,7 +1390,8 @@ export class MainView extends React.Component<IProps, IStates> {
   render(): JSX.Element {
     return (
       <div
-        className="jcad-Mainview"
+        className="jcad-Mainview data-jcad-keybinding"
+        tabIndex={-2}
         style={{
           border: this.state.remoteUser
             ? `solid 3px ${this.state.remoteUser.color}`

packages/base/src/keybindings.json

@@ -2,22 +2,22 @@
   {
     "command": "jupytercad:undo",
     "keys": ["Accel Z"],
-    "selector": "body"
+    "selector": ".data-jcad-keybinding"
   },
   {
     "command": "jupytercad:redo",
-    "keys": ["Accel Y"],
-    "selector": "body"
+    "keys": ["Accel Shift Z"],
+    "selector": ".data-jcad-keybinding"
   },
   {
     "command": "jupytercad:removeObject",
     "keys": ["Delete"],
-    "selector": "body"
+    "selector": ".data-jcad-keybinding"
   },
   {
     "command": "jupytercad:wireframe",
     "keys": ["Accel Space"],
-    "selector": "body"
+    "selector": ".data-jcad-keybinding"
   },
   {
     "command": "jupytercad:executeConsole",
@@ -33,5 +33,90 @@
     "command": "jupytercad:selectConsoleCompleter",
     "keys": ["Enter"],
     "selector": ".jpcad-console .jp-ConsolePanel .jp-mod-completer-active"
+  },
+  {
+    "command": "jupytercad:sketch",
+    "keys": ["Accel Alt N"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:newBox",
+    "keys": ["Accel Alt B"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:newCylinder",
+    "keys": ["Accel Alt C"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:newSphere",
+    "keys": ["Accel Alt S"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:newCone",
+    "keys": ["Accel Alt E"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:newTorus",
+    "keys": ["Accel Alt T"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:cut",
+    "keys": ["Accel Alt X"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:extrusion",
+    "keys": ["Accel Alt E"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:union",
+    "keys": ["Accel Alt U"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:intersection",
+    "keys": ["Accel Alt I"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:chamfer",
+    "keys": ["Accel Alt H"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:fillet",
+    "keys": ["Accel Alt F"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:updateAxes",
+    "keys": ["Alt A"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:updateExplodedView",
+    "keys": ["Alt E"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:updateCameraSettings",
+    "keys": ["Accel Alt K"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:updateClipView",
+    "keys": ["Alt C"],
+    "selector": ".data-jcad-keybinding"
+  },
+  {
+    "command": "jupytercad:exportJcad",
+    "keys": ["Accel Alt X"],
+    "selector": ".data-jcad-keybinding"
   }
 ]

packages/base/src/panelview/leftpanel.tsx

@@ -14,6 +14,8 @@ export class LeftPanelWidget extends SidePanel {
   constructor(options: LeftPanelWidget.IOptions) {
     super();
     this.addClass('jpcad-sidepanel-widget');
+    this.addClass('data-jcad-keybinding');
+    this.node.tabIndex = 0;
     this._model = options.model;
     this._annotationModel = options.annotationModel;
     const header = new ControlPanelHeader();

packages/base/src/panelview/rightpanel.tsx

@@ -13,6 +13,8 @@ export class RightPanelWidget extends SidePanel {
   constructor(options: RightPanelWidget.IOptions) {
     super();
     this.addClass('jpcad-sidepanel-widget');
+    this.addClass('data-jcad-keybinding');
+    this.node.tabIndex = 0;
     this._model = options.model;
     const header = new ControlPanelHeader();
     this.header.addWidget(header);