juancopi81 commited on
Commit
c0ec098
1 Parent(s): 7102a57

Fix share button

Browse files
Files changed (2) hide show
  1. app.py +2 -1
  2. share_btn.py +4 -34
app.py CHANGED
@@ -269,7 +269,8 @@ with block as demo:
269
  label="Enter the URL of the YouTubeVideo",
270
  show_label=False,
271
  max_lines=1,
272
- placeholder="YouTube URL"
 
273
  ).style(
274
  border=(True, False, True, True),
275
  rounded=(True, False, False, True),
 
269
  label="Enter the URL of the YouTubeVideo",
270
  show_label=False,
271
  max_lines=1,
272
+ placeholder="YouTube URL",
273
+ elem_id="prompt-in"
274
  ).style(
275
  border=(True, False, True, True),
276
  rounded=(True, False, False, True),
share_btn.py CHANGED
@@ -29,28 +29,6 @@ share_js = """async () => {
29
  const fileName = `sd-perception-${{videoId}}.mp4`;
30
  return new File([blob], fileName, { type: 'video/mp4' });
31
  }
32
- async function getInputImgFile(imgEl){
33
- const res = await fetch(imgEl.src);
34
- const blob = await res.blob();
35
- const imgId = Date.now() % 200;
36
- const isPng = imgEl.src.startsWith(`data:image/png`);
37
- if(isPng){
38
- const fileName = `sd-perception-${{imgId}}.png`;
39
- return new File([blob], fileName, { type: 'image/png' });
40
- }else{
41
- const fileName = `sd-perception-${{imgId}}.jpg`;
42
- return new File([blob], fileName, { type: 'image/jpeg' });
43
- }
44
- }
45
- async function getOutputMusicFile(audioEL){
46
- const res = await fetch(audioEL.src);
47
- const blob = await res.blob();
48
- const audioId = Date.now() % 200;
49
- const fileName = `spectro-music-${{audioId}}.wav`;
50
- const musicBlob = new File([blob], fileName, { type: 'audio/wav' });
51
- console.log(musicBlob);
52
- return musicBlob;
53
- }
54
 
55
  async function audioToBase64(audioFile) {
56
  return new Promise((resolve, reject) => {
@@ -65,9 +43,6 @@ share_js = """async () => {
65
  // const gradioEl = document.querySelector("gradio-app").shadowRoot;
66
  const inputPromptEl = gradioEl.querySelector('#prompt-in textarea').value;
67
  const outputVideoEl = gradioEl.querySelector('#output-video video');
68
- const outputImgEl = gradioEl.querySelector('#img-out img');
69
- const outputMusic = gradioEl.querySelector('#music-out audio');
70
- const outputMusic_src = gradioEl.querySelector('#music-out audio').src;
71
 
72
  let titleTxt = inputPromptEl;
73
  //if(titleTxt.length > 100){
@@ -84,18 +59,13 @@ share_js = """async () => {
84
  loadingIconEl.style.removeProperty('display');
85
  const outputVideo = await getInputVideoFile(outputVideoEl);
86
  const urlOutputVideo = await uploadFile(outputVideo);
87
- const outputImg = await getInputImgFile(outputImgEl);
88
- const urlOutputImg = await uploadFile(outputImg);
89
- const musicFile = await getOutputMusicFile(outputMusic);
90
- const dataOutputMusic = await uploadFile(musicFile);
91
 
92
  const descriptionMd = `#### Here is my AI generated Video Summary:
93
- <img src='${urlOutputImg}' style='max-height: 350px;'>
 
 
 
94
 
95
- <audio controls>
96
- <source src="${dataOutputMusic}" type="audio/wav">
97
- Your browser does not support the audio element.
98
- </audio>
99
  `;
100
  const params = new URLSearchParams({
101
  title: titleTxt,
 
29
  const fileName = `sd-perception-${{videoId}}.mp4`;
30
  return new File([blob], fileName, { type: 'video/mp4' });
31
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
32
 
33
  async function audioToBase64(audioFile) {
34
  return new Promise((resolve, reject) => {
 
43
  // const gradioEl = document.querySelector("gradio-app").shadowRoot;
44
  const inputPromptEl = gradioEl.querySelector('#prompt-in textarea').value;
45
  const outputVideoEl = gradioEl.querySelector('#output-video video');
 
 
 
46
 
47
  let titleTxt = inputPromptEl;
48
  //if(titleTxt.length > 100){
 
59
  loadingIconEl.style.removeProperty('display');
60
  const outputVideo = await getInputVideoFile(outputVideoEl);
61
  const urlOutputVideo = await uploadFile(outputVideo);
 
 
 
 
62
 
63
  const descriptionMd = `#### Here is my AI generated Video Summary:
64
+ <video width="320" height="240" controls>
65
+ <source src='${urlOutputVideo}' type="video/mp4">
66
+ Your browser does not support the video tag.
67
+ </video>
68
 
 
 
 
 
69
  `;
70
  const params = new URLSearchParams({
71
  title: titleTxt,