mirror of
https://github.com/gradio-app/gradio.git
synced 2024-12-21 02:19:59 +08:00
9b42ba8f10
* changes * changes * revert changes * changes * add changeset * notebooks script * changes * changes --------- Co-authored-by: Ali Abid <aliabid94@gmail.com> Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com> Co-authored-by: Ali Abdalla <ali.si3luwa@gmail.com>
46 lines
1.3 KiB
Python
46 lines
1.3 KiB
Python
import gradio as gr
|
|
|
|
def welcome(name):
|
|
return f"Welcome to Gradio, {name}!"
|
|
|
|
js = """
|
|
function createGradioAnimation() {
|
|
var container = document.createElement('div');
|
|
container.id = 'gradio-animation';
|
|
container.style.fontSize = '2em';
|
|
container.style.fontWeight = 'bold';
|
|
container.style.textAlign = 'center';
|
|
container.style.marginBottom = '20px';
|
|
|
|
var text = 'Welcome to Gradio!';
|
|
for (var i = 0; i < text.length; i++) {
|
|
(function(i){
|
|
setTimeout(function(){
|
|
var letter = document.createElement('span');
|
|
letter.style.opacity = '0';
|
|
letter.style.transition = 'opacity 0.5s';
|
|
letter.innerText = text[i];
|
|
|
|
container.appendChild(letter);
|
|
|
|
setTimeout(function() {
|
|
letter.style.opacity = '1';
|
|
}, 50);
|
|
}, i * 250);
|
|
})(i);
|
|
}
|
|
|
|
var gradioContainer = document.querySelector('.gradio-container');
|
|
gradioContainer.insertBefore(container, gradioContainer.firstChild);
|
|
|
|
return 'Animation created';
|
|
}
|
|
"""
|
|
with gr.Blocks(js=js) as demo:
|
|
inp = gr.Textbox(placeholder="What is your name?")
|
|
out = gr.Textbox()
|
|
inp.change(welcome, inp, out)
|
|
|
|
if __name__ == "__main__":
|
|
demo.launch()
|