fffiloni commited on
Commit
a955d0e
1 Parent(s): b43b369

add necessary elements for sharing

Browse files
Files changed (1) hide show
  1. app.py +82 -8
app.py CHANGED
@@ -8,6 +8,7 @@ from moviepy.editor import *
8
  from moviepy.video.io.ffmpeg_tools import ffmpeg_extract_subclip
9
  from gradio_client import Client
10
  import gradio as gr
 
11
 
12
  matte_client = Client("https://fffiloni-video-matting-anything.hf.space/")
13
 
@@ -103,7 +104,7 @@ def infer(video_frames, masks_frames, project_name):
103
  for item in results_folder_content:
104
  print(item)
105
 
106
- return results_folder_content[0], results_folder_content[1]
107
 
108
 
109
  def get_frames(video_in, img_type):
@@ -295,7 +296,7 @@ def infer_auto(project_name, video_in, subject_to_remove):
295
  for item in results_folder_content:
296
  print(item)
297
 
298
- return results_folder_content[0], results_folder_content[1]
299
 
300
  css="""
301
  #col-container{
@@ -303,6 +304,69 @@ css="""
303
  max-width: 840px;
304
  text-align: left;
305
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
306
  """
307
 
308
  with gr.Blocks(css=css) as demo:
@@ -345,7 +409,6 @@ with gr.Blocks(css=css) as demo:
345
  #outputs=[res_masked, res_files]
346
  )
347
 
348
-
349
  with gr.Tab("Auto"):
350
  with gr.Column():
351
  project_name_2 = gr.Textbox(label="Name your project", info="no spaces nor special characters", value="my-new-project")
@@ -375,18 +438,29 @@ with gr.Blocks(css=css) as demo:
375
  fn = infer_auto,
376
  inputs=[project_name_2, video_in, subject_to_remove],
377
  #outputs=[res_masked, res_files]
378
- )
379
 
380
  with gr.Column():
381
  gr.Markdown("""
382
  ### Results
383
  """)
384
- res_masked = gr.Video(label="Masked video")
385
- res_files = gr.Video(label="Final result")
386
 
 
 
 
 
 
 
 
 
 
 
387
 
388
 
389
- submit_btn.click(fn=infer, inputs=[video_frames, masks_frames, project_name], outputs=[res_masked, res_files])
390
- submit_auto_btn.click(fn=infer_auto, inputs=[project_name_2, video_in, subject_to_remove], outputs=[res_masked, res_files])
 
391
 
392
  demo.queue(max_size=12).launch()
 
8
  from moviepy.video.io.ffmpeg_tools import ffmpeg_extract_subclip
9
  from gradio_client import Client
10
  import gradio as gr
11
+ from share_btn import community_icon_html, loading_icon_html, share_js
12
 
13
  matte_client = Client("https://fffiloni-video-matting-anything.hf.space/")
14
 
 
104
  for item in results_folder_content:
105
  print(item)
106
 
107
+ return results_folder_content[0], results_folder_content[1], gr.Group.update(visible=True)
108
 
109
 
110
  def get_frames(video_in, img_type):
 
296
  for item in results_folder_content:
297
  print(item)
298
 
299
+ return results_folder_content[0], results_folder_content[1], gr.Group.update(visible=True)
300
 
301
  css="""
302
  #col-container{
 
304
  max-width: 840px;
305
  text-align: left;
306
  }
307
+ .animate-spin {
308
+ animation: spin 1s linear infinite;
309
+ }
310
+ @keyframes spin {
311
+ from {
312
+ transform: rotate(0deg);
313
+ }
314
+ to {
315
+ transform: rotate(360deg);
316
+ }
317
+ }
318
+ #share-btn-container {
319
+ display: flex;
320
+ padding-left: 0.5rem !important;
321
+ padding-right: 0.5rem !important;
322
+ background-color: #000000;
323
+ justify-content: center;
324
+ align-items: center;
325
+ border-radius: 9999px !important;
326
+ max-width: 15rem;
327
+ height: 32px;
328
+ }
329
+ div#share-btn-container > div {
330
+ flex-direction: row;
331
+ background: black;
332
+ align-items: center;
333
+ }
334
+ #share-btn-container:hover {
335
+ background-color: #060606;
336
+ }
337
+ #share-btn {
338
+ all: initial;
339
+ color: #ffffff;
340
+ font-weight: 600;
341
+ font-size: 1em;
342
+ cursor:pointer;
343
+ font-family: 'IBM Plex Sans', sans-serif;
344
+ margin-left: 0.5rem !important;
345
+ padding-top: 0.5rem !important;
346
+ padding-bottom: 0.5rem !important;
347
+ right:0;
348
+ }
349
+ #share-btn * {
350
+ all: unset;
351
+ }
352
+ #share-btn-container div:nth-child(-n+2){
353
+ width: auto !important;
354
+ min-height: 0px !important;
355
+ }
356
+ #share-btn-container .wrap {
357
+ display: none !important;
358
+ }
359
+ #share-btn-container.hidden {
360
+ display: none!important;
361
+ }
362
+ img[src*='#center'] {
363
+ display: block;
364
+ margin: unset;
365
+ margin-top: 6px;
366
+ }
367
+ div#component-25 {
368
+ align-items: center;
369
+ }
370
  """
371
 
372
  with gr.Blocks(css=css) as demo:
 
409
  #outputs=[res_masked, res_files]
410
  )
411
 
 
412
  with gr.Tab("Auto"):
413
  with gr.Column():
414
  project_name_2 = gr.Textbox(label="Name your project", info="no spaces nor special characters", value="my-new-project")
 
438
  fn = infer_auto,
439
  inputs=[project_name_2, video_in, subject_to_remove],
440
  #outputs=[res_masked, res_files]
441
+ )
442
 
443
  with gr.Column():
444
  gr.Markdown("""
445
  ### Results
446
  """)
447
+ res_masked = gr.Video(label="Masked video", elem_id="res-masked")
448
+ res_files = gr.Video(label="Final result", elem_id="res_cleaned")
449
 
450
+ with gr.Row():
451
+
452
+ with gr.Group(elem_id="share-btn-container", visible=False) as share_group:
453
+ community_icon = gr.HTML(community_icon_html)
454
+ loading_icon = gr.HTML(loading_icon_html)
455
+ share_button = gr.Button("Share with Community", elem_id="share-btn")
456
+
457
+ gr.Markdown("""
458
+ [![Duplicate this Space](https://huggingface.co/datasets/huggingface/badges/raw/main/duplicate-this-space-lg.svg#center)](https://huggingface.co/spaces/fffiloni/ProPainter?duplicate=true)
459
+ """)
460
 
461
 
462
+ submit_btn.click(fn=infer, inputs=[video_frames, masks_frames, project_name], outputs=[res_masked, res_files, share_group])
463
+ submit_auto_btn.click(fn=infer_auto, inputs=[project_name_2, video_in, subject_to_remove], outputs=[res_masked, res_files, share_group])
464
+ share_button.click(None, [], [], _js=share_js)
465
 
466
  demo.queue(max_size=12).launch()