Fix: fix for new gradio version

fkunn1326 · Sep 10, 2023 · db07b9c · db07b9c
1 parent 722bca6
commit db07b9c
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 8 deletions.
diff --git a/javascript/main.js b/javascript/main.js
@@ -58,11 +58,13 @@ let flipped = false;
 const default_keypoints = [[241,77],[241,120],[191,118],[177,183],[163,252],[298,118],[317,182],[332,245],[225,241],[213,359],[215,454],[270,240],[282,360],[286,456],[232,59],[253,60],[225,70],[260,72]]
 
 async function fileToDataUrl(file) {
-    if (file.data) {
-        // Gradio version < 3.23
-        return file.data
-    }
-    return await new Promise(r => {let a=new FileReader(); a.onload=r; a.readAsDataURL(file.blob)}).then(e => e.target.result)
+    const elem = gradioApp().querySelector(`#${file}`)
+    const input = elem.previousElementSibling
+    return await new Promise(r => {
+        let a = new FileReader();
+        a.onload = r;
+        a.readAsDataURL(input.files[0])
+    }).then(e => e.target.result)
 }
 
 function calcResolution(width, height){
@@ -398,7 +400,7 @@ function initCanvas(elem){
             json.value = "";
         } catch(e){console.log(e)}
     })
-    json_observer.observe(gradioApp().querySelector("#jsonbox"), { "attributes": true })
+    json_observer.observe(gradioApp().querySelector("#jsonbox"), { attributes: true, subtree: true })
 
     // document.addEventListener('keydown', function(e) {
     //     if (e.key !== undefined) {

diff --git a/scripts/main.py b/scripts/main.py
@@ -125,9 +125,9 @@ def savePreset(name, data):
     width.change(None, [width, height], None, _js="(w, h) => {resizeCanvas(w, h)}")
     height.change(None, [width, height], None, _js="(w, h) => {resizeCanvas(w, h)}")
     png_output.click(None, [], None, _js="savePNG")
-    bg_input.upload(None, [bg_input], [width, height], _js="addBackground")
+    bg_input.upload(None, [], [width, height], _js="() => {addBackground('openpose_bg_button')}")
     png_input.upload(estimate, png_input, jsonbox)
-    png_input.upload(None, png_input, [width, height], _js="addBackground")
+    png_input.upload(None, [], [width, height], _js="() => {addBackground('openpose_detect_button')}")
     add.click(None, [], None, _js="addPose")
     send_t2t.click(None, select_target_index, None, _js="(i) => {sendImage('txt2img', i)}")
     send_i2i.click(None, select_target_index, None, _js="(i) => {sendImage('img2img', i)}")