added touchscreen functionality for resizing

performant-software · May 13, 2024 · a37c727 · a37c727
1 parent 08c4638
commit a37c727
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 5 deletions.
diff --git a/astro-web/.gitignore b/astro-web/.gitignore
@@ -19,3 +19,6 @@ pnpm-debug.log*
 
 # macOS-specific files
 .DS_Store
+
+# github workflows
+.github
diff --git a/editioncrafter/src/component/SplitPaneView.js b/editioncrafter/src/component/SplitPaneView.js
@@ -109,8 +109,8 @@ class SplitPaneView extends Component {
 
   componentDidMount() {
     this.updateUI();
-    window.addEventListener('mousemove', this.onDrag);
-    window.addEventListener('mouseup', this.onEndDrag);
+    window.addEventListener('pointermove', this.onDrag);
+    window.addEventListener('pointerup', this.onEndDrag);
     window.addEventListener('resize', this.onResize);
     console.log(this.props);
     // Set the default width on mount
@@ -129,16 +129,16 @@ class SplitPaneView extends Component {
   }
 
   componentWillUnmount() {
-    window.removeEventListener('mousemove', this.onDrag);
-    window.removeEventListener('mouseup', this.onEndDrag);
+    window.removeEventListener('pointermove', this.onDrag);
+    window.removeEventListener('pointerup', this.onEndDrag);
     window.removeEventListener('resize', this.onResize);
   }
 
   renderDivider(position) {
     const drawerIconClass = 'drawer-icon fas fa-caret-left fa-2x';
 
     return (
-      <div className={`divider ${position}_divider`} onMouseDown={() => this.onStartDrag(position)}>
+      <div className={`divider ${position}_divider`} onPointerDown={() => this.onStartDrag(position)}>
         <div className="drawer-button hidden" onClick={this.onDrawerButton}>
           <i className={drawerIconClass}> </i>
         </div>