diff --git a/README.md b/README.md index 7780a82..4547f26 100644 --- a/README.md +++ b/README.md @@ -64,10 +64,15 @@ for advance/professional users who want to use the smart masking mode, we have a # Demo: [![Click Here to Watch Demo](https://i3.ytimg.com/vi/VL_gbQai79E/maxresdefault.jpg)](https://youtu.be/VL_gbQai79E "Stable diffusion AI Photoshop Plugin Free and Open Source") # How to install Video Tutorial: -we recommend you use [the one click installer](#one-click-installer) watch the video to know how to install Automatic1111 Stable Diffusion -[![Click Here to Watch How To Install Tutorial](https://user-images.githubusercontent.com/7842232/215471551-2d39c6c2-a765-4eca-bc54-7b386aa25662.png)](https://youtu.be/BNzdhEpFHrg "How To Install Auto Photoshop Stable Diffusion Plugin") +we recommend you use [the one click installer](#one-click-installer). However watch the video on left if you don't have Automatic1111 Stable Diffusion installed, and the video on the right by Vladimir Chopine for clear instruction on how to install the plugin using UXP. + + + + # Instructional Tutorial (outpaint, inpaint, img2img and txt2img): +we recommend you check the [tutorials](https://github.com/AbdullahAlfaraj/Auto-Photoshop-StableDiffusion-Plugin/wiki) section to master the tool. + [![Click Here to Watch Tutorial](http://i3.ytimg.com/vi/evjSIfYIQq0/hqdefault.jpg)](https://www.youtube.com/watch?v=evjSIfYIQq0&ab_channel=Abdsart "Tutorial - Auto Photoshop Stable Diffusion Plugin") # How to install: @@ -77,7 +82,8 @@ we recommend you use [the one click installer](#one-click-installer) ``` git clone https://github.com/AbdullahAlfaraj/Auto-Photoshop-StableDiffusion-Plugin.git ``` -2) run "start_server.bat" inside "Auto-Photoshop-StableDiffusion-Plugin" directory +2) run "start_se![Uploading How to Install Tutorial 1.png…]() +rver.bat" inside "Auto-Photoshop-StableDiffusion-Plugin" directory 3) go to where you have [automatic1111](https://github.com/AUTOMATIC1111/stable-diffusion-webui) installed. Edit the "webui-user.bat" in automatic1111 change this line diff --git a/helper.js b/helper.js index ac95dd8..58993d8 100644 --- a/helper.js +++ b/helper.js @@ -107,4 +107,14 @@ async function unSelect() { return result } +/** + * Convert 1d index to 2d array + * @param {number} index sequential index + * @param {number} width width of 2d array + * @returns {number[]} [x,y] + */ +function indexToXY(index, width) { + return [index % width, Math.floor(index / width)] +} + module.exports = {} diff --git a/icon/accept_all.svg b/icon/accept_all.svg new file mode 100644 index 0000000..b8f9be7 --- /dev/null +++ b/icon/accept_all.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icon/accept_selected.svg b/icon/accept_selected.svg new file mode 100644 index 0000000..30342c6 --- /dev/null +++ b/icon/accept_selected.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icon/camera_icon.svg b/icon/camera_icon.svg new file mode 100644 index 0000000..ad13b59 --- /dev/null +++ b/icon/camera_icon.svg @@ -0,0 +1,14 @@ + + + + + + + + diff --git a/icon/discard_all.svg b/icon/discard_all.svg new file mode 100644 index 0000000..e290f41 --- /dev/null +++ b/icon/discard_all.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icon/discard_selected.svg b/icon/discard_selected.svg new file mode 100644 index 0000000..8ffdc69 --- /dev/null +++ b/icon/discard_selected.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icon/reset_settings2.png b/icon/reset_settings2.png new file mode 100644 index 0000000..da2a6dc Binary files /dev/null and b/icon/reset_settings2.png differ diff --git a/index.html b/index.html index 4d36725..63cc373 100644 --- a/index.html +++ b/index.html @@ -137,14 +137,18 @@ background-color: #777; color: white; cursor: pointer; - border: none; - text-align: left; outline: none; font-size: 15px; margin: 0; } + #btnRefreshModels:hover { + background-color: #333; + } + .btnSquare:hover { + background-color: #333; + } #btnUpdate { background-color: #3555ac; color: white; @@ -418,8 +422,8 @@ .acceptAllImgBtn { font-family: Arial, Verdana; - background-image: url(./icon/accept_all.png); - background-color: transparent; + background-image: url(./icon/accept_all.svg); + background-color: #777; background-size: 30px; width: 30px; height: 30px; @@ -428,8 +432,8 @@ .acceptSelectedImgBtn { font-family: Arial, Verdana; - background-image: url(./icon/accept_selected.png); - background-color: transparent; + background-image: url(./icon/accept_selected.svg); + background-color: #777; background-size: 30px; width: 30px; height: 30px; @@ -438,8 +442,8 @@ .discardAllImgBtn { font-family: Arial, Verdana; - background-image: url(./icon/discard_all_border.png); - background-color: transparent; + background-image: url(./icon/discard_all.svg); + background-color: #777; background-size: 30px; width: 30px; height: 30px; @@ -448,9 +452,9 @@ .discardSelectedImgBtn { font-family: Arial, Verdana; - background-image: url(./icon/discard_selected_border.png); - background-color: transparent; - background-size: 24px; + background-image: url(./icon/discard_selected.svg); + background-color: #777; + background-size: 30px; width: 30px; height: 30px; background-repeat: no-repeat; @@ -458,8 +462,8 @@ .resetButton { font-family: Arial, Verdana; - background-image: url(./icon/reset_settings.png); - background-color: transparent; + background-image: url(./icon/reset_settings2.png); + background-color: #777; background-size: 30px; width: 30px; height: 30px; @@ -468,8 +472,8 @@ .snapshotButton { font-family: Arial, Verdana; - background-image: url(./icon/camera_icon.png); - background-color: transparent; + background-image: url(./icon/camera_icon.svg); + background-color: #777; background-size: 30px; width: 30px; height: 30px; @@ -526,27 +530,16 @@
- - - + + + - - -
+ > Interrupt + +
@@ -840,6 +833,7 @@ + > + >