Fixed a bug where the canvas would get transparent bg upon erase

diff --git a/app/javascript/mastodon/features/ui/components/doodle_modal.js b/app/javascript/mastodon/features/ui/components/doodle_modal.js
index 7f91b848dfe78d32c5788d3c5f369b886acd70a7..d13f9604a5eed91d5cc7174a6d6dd83e79f3d8f7 100644 (file)
--- a/app/javascript/mastodon/features/ui/components/doodle_modal.js
+++ b/app/javascript/mastodon/features/ui/components/doodle_modal.js
@@ -17,10 +17,15 @@ export default class DoodleModal extends ImmutablePureComponent {
 
   handleKeyUp = (e) => {
     if (e.key === 'Delete' || e.key === 'Backspace') {
-      this.sketcher.clear();
+      this.clearScreen();
     }
   }
 
+  clearScreen () {
+    this.sketcher.context.fillStyle = 'white';
+    this.sketcher.context.fillRect(0, 0, this.canvas.width, this.canvas.height);
+  }
+
   componentDidMount () {
     window.addEventListener('keyup', this.handleKeyUp, false);
   }
@@ -36,9 +41,7 @@ export default class DoodleModal extends ImmutablePureComponent {
     if (elem) {
       this.sketcher = new Atrament(elem, 500, 500, 'black');
 
-      // pre-fill with white
-      this.sketcher.context.fillStyle = 'white';
-      this.sketcher.context.fillRect(0, 0, elem.width, elem.height);
+      this.clearScreen();
 
       // .smoothing looks good with mouse but works really poorly with a tablet
       this.sketcher.smoothing = false;