feat: pen cursor angle change

CHANGELOG.md

@@ -6,9 +6,11 @@ Changelog
 
 ### Added
 
+- A new option (intended for left-handed users) in settings for changing the
+  angle of the pen cursor
 - When closing Wournal, it will now remember the size and maximized state and
-  apply that to any new windows.
-- Remember the last page when reopening a document.
+  apply that to any new windows
+- Remember the last page when reopening a document
 
 ### Fixed
 

src/renderer/app/settings.ts

@@ -68,6 +68,7 @@ export class Settings extends Component {
             zoomUi: rx.bind(conf.partial('zoomUI')),
             defaultZoomDocument: rx.bind(conf.partial('defaultZoomDocument')),
             checkUpdatesOnStartup: rx.bind(conf.partial('checkUpdatesOnStartup')),
+            penCursorLeftAngle: rx.bind(conf.partial('penCursorLeftAngle')),
           }})
         ]),
         ui5.panel({ fields: { headerText: 'Default Tool Settings', collapsed: true }}, [
@@ -217,6 +218,7 @@ class UserInterfaceSettings extends Component {
     zoomUi: rx.prop<number>(),
     defaultZoomDocument: rx.prop<number>(),
     checkUpdatesOnStartup: rx.prop<boolean>(),
+    penCursorLeftAngle: rx.prop<boolean>(),
   }
 
   render() {
@@ -260,7 +262,13 @@ class UserInterfaceSettings extends Component {
           'Note that you can temporarily toggle dark mode using ',
           h.i(globalCmds.toggle_dark_mode_temp.shortcut), '.'
         ]),
-
+        h.div(ui5.checkbox({
+          fields: {
+            checked: rx.bind(this.props.penCursorLeftAngle),
+            wrappingType: 'Normal',
+            text: 'Swap Angle of Pen Cursor (May be Desirable for Lefties)',
+          }
+        })),
       ]),
 
       ui5.title({ fields: { level: 'H5' }}, 'Zoom'),

src/renderer/document/CanvasToolPen.ts

@@ -3,6 +3,7 @@ import { CanvasTool } from "./CanvasTool";
 import { UndoActionCanvasElements } from "./UndoActionCanvasElements";
 import { WournalPage } from "./WournalPage";
 import imgIdleCursor from 'res/icon/custom/pen.png';
+import imgIdleCursorLeftie from 'res/icon/custom/pen-leftie.png';
 
 export class CanvasToolPen extends CanvasTool {
   #conf() {
@@ -20,7 +21,11 @@ export class CanvasToolPen extends CanvasTool {
   /** The svg path for the current line */
   private path: CanvasPath = null;
 
-  public idleCursor = `url('${imgIdleCursor}'), auto`;
+  public get idleCursor() {
+    return this.activePage.value.doc.config.value.penCursorLeftAngle
+      ? `url('${imgIdleCursorLeftie}') 20 0, default`
+      : `url('${imgIdleCursor}'), default`;
+  }
 
   public override canSetStrokeWidth = true;
   public override canSetColor = true;

src/renderer/persistence/ConfigDTO.ts

@@ -120,6 +120,7 @@ const ConfigDTOSchema = {
       'auto', 'auto_high_contrast',
     ] },
     invertDocument: { type: 'boolean' },
+    penCursorLeftAngle: { type: 'boolean' },
     colorPalette: {
       elements: {
         properties: { color: { type: 'string' }, name: { type: 'string' } }
@@ -212,14 +213,23 @@ export const ConfigDTOVersioner = new DTOVersioner<ConfigDTO>({
       };
     },
 
-    // ver 0.7 -- check for updates on startup
+    // ver 0.8 -- check for updates on startup
     // ----------------------------------------------------------------------
     0.8: (ver0_7: any) => {
       return {
         ...ver0_7, version: 0.8,
         checkUpdatesOnStartup: true,
       };
     },
+
+    // ver 0.9 -- customize pen cursor angle
+    // ----------------------------------------------------------------------
+    0.9: (ver0_8: any) => {
+      return {
+        ...ver0_8, version: 0.9,
+        penCursorLeftAngle: false,
+      };
+    },
   }
 })
 
@@ -235,6 +245,7 @@ export function defaultConfig(): ConfigDTO {
     // theme should likely be set to "light" by default.
     theme: "auto",
     invertDocument: true,
+    penCursorLeftAngle: false,
     binds: {
       rightClick: "CanvasToolEraser",
       middleClick: "CanvasToolHand",