From bb0f7cd1cdffb26595b484369ca6137bd1e8c366 Mon Sep 17 00:00:00 2001
From: cmdr2 <secondary.cmdr2@gmail.com>
Date: Sat, 11 Mar 2023 12:37:51 +0530
Subject: [PATCH] Load mask from file

---
 ui/media/css/image-editor.css |  7 +++++++
 ui/media/js/image-editor.js   | 39 +++++++++++++++++++++++++++++++++++
 2 files changed, 46 insertions(+)

diff --git a/ui/media/css/image-editor.css b/ui/media/css/image-editor.css
index 3b88ee4a..6442aed1 100644
--- a/ui/media/css/image-editor.css
+++ b/ui/media/css/image-editor.css
@@ -214,3 +214,10 @@
 .image-editor-popup h4 {
 	text-align: left;
 }
+
+.image-editor-popup .load_mask {
+	display: none;
+}
+.inpainter .load_mask {
+	display: flex;
+}
\ No newline at end of file
diff --git a/ui/media/js/image-editor.js b/ui/media/js/image-editor.js
index e6792cbf..4597e983 100644
--- a/ui/media/js/image-editor.js
+++ b/ui/media/js/image-editor.js
@@ -117,6 +117,42 @@ const IMAGE_EDITOR_TOOLS = [
 ]
 
 const IMAGE_EDITOR_ACTIONS = [
+	{
+		id: "load_mask",
+		name: "Load mask from file",
+		className: "load_mask",
+		icon: "fa-regular fa-folder-open",
+		handler: (editor) => {
+			let el = document.createElement('input')
+			el.setAttribute("type", "file")
+			el.addEventListener("change", function() {
+				if (this.files.length === 0) {
+					return
+				}
+
+				let reader = new FileReader()
+				let file = this.files[0]
+
+				reader.addEventListener('load', function(event) {
+					let maskData = reader.result
+
+					editor.layers.drawing.ctx.clearRect(0, 0, editor.width, editor.height)
+					var image = new Image()
+					image.onload = () => {
+						editor.layers.drawing.ctx.drawImage(image, 0, 0, editor.width, editor.height)
+					}
+					image.src = maskData
+				})
+
+				if (file) {
+					reader.readAsDataURL(file)
+				}
+			})
+
+			el.click()
+		},
+		trackHistory: true
+	},
 	{
 		id: "fill_all",
 		name: "Fill all",
@@ -457,6 +493,9 @@ class ImageEditor {
 			var element = document.createElement("div")
 			var icon = document.createElement("i")
 			element.className = "image-editor-button button"
+			if (action.className) {
+				element.className += " " + action.className
+			}
 			icon.className = action.icon
 			element.appendChild(icon)
 			element.append(action.name)