Spaces:
Runtime error
Runtime error
File size: 3,051 Bytes
2de3774 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 |
css = """
.loader-container {
display: flex; /* Use flex to align items horizontally */
align-items: center; /* Center items vertically within the container */
white-space: nowrap; /* Prevent line breaks within the container */
overflow-x:hidden;
overflow-y:hidden;
}
/* Style the progress bar */
progress {
appearance: none; /* Remove default styling */
height: 20px; /* Set the height of the progress bar */
border-radius: 5px; /* Round the corners of the progress bar */
background-color: #f3f3f3; /* Light grey background */
width: 100%;
}
/* Style the progress bar container */
.progress-container {
margin-left: 20px;
margin-right: 20px;
flex-grow: 1; /* Allow the progress container to take up remaining space */
}
/* Set the color of the progress bar fill */
progress::-webkit-progress-value {
background-color: #3498db; /* Blue color for the fill */
}
progress::-moz-progress-bar {
background-color: #3498db; /* Blue color for the fill in Firefox */
}
/* Style the text on the progress bar */
progress::after {
content: attr(value '%'); /* Display the progress value followed by '%' */
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white; /* Set text color */
font-size: 14px; /* Set font size */
}
/* Style other texts */
.loader-container > span {
margin-left: 5px; /* Add spacing between the progress bar and the text */
}
.progress-bar > .generating {
display: none !important;
}
.progress-bar{
height: 30px !important;
}
.hint-container > .generating {
display: none !important;
}
.hint-container{
height: 150px !important;
}
.json-container{
height: 600px;
overflow: auto !important;
}
.type_row{
height: 96px !important;
}
.type_small_row{
height: 40px !important;
}
.scroll-hide{
resize: none !important;
}
.refresh_button{
border: none !important;
background: none !important;
font-size: none !important;
box-shadow: none !important;
}
.element1 {
opacity: 0.01;
}
#inpaint_sketch { overflow: overlay !important; resize: auto; background: var(--panel-background-fill); z-index: 5; }
"""
progress_html = """
<div class="loader-container">
<div class="progress-container">
<progress value="*number*" max="100"></progress>
</div>
<span>*text*</span>
</div>
"""
scripts = """
function generate_shortcut(){
document.addEventListener('keydown', (e) => {
let handle = 'none';
if (e.key !== undefined) {
if ((e.key === 'Enter' && e.ctrlKey)) handle = 'run';
} else if (e.keyCode !== undefined) {
if ((e.keyCode === 13 && e.ctrlKey)) handle = 'run';
}
if (handle == 'run') {
const button = document.getElementById('generate');
if (button) button.click();
e.preventDefault();
}
});
}
"""
from shared import state
def make_progress_html(number, text):
if number == -1:
number = state["last_progress"]
else:
state["last_progress"] = number
return progress_html.replace("*number*", str(number)).replace("*text*", text)
|