From 875d911aaae6c383361d8cccddd1c5b962f6b3d7 Mon Sep 17 00:00:00 2001
From: Patrick Abi Salloum <patrick.abisalloum@gmail.com>
Date: Mon, 16 Jan 2023 23:43:20 +0200
Subject: [PATCH] Add default when ctrl is clicked while expanding

When the user Clicks the buttons to expand canvas, they get a prompt where they pick the value to expand by.
This makes it so that control click just expands the canvas by the default value without showing the prompt.
---
 js/initalize/layers.populate.js | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/js/initalize/layers.populate.js b/js/initalize/layers.populate.js
index 296d087..1613a15 100644
--- a/js/initalize/layers.populate.js
+++ b/js/initalize/layers.populate.js
@@ -72,7 +72,8 @@ const uiCtx = uiCanvas.getContext("2d", {desynchronized: true});
 	let expandSize = localStorage.getItem("openoutpaint/expand-size") || 1024;
 	expandSize = parseInt(expandSize, 10);
 
-	const askSize = () => {
+	const askSize = (e) => {
+		if (e.ctrlKey ) return expandSize;
 		const by = prompt("How much do you want to expand by?", expandSize);
 
 		if (!by) return null;
@@ -88,9 +89,9 @@ const uiCtx = uiCanvas.getContext("2d", {desynchronized: true});
 	leftButton.classList.add("expand-button", "left");
 	leftButton.style.width = "64px";
 	leftButton.style.height = `${imageCollection.size.h}px`;
-	leftButton.addEventListener("click", () => {
+	leftButton.addEventListener("click", (e) => {
 		let size = null;
-		if ((size = askSize())) {
+		if ((size = askSize(e))) {
 			imageCollection.expand(size, 0, 0, 0);
 			drawBackground();
 			const newLeft = -imageCollection.inputOffset.x - imageCollection.origin.x;
@@ -106,9 +107,9 @@ const uiCtx = uiCanvas.getContext("2d", {desynchronized: true});
 	rightButton.classList.add("expand-button", "right");
 	rightButton.style.width = "64px";
 	rightButton.style.height = `${imageCollection.size.h}px`;
-	rightButton.addEventListener("click", () => {
+	rightButton.addEventListener("click", (e) => {
 		let size = null;
-		if ((size = askSize())) {
+		if ((size = askSize(e))) {
 			imageCollection.expand(0, 0, size, 0);
 			drawBackground();
 			rightButton.style.left =
@@ -122,9 +123,9 @@ const uiCtx = uiCanvas.getContext("2d", {desynchronized: true});
 	topButton.classList.add("expand-button", "top");
 	topButton.style.height = "64px";
 	topButton.style.width = `${imageCollection.size.w}px`;
-	topButton.addEventListener("click", () => {
+	topButton.addEventListener("click", (e) => {
 		let size = null;
-		if ((size = askSize())) {
+		if ((size = askSize(e))) {
 			imageCollection.expand(0, size, 0, 0);
 			drawBackground();
 			const newTop = -imageCollection.inputOffset.y - imageCollection.origin.y;
@@ -140,9 +141,9 @@ const uiCtx = uiCanvas.getContext("2d", {desynchronized: true});
 	bottomButton.classList.add("expand-button", "bottom");
 	bottomButton.style.height = "64px";
 	bottomButton.style.width = `${imageCollection.size.w}px`;
-	bottomButton.addEventListener("click", () => {
+	bottomButton.addEventListener("click", (e) => {
 		let size = null;
-		if ((size = askSize())) {
+		if ((size = askSize(e))) {
 			imageCollection.expand(0, 0, 0, size);
 			drawBackground();
 			bottomButton.style.top =