Update app.py
Browse files
app.py
CHANGED
|
@@ -458,8 +458,54 @@ load_model="""
|
|
| 458 |
async()=>{
|
| 459 |
var intv = setInterval(function(){
|
| 460 |
if (document.getElementById("output_video").getElementsByTagName("video")) {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 461 |
document.getElementById("model3d").src = document.getElementById("model3d").src.split("?")[0] + "?url=" + document.getElementById("output_video").getElementsByTagName("video")[0].src;
|
| 462 |
document.getElementById("newtab").href = document.getElementById("model3d").src;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 463 |
clearInterval(intv);
|
| 464 |
}
|
| 465 |
}, 40);
|
|
@@ -738,7 +784,7 @@ with gr.Blocks(css=css, js=js, head=head) as demo:
|
|
| 738 |
coords = gr.Textbox(elem_id="coords", value=example_coords, label="Coordinates", interactive=False)
|
| 739 |
render = gr.Button("Render")
|
| 740 |
model3d = gr.HTML(value="""<a id='newtab' href='#' target='_blank'>Open in new tab</a><br/>
|
| 741 |
-
<iframe id='model3d' src='
|
| 742 |
""")
|
| 743 |
input_json.input(show_json, inputs=[input_json], outputs=[processed_video, processed_zip, output_frame, output_mask, output_depth, coords])
|
| 744 |
|
|
|
|
| 458 |
async()=>{
|
| 459 |
var intv = setInterval(function(){
|
| 460 |
if (document.getElementById("output_video").getElementsByTagName("video")) {
|
| 461 |
+
|
| 462 |
+
const html = `
|
| 463 |
+
<!DOCTYPE html>
|
| 464 |
+
<html lang="en">
|
| 465 |
+
<head>
|
| 466 |
+
<meta charset="utf-8" />
|
| 467 |
+
<title>WebGL Demo</title>
|
| 468 |
+
<style>
|
| 469 |
+
canvas {
|
| 470 |
+
width:320px;
|
| 471 |
+
height:240px;
|
| 472 |
+
user-select:none;
|
| 473 |
+
touch-action:none;
|
| 474 |
+
}
|
| 475 |
+
body {
|
| 476 |
+
margin:0;
|
| 477 |
+
padding:0;
|
| 478 |
+
background-color:#808080;
|
| 479 |
+
text-align:center;
|
| 480 |
+
}
|
| 481 |
+
</style>
|
| 482 |
+
<script
|
| 483 |
+
src="https://cdnjs.cloudflare.com/ajax/libs/gl-matrix/2.8.1/gl-matrix-min.js"
|
| 484 |
+
integrity="sha512-zhHQR0/H5SEBL3Wn6yYSaTTZej12z0hVZKOv3TwCUXT1z5qeqGcXJLLrbERYRScEDDpYIJhPC1fk31gqR783iQ=="
|
| 485 |
+
crossorigin="anonymous"
|
| 486 |
+
defer
|
| 487 |
+
></script>
|
| 488 |
+
<script src="https://freeali.se/freealise/transparent_video/webgl-demo.js" type="module"></script>
|
| 489 |
+
</head>
|
| 490 |
+
|
| 491 |
+
<body oncontextmenu="return false;">
|
| 492 |
+
<canvas id="glcanvas" width="1024" height="768"></canvas><br/>
|
| 493 |
+
pan<input type="range" id="pan" min="-0.05" max="0.05" value="0.0" step="0.001"/>
|
| 494 |
+
fov<input type="range" id="fov" min="5" max="90" value="45" step="1"/><br/>
|
| 495 |
+
time<input type="range" id="time" min="0" max="60" value="0" step="1"/>
|
| 496 |
+
<input type='button' id="snapshot" title="Snapshot" value="⬚"/>
|
| 497 |
+
<input type='button' id='record' title='Record' value='●'/>
|
| 498 |
+
</body>
|
| 499 |
+
</html>
|
| 500 |
+
`;
|
| 501 |
+
|
| 502 |
document.getElementById("model3d").src = document.getElementById("model3d").src.split("?")[0] + "?url=" + document.getElementById("output_video").getElementsByTagName("video")[0].src;
|
| 503 |
document.getElementById("newtab").href = document.getElementById("model3d").src;
|
| 504 |
+
|
| 505 |
+
document.getElementById("model3d").contentWindow.document.open();
|
| 506 |
+
document.getElementById("model3d").contentWindow.document.write(html);
|
| 507 |
+
document.getElementById("model3d").contentWindow.document.close();
|
| 508 |
+
|
| 509 |
clearInterval(intv);
|
| 510 |
}
|
| 511 |
}, 40);
|
|
|
|
| 784 |
coords = gr.Textbox(elem_id="coords", value=example_coords, label="Coordinates", interactive=False)
|
| 785 |
render = gr.Button("Render")
|
| 786 |
model3d = gr.HTML(value="""<a id='newtab' href='#' target='_blank'>Open in new tab</a><br/>
|
| 787 |
+
<iframe id='model3d' src='about:blank' width='100%' height='320'></iframe>
|
| 788 |
""")
|
| 789 |
input_json.input(show_json, inputs=[input_json], outputs=[processed_video, processed_zip, output_frame, output_mask, output_depth, coords])
|
| 790 |
|