Enable upload of file onto canvas

index.html

@@ -12,7 +12,7 @@
 
 		<canvas id="drawImage"></canvas>
 		<label> Color: <input type="color" id="drawColor" /></label>
-
+		<input type="file" id="fileInput"/>
 	</body>
 
 </html>

main.js

@@ -31,5 +31,17 @@ window.onload = () => {
 	})
 
 	document.addEventListener('mouseup', () => {drawing = false})
+
+	const fileInput = document.querySelector("#fileInput")
+	fileInput.addEventListener("change", () => {
+		const file = fileInput.files[0]
+		const reader = new FileReader()
+		reader.onload = () => {
+			const img = new Image(drawAreaBounding.width, drawAreaBounding.height)
+			img.onload = () => drawCtx.drawImage(img, 0, 0)
+			img.src = reader.result
+		}
+		setTimeout(() => reader.readAsDataURL(file), 0)
+	})
 }