Let unfinished doodles persist when not actively doodling (#10)

canvas sizing is still kind of an issue, we should look into that

Author: fuzzything44

src/annotator/guest.js

@@ -775,6 +775,7 @@ export default class Guest extends Delegator {
         $doodle: true,
         doodleLines: this.doodleCanvasController.lines,
       });
+      this.doodleCanvasController.lines = [];
     }
   }
 }

src/doodle/doodleCanvas.js

@@ -1,5 +1,5 @@
 import { createElement } from 'preact';
-import { useState } from 'preact/hooks';
+import { useState, useEffect } from 'preact/hooks';
 import { Canvas } from './canvas';
 import propTypes from 'prop-types';
 
@@ -31,6 +31,28 @@ const DoodleCanvas = ({
   setLines,
 }) => {
   const [isDrawing, setIsDrawing] = useState(false);
+  const [everActive, setEverActive] = useState(false);
+
+  if (active && !everActive) {
+    setEverActive(true);
+  }
+
+  useEffect(() => {
+    if (lines.length === 0) {
+      return () => {};
+    }
+    const warn = e => {
+      e = e || window.event;
+
+      e.preventDefault();
+      e.returnValue = '';
+      return '';
+    };
+    window.addEventListener('beforeunload', warn);
+    return () => {
+      window.removeEventListener('beforeunload', warn);
+    };
+  }, [lines]);
 
   const handleMouseDown = e => {
     setIsDrawing(true);
@@ -74,7 +96,7 @@ const DoodleCanvas = ({
     setLines([newLine, ...rest]);
   };
 
-  if (!active) {
+  if (!everActive) {
     return null;
   }