Update app.py
Browse files
app.py
CHANGED
|
@@ -5,6 +5,53 @@ import random
|
|
| 5 |
import os
|
| 6 |
from PIL import Image
|
| 7 |
from deep_translator import GoogleTranslator
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 8 |
html='''<style>
|
| 9 |
body, html, #app {
|
| 10 |
margin: 0;
|
|
|
|
| 5 |
import os
|
| 6 |
from PIL import Image
|
| 7 |
from deep_translator import GoogleTranslator
|
| 8 |
+
|
| 9 |
+
|
| 10 |
+
import gradio as gr
|
| 11 |
+
|
| 12 |
+
def welcome(name):
|
| 13 |
+
return f"Welcome to Gradio, {name}!"
|
| 14 |
+
|
| 15 |
+
js = """
|
| 16 |
+
function createGradioAnimation() {
|
| 17 |
+
var container = document.createElement('div');
|
| 18 |
+
container.id = 'gradio-animation';
|
| 19 |
+
container.style.fontSize = '2em';
|
| 20 |
+
container.style.fontWeight = 'bold';
|
| 21 |
+
container.style.textAlign = 'center';
|
| 22 |
+
container.style.marginBottom = '20px';
|
| 23 |
+
|
| 24 |
+
var text = 'Welcome to Gradio!';
|
| 25 |
+
for (var i = 0; i < text.length; i++) {
|
| 26 |
+
(function(i){
|
| 27 |
+
setTimeout(function(){
|
| 28 |
+
var letter = document.createElement('span');
|
| 29 |
+
letter.style.opacity = '0';
|
| 30 |
+
letter.style.transition = 'opacity 0.5s';
|
| 31 |
+
letter.innerText = text[i];
|
| 32 |
+
|
| 33 |
+
container.appendChild(letter);
|
| 34 |
+
|
| 35 |
+
setTimeout(function() {
|
| 36 |
+
letter.style.opacity = '1';
|
| 37 |
+
}, 50);
|
| 38 |
+
}, i * 250);
|
| 39 |
+
})(i);
|
| 40 |
+
}
|
| 41 |
+
|
| 42 |
+
var gradioContainer = document.querySelector('.gradio-container');
|
| 43 |
+
gradioContainer.insertBefore(container, gradioContainer.firstChild);
|
| 44 |
+
|
| 45 |
+
return 'Animation created';
|
| 46 |
+
}
|
| 47 |
+
"""
|
| 48 |
+
with gr.Blocks(js=js) as demo:
|
| 49 |
+
inp = gr.Textbox(placeholder="What is your name?")
|
| 50 |
+
out = gr.Textbox()
|
| 51 |
+
inp.change(welcome, inp, out)
|
| 52 |
+
|
| 53 |
+
demo.launch()
|
| 54 |
+
|
| 55 |
html='''<style>
|
| 56 |
body, html, #app {
|
| 57 |
margin: 0;
|