Spaces:
Running
Running
Update app.py
Browse files
app.py
CHANGED
|
@@ -113,87 +113,7 @@ def add_gallery(image, model_str, gallery):
|
|
| 113 |
if image is not None: gallery.insert(0, (image, model_str))
|
| 114 |
return gallery
|
| 115 |
|
| 116 |
-
|
| 117 |
-
<script>
|
| 118 |
-
|
| 119 |
-
/*
|
| 120 |
-
function simulateButtonPress_() {
|
| 121 |
-
const button = document.getElementById('simulate-button');
|
| 122 |
-
if (button) {
|
| 123 |
-
button.click(); // Simulate the button press
|
| 124 |
-
console.log('Button Pressed!');
|
| 125 |
-
}
|
| 126 |
-
}
|
| 127 |
-
*/
|
| 128 |
-
|
| 129 |
-
function simulateButtonPress() {
|
| 130 |
-
console.log('Button Pressed!');
|
| 131 |
-
}
|
| 132 |
-
|
| 133 |
-
// Function to observe image changes
|
| 134 |
-
function observeImageChanges() {
|
| 135 |
-
// Select all images with the 'image-monitor' class
|
| 136 |
-
const images = document.querySelectorAll('.svelte-1pijsyv');
|
| 137 |
-
|
| 138 |
-
// Create a MutationObserver to watch for changes in the image src
|
| 139 |
-
const observer = new MutationObserver((mutationsList, observer) => {
|
| 140 |
-
mutationsList.forEach(mutation => {
|
| 141 |
-
if (mutation.type === 'attributes' && mutation.attributeName === 'src') {
|
| 142 |
-
// If the image src changes, simulate button press
|
| 143 |
-
console.log('Image changed!');
|
| 144 |
-
simulateButtonPress();
|
| 145 |
-
}
|
| 146 |
-
});
|
| 147 |
-
});
|
| 148 |
-
|
| 149 |
-
// Observer options: observe changes to attributes (like src)
|
| 150 |
-
const config = { attributes: true };
|
| 151 |
-
|
| 152 |
-
// Start observing each image
|
| 153 |
-
images.forEach(image => {
|
| 154 |
-
observer.observe(image, config);
|
| 155 |
-
});
|
| 156 |
-
}
|
| 157 |
-
|
| 158 |
-
// Start observing
|
| 159 |
-
|
| 160 |
-
|
| 161 |
-
window.addEventListener('load', () => {
|
| 162 |
-
observeImageChanges();
|
| 163 |
-
console.log("Yo");
|
| 164 |
-
});
|
| 165 |
-
|
| 166 |
-
</script>
|
| 167 |
-
"""
|
| 168 |
-
|
| 169 |
-
CSS="""
|
| 170 |
-
<style>
|
| 171 |
-
.image-monitor {
|
| 172 |
-
border:1px solid red;
|
| 173 |
-
}
|
| 174 |
-
|
| 175 |
-
/*
|
| 176 |
-
.svelte-1pijsyv{
|
| 177 |
-
border:1px solid green;
|
| 178 |
-
}
|
| 179 |
-
*/
|
| 180 |
-
|
| 181 |
-
.gallery-container{
|
| 182 |
-
max-height: 512px;
|
| 183 |
-
}
|
| 184 |
-
|
| 185 |
-
.butt{
|
| 186 |
-
background-color:#2b4764 !important
|
| 187 |
-
}
|
| 188 |
-
.butt:hover{
|
| 189 |
-
background-color:#3a6c9f !important;
|
| 190 |
-
}
|
| 191 |
-
|
| 192 |
-
</style>
|
| 193 |
-
"""
|
| 194 |
-
|
| 195 |
-
# with gr.Blocks(fill_width=True, head=js) as demo:
|
| 196 |
-
with gr.Blocks(head=CSS + JS) as demo:
|
| 197 |
with gr.Tab(str(num_models) + ' Models'):
|
| 198 |
with gr.Column(scale=2):
|
| 199 |
with gr.Group():
|
|
|
|
| 113 |
if image is not None: gallery.insert(0, (image, model_str))
|
| 114 |
return gallery
|
| 115 |
|
| 116 |
+
with gr.Blocks(fill_width=True) as demo:
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 117 |
with gr.Tab(str(num_models) + ' Models'):
|
| 118 |
with gr.Column(scale=2):
|
| 119 |
with gr.Group():
|