extern/easydiffusion
1
0
Fork 1
mirror of https://github.com/easydiffusion/easydiffusion.git synced 2025-06-20 01:48:21 +02:00
Code Issues Packages Projects Releases Wiki Activity

Slightly improve how the inpainting editor canvas looks

Browse Source
This commit is contained in:
cmdr2 2022-09-24 17:31:36 +05:30
parent 86d0feed32
commit 6fc9098035
3 changed files with 13 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
ui/index.html
View File

@ -4,7 +4,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="/media/favicon-16x16.png" sizes="16x16"> <link rel="icon" type="image/png" href="/media/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/media/favicon-32x32.png" sizes="32x32"> <link rel="icon" type="image/png" href="/media/favicon-32x32.png" sizes="32x32">
<link rel="stylesheet" href="/media/main.css?v=2"> <link rel="stylesheet" href="/media/main.css?v=3">
<link rel="stylesheet" href="/media/modifier-thumbnails.css?v=1"> <link rel="stylesheet" href="/media/modifier-thumbnails.css?v=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css">
<link rel="stylesheet" href="/media/drawingboard.min.css"> <link rel="stylesheet" href="/media/drawingboard.min.css">
@ -66,7 +66,7 @@
<button class="init_image_clear image_clear_btn">X</button> <button class="init_image_clear image_clear_btn">X</button>
<br/> <br/>
<input id="enable_mask" name="enable_mask" type="checkbox"> <label for="enable_mask">In-Painting (select the area which the AI will paint into)</label> <input id="enable_mask" name="enable_mask" type="checkbox"> <label for="enable_mask">In-Painting (beta) <small>(select the area which the AI will paint into)</small></label>
<div id="inpaintingEditor"></div> <div id="inpaintingEditor"></div>
</div> </div>
</div> </div>
@ -210,7 +210,7 @@
</div> </div>
</body> </body>
<script src="media/main.js?v=2"></script> <script src="media/main.js?v=3"></script>
<script> <script>
async function init() { async function init() {
await loadModifiers() await loadModifiers()

8
ui/media/main.css
View File

@ -262,6 +262,14 @@ img {
.drawing-board-canvas-wrapper { .drawing-board-canvas-wrapper {
background-size: 100% 100%; background-size: 100% 100%;
} }
.drawing-board-control > button {
background-color: #eee;
border-radius: 3pt;
}
.drawing-board-control-inner {
background-color: #eee;
border-radius: 3pt;
}
#inpaintingEditor canvas { #inpaintingEditor canvas {
opacity: 0.6; opacity: 0.6;
} }

10
ui/media/main.js
View File

@ -95,15 +95,9 @@ let inpaintingEditor = new DrawingBoard.Board('inpaintingEditor', {
controls: [{'DrawingMode': {'filler': false}}, 'Size', 'Navigation'] controls: [{'DrawingMode': {'filler': false}}, 'Size', 'Navigation']
}) })
let inpaintingEditorCanvasBackground = document.querySelector('.drawing-board-canvas-wrapper') let inpaintingEditorCanvasBackground = document.querySelector('.drawing-board-canvas-wrapper')
// let inpaintingEditorControls = document.querySelector('.drawing-board-controls')
// let inpaintingEditorMetaControl = document.createElement('div') document.querySelector('.drawing-board-control-navigation-back').innerHTML = '<i class="fa-solid fa-rotate-left"></i>'
// inpaintingEditorMetaControl.className = 'drawing-board-control' document.querySelector('.drawing-board-control-navigation-forward').innerHTML = '<i class="fa-solid fa-rotate-right"></i>'
// let initImageClearBtnToolbar = document.createElement('button')
// initImageClearBtnToolbar.className = 'init_image_clear'
// initImageClearBtnToolbar.innerHTML = 'Remove Image'
// inpaintingEditorMetaControl.appendChild(initImageClearBtnToolbar)
// inpaintingEditorControls.appendChild(inpaintingEditorMetaControl)
let maskResetButton = document.querySelector('.drawing-board-control-navigation-reset') let maskResetButton = document.querySelector('.drawing-board-control-navigation-reset')
maskResetButton.innerHTML = 'Clear' maskResetButton.innerHTML = 'Clear'