changes to delete from delete keyboard button

tbolis · Mar 29, 2020 · 255b1ab · 255b1ab
1 parent 88eb170
commit 255b1ab
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/examples/main.jsx b/examples/main.jsx
@@ -346,6 +346,7 @@ class SketchFieldDemo extends React.Component {
               ref={c => (this._sketch = c)}
               lineColor={this.state.lineColor}
               lineWidth={this.state.lineWidth}
+              removeItem={this._removeSelected}
               fillColor={
                 this.state.fillWithColor
                   ? this.state.fillColor

diff --git a/src/SketchField.jsx b/src/SketchField.jsx
@@ -591,7 +591,8 @@ class SketchField extends PureComponent {
 
     // Control resize
     window.addEventListener('resize', this._resize, false);
-
+    window.addEventListener('keydown', this.deleteKey, false)
+
     // Initialize History, with maximum number of undo steps
     this._history = new History(undoSteps);
 
@@ -621,7 +622,10 @@ class SketchField extends PureComponent {
 
   };
 
-  componentWillUnmount = () => window.removeEventListener('resize', this._resize);
+  componentWillUnmount = () =>  {
+    window.removeEventListener('resize', this._resize); 
+    window.removeEventListener('keydown', this.deleteKey, false)
+  }
 
   componentDidUpdate = (prevProps, prevState) => {
     if (this.state.parentWidth !== prevState.parentWidth
@@ -648,6 +652,12 @@ class SketchField extends PureComponent {
     }
   };
 
+  deleteKey = (event) => {
+    if(event.code == "Delete" || event.code == "Backspace"){
+      this.props.removeItem()
+    }
+  }
+
   render = () => {
     let {
       className,