Spaces:
Sleeping
Sleeping
Update app.py
Browse files
app.py
CHANGED
|
@@ -0,0 +1,122 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
import gradio as gr
|
| 2 |
+
import random
|
| 3 |
+
|
| 4 |
+
# Global variables
|
| 5 |
+
initial_word_design = ""
|
| 6 |
+
special_words = []
|
| 7 |
+
|
| 8 |
+
def generate_initial_design(word):
|
| 9 |
+
fonts = [
|
| 10 |
+
"'VT323', monospace",
|
| 11 |
+
"'Josefin Sans', sans-serif",
|
| 12 |
+
"'Rajdhani', sans-serif",
|
| 13 |
+
"'Anton', sans-serif",
|
| 14 |
+
"'Caveat', cursive",
|
| 15 |
+
"'Patrick Hand', cursive",
|
| 16 |
+
"'Nothing You Could Do', cursive",
|
| 17 |
+
"'Reenie Beanie', cursive",
|
| 18 |
+
"'Orbitron', sans-serif",
|
| 19 |
+
"'Raleway', sans-serif"
|
| 20 |
+
]
|
| 21 |
+
font_sizes = ["18px", "19px", "20px"]
|
| 22 |
+
font_tops = ["0px", "1px", "-1px"]
|
| 23 |
+
letter_spacings = ["-1px", "0px", "1px"]
|
| 24 |
+
text_shadows = [
|
| 25 |
+
"0px 0px 1px",
|
| 26 |
+
"0px 0px 2px",
|
| 27 |
+
"1px 0px 0px",
|
| 28 |
+
"0px 0px 0px",
|
| 29 |
+
"0px 1px 0px",
|
| 30 |
+
"0px 2px 0px",
|
| 31 |
+
"0px 1px 1px",
|
| 32 |
+
"1px 1px 0px",
|
| 33 |
+
"1px 0px 1px"
|
| 34 |
+
]
|
| 35 |
+
skew_angles = ["-25deg", "-20deg", "-15deg", "-10deg", "0deg", "10deg", "15deg", "20deg", "25deg"]
|
| 36 |
+
|
| 37 |
+
letters = list(word)
|
| 38 |
+
styled_letters = []
|
| 39 |
+
|
| 40 |
+
for letter in letters:
|
| 41 |
+
style = {
|
| 42 |
+
'font-family': random.choice(fonts),
|
| 43 |
+
'line-height': '1.6',
|
| 44 |
+
'font-size': random.choice(font_sizes),
|
| 45 |
+
'letter-spacing': random.choice(letter_spacings),
|
| 46 |
+
'text-shadow': random.choice(text_shadows),
|
| 47 |
+
'transform': f'skew({random.choice(skew_angles)})',
|
| 48 |
+
'margin-top': random.choice(["-0.02cm", "0.00cm", "0.02cm"]),
|
| 49 |
+
'position': 'relative',
|
| 50 |
+
'top': random.choice(font_tops),
|
| 51 |
+
'color': '#000000',
|
| 52 |
+
'display': 'inline-block',
|
| 53 |
+
'margin': '0 1px',
|
| 54 |
+
'vertical-align': 'middle'
|
| 55 |
+
}
|
| 56 |
+
|
| 57 |
+
style_str = '; '.join([f'{k}: {v}' for k, v in style.items()])
|
| 58 |
+
styled_letter = f'<span class="styled-letter" style="{style_str}">{letter}</span>'
|
| 59 |
+
styled_letters.append(styled_letter)
|
| 60 |
+
|
| 61 |
+
return f'''
|
| 62 |
+
<span style="display: inline-flex;
|
| 63 |
+
align-items: baseline;
|
| 64 |
+
vertical-align: middle;
|
| 65 |
+
margin: 0 2px;">
|
| 66 |
+
{" ".join(styled_letters)}
|
| 67 |
+
</span>'''
|
| 68 |
+
|
| 69 |
+
def process_text():
|
| 70 |
+
global initial_word_design, special_words
|
| 71 |
+
|
| 72 |
+
paragraphs = [
|
| 73 |
+
"Proctors's voice quavered, “Where are we, Benshiro? This can't be real. We went full speed into that...”",
|
| 74 |
+
"“Proctor, I hear you! Is that you? I'm so thankful, but where are you? I can't see you.” Benshiro's words echoed in the void."
|
| 75 |
+
]
|
| 76 |
+
|
| 77 |
+
result = []
|
| 78 |
+
|
| 79 |
+
for paragraph in paragraphs:
|
| 80 |
+
words = paragraph.split()
|
| 81 |
+
special_word = random.choice(words)
|
| 82 |
+
styled_word = generate_initial_design(special_word)
|
| 83 |
+
styled_paragraph = ' '.join(word if word != special_word else styled_word for word in words)
|
| 84 |
+
result.append(styled_paragraph)
|
| 85 |
+
|
| 86 |
+
output_html = '<br><br>'.join(result)
|
| 87 |
+
|
| 88 |
+
final_output = f"""
|
| 89 |
+
<html>
|
| 90 |
+
<head>
|
| 91 |
+
<link href="https://fonts.googleapis.com/css?family=VT323|Josefin+Sans|Rajdhani|Anton|Caveat|Patrick+Hand|Nothing+You+Could+Do|Reenie+Beanie|Orbitron|Raleway" rel="stylesheet">
|
| 92 |
+
<style>
|
| 93 |
+
body {{
|
| 94 |
+
background-color: #fff;
|
| 95 |
+
color: #000;
|
| 96 |
+
font-size: 18px;
|
| 97 |
+
line-height: 1.6;
|
| 98 |
+
font-family: "Josefin Sans", sans-serif;
|
| 99 |
+
padding: 20px;
|
| 100 |
+
}}
|
| 101 |
+
</style>
|
| 102 |
+
</head>
|
| 103 |
+
<body>
|
| 104 |
+
<div style='max-width: 800px; margin: auto;'>
|
| 105 |
+
{output_html}
|
| 106 |
+
</div>
|
| 107 |
+
</body>
|
| 108 |
+
</html>
|
| 109 |
+
"""
|
| 110 |
+
|
| 111 |
+
return final_output
|
| 112 |
+
|
| 113 |
+
# Create Gradio interface using Blocks
|
| 114 |
+
with gr.Blocks() as demo:
|
| 115 |
+
gr.Markdown("# Styled Text Display")
|
| 116 |
+
|
| 117 |
+
output_html = gr.HTML()
|
| 118 |
+
|
| 119 |
+
demo.load(fn=process_text, outputs=output_html)
|
| 120 |
+
|
| 121 |
+
# Launch the app
|
| 122 |
+
demo.launch()
|