Add a toggle button to enable to add a draw vector layer.

Add a isDrawVectorLayerEnabled property to the JupyterGISModel.

Author: HaudinFlorence

packages/base/src/commands.ts

@@ -33,7 +33,7 @@ import {
 } from './processing';
 import { fromLonLat } from 'ol/proj';
 import { Coordinate } from 'ol/coordinate';
-import { targetWithCenterIcon } from './icons';
+import { pencilSolidIcon, targetWithCenterIcon } from './icons';
 
 interface ICreateEntry {
   tracker: JupyterGISTracker;
@@ -1027,6 +1027,32 @@ export function addCommands(
     icon: targetWithCenterIcon
   });
 
+  commands.addCommand(CommandIDs.newDrawVectorLayer, {
+    label: trans.__('Create New Draw Vector Layer'),
+    isToggled: () => {
+      if (tracker.currentWidget instanceof JupyterGISDocumentWidget) {
+        const model = tracker.currentWidget?.content.currentViewModel
+          .jGISModel as IJupyterGISModel;
+        return model.isDrawVectorLayerEnabled;
+      } else {
+        return false;
+      }
+    },
+    execute: async () => {
+      if (tracker.currentWidget instanceof JupyterGISDocumentWidget) {
+        const model = tracker.currentWidget?.content.currentViewModel
+          .jGISModel as IJupyterGISModel;
+        if (model.isDrawVectorLayerEnabled === true) {
+          model.isDrawVectorLayerEnabled = false;
+        } else {
+          model.isDrawVectorLayerEnabled = true;
+        }
+        commands.notifyCommandChanged(CommandIDs.newDrawVectorLayer);
+      }
+    },
+    icon: pencilSolidIcon
+  });
+
   loadKeybindings(commands, keybindings);
 }
 

packages/base/src/constants.ts

@@ -48,6 +48,7 @@ export namespace CommandIDs {
   export const newShapefileLayer = 'jupytergis:newShapefileLayer';
   export const newWebGlTileLayer = 'jupytergis:newWebGlTileLayer';
   export const newHeatmapLayer = 'jupytergis:newHeatmapLayer';
+  export const newDrawVectorLayer = 'jupytergis:newDrawVectorLayer';
 
   // Layer and group actions
   export const renameLayer = 'jupytergis:renameLayer';

packages/base/src/icons.ts

@@ -23,6 +23,7 @@ import terminalToolbarSvgStr from '../style/icons/terminal_toolbar.svg';
 import geolocationSvgStr from '../style/icons/geolocation.svg';
 import targetWithoutCenterSvgStr from '../style/icons/target_without_center.svg';
 import targetWithCenterSvgStr from '../style/icons/target_with_center.svg';
+import pencilSolidSvgStr from '../style/icons/pencil_solid.svg';
 
 export const logoIcon = new LabIcon({
   name: 'jupytergis::logo',
@@ -108,3 +109,8 @@ export const targetWithCenterIcon = new LabIcon({
   name: 'jupytergis::targetWithoutCenter',
   svgstr: targetWithoutCenterSvgStr
 });
+
+export const pencilSolidIcon = new LabIcon({
+  name: 'jupytergis::pencilSolid',
+  svgstr: pencilSolidSvgStr
+});

packages/base/src/mainview/mainView.tsx

@@ -106,6 +106,7 @@ interface IStates {
   loadingErrors: Array<{ id: string; error: any; index: number }>;
   displayTemporalController: boolean;
   filterStates: IDict<IJGISFilterItem | undefined>;
+  drawVectorLayerEnabled: boolean;
 }
 
 export class MainView extends React.Component<IProps, IStates> {
@@ -168,7 +169,8 @@ export class MainView extends React.Component<IProps, IStates> {
       scale: 0,
       loadingErrors: [],
       displayTemporalController: false,
-      filterStates: {}
+      filterStates: {},
+      drawVectorLayerEnabled: false
     };
 
     this._sources = [];

packages/base/src/toolbar/widget.tsx

@@ -101,6 +101,16 @@ export class ToolbarWidget extends ReactiveToolbar {
 
       geolocationButton.node.dataset.testid = 'geolocation-button';
 
+      const newDrawVectorLayerButton = new CommandToolbarButton({
+        id: CommandIDs.newDrawVectorLayer,
+        commands: options.commands,
+        label: ''
+      });
+      this.addItem('DrawVectorLayer', newDrawVectorLayerButton);
+
+      newDrawVectorLayerButton.node.dataset.testid =
+        'new-draw-vector-layer-button';
+
       // vector sub menu
       const vectorSubMenu = new Menu({ commands: options.commands });
 

packages/base/style/icons/pencil_solid.svg

@@ -231,6 +231,7 @@ export interface IJupyterGISModel extends DocumentRegistry.IModel {
   triggerLayerUpdate(layerId: string, layer: IJGISLayer): void;
 
   disposed: ISignal<any, void>;
+  isDrawVectorLayerEnabled: boolean;
 }
 
 export interface IUserData {

packages/schema/src/interfaces.ts

@@ -50,6 +50,7 @@ export class JupyterGISModel implements IJupyterGISModel {
       this
     );
     this.annotationModel = annotationModel;
+    this.isDrawVectorLayerEnabled = false;
   }
 
   private _onSharedModelChanged = (sender: any, changes: any): void => {
@@ -757,6 +758,8 @@ export class JupyterGISModel implements IJupyterGISModel {
 
   private _geolocation: JgisCoordinates;
   private _geolocationChanged = new Signal<this, JgisCoordinates>(this);
+
+  public isDrawVectorLayerEnabled: boolean;
 }
 
 export namespace JupyterGISModel {