import gradio as gr
import random
from transformers import pipeline
# Load the model once when the app starts
generator = pipeline('text-generation', model='distilgpt2', max_length=25) # Reduced max_length for faster inference
# Predefined words to check
SPECIAL_WORDS = [
'movie', 'excited', 'waiting', 'long', 'time', 'production', 'real', 'coded', 'digital', 'favorite',
'asking', 'doing', 'basketball', 'soccer', 'football', 'baseball', 'soup', 'food', 'burgers', 'pizza',
'fruit', 'pineapple', 'milk', 'jello', 'candy', 'rice', 'greens', 'lettuce', 'oatmeal', 'cereal',
'dogs', 'cats', 'animals', 'goats', 'sheep', 'movies', 'money', 'bank', 'account', 'keeping',
'looking', 'moving', 'boxes', 'elephants', 'movement', 'coding', 'developing', 'going', 'cruise',
'ship', 'boat', 'bahamas', 'foods', 'healthy', 'eating', 'important', 'pennsylvania', 'atlanta',
'north carolina', 'new york', 'france', 'paris', 'work', 'jobs', 'computers', 'computer', 'grocery',
'glamorous', 'version', 'truck', 'pickup', 'play', 'types', 'games', 'applications', 'quantum',
'speeds', 'advancements', 'technological', 'glimpse', 'countless', 'technology', 'future', 'walking',
'hello', 'jordan', 'season', 'superstar', 'nba', 'championship', 'leading', 'points', 'assist',
'career', 'chicago', 'scared', 'tongue', 'energy', 'disguise', 'business', 'older', 'grown', 'call',
'bills', 'garden', 'house', 'fallen', 'blossoms', 'lawn', 'love', 'forever', 'most', 'fan', 'clout',
'space', 'team', 'today', 'woke', 'work', 'relax', 'quicker', 'thicker', 'richer', 'data', 'ballet',
'dancer', 'goat', 'post', 'lebron', 'james', 'eagles', 'rockets', 'times', 'tank', 'pencil', 'watch',
'rolex', 'rappers', 'rockstar', 'rocket', 'rocks', 'tooth', 'teeth', 'pancake', 'breakfast', 'lunch',
'dinner', 'zoom', 'calling', 'talking', 'rule', 'ruler', 'rick', 'morty', 'martin', 'smith', 'wild',
'track', 'field', 'touchdown', 'basket', 'hope', 'yours', 'thank', 'olympics', 'sports', 'help',
'legal', 'law', 'firm', 'crowd', 'winner', 'winter', 'smoking', 'green', 'purple', 'blue', 'pink',
'orange', 'black', 'white', 'yellow', 'gold', 'weather', 'sun', 'middle', 'summer', 'heat', 'spring'
]
# Global variables
initial_word_design = ""
special_word = ""
def generate_initial_design(word):
"""Generate initial design for the special word in black color."""
fonts = [
"'VT323', monospace",
"'Josefin Sans', sans-serif",
"'Rajdhani', sans-serif",
"'Anton', sans-serif",
"'Caveat', cursive",
"'Patrick Hand', cursive",
"'Nothing You Could Do', cursive",
"'Reenie Beanie', cursive",
"'Orbitron', sans-serif",
"'Raleway', sans-serif",
"'Open Sans Condensed', sans-serif",
"'Poiret One', cursive",
"'Indie Flower', cursive",
"'Pacifico', cursive",
"'Teko', sans-serif"
]
font_sizes = ["18px", "19px", "20px"] # Narrower range
font_tops = ["0px", "1px", "-1px"] # Smaller adjustments
letter_spacings = ["-1px", "0px", "1px"] # Reduced range
text_shadows = [
"0px 0px 1px",
"0px 0px 2px",
"1px 0px 0px",
"0px 0px 0px",
"0px 1px 0px",
"0px 2px 0px",
"0px 1px 1px",
"1px 1px 0px",
"1px 0px 1px"
]
skew_angles = ["-25deg", "-20deg", "-15deg", "-10deg", "0deg", "10deg", "15deg", "20deg", "25deg"]
letters = list(word)
styled_letters = []
for i, letter in enumerate(letters):
style = {
'font-family': random.choice(fonts),
'line-height': '1.6', # Consistent with body text
'font-size': random.choice(font_sizes),
'letter-spacing': random.choice(letter_spacings),
'text-shadow': random.choice(text_shadows),
'transform': f'skew({random.choice(skew_angles)})',
'margin-top': random.choice(["-0.02cm", "0.00cm", "0.02cm"]), # Reduced range
'position': 'relative',
'top': random.choice(font_tops),
'color': '#000000',
'display': 'inline-block',
'margin': '0 1px',
'vertical-align': 'middle'
}
style_str = '; '.join([f'{k}: {v}' for k, v in style.items()])
styled_letter = f'<span class="styled-letter" style="{style_str}">{letter}</span>'
styled_letters.append(styled_letter)
return f'''
<span style="display: inline-flex;
align-items: baseline;
vertical-align: middle;
margin: 0 2px;">
{" ".join(styled_letters)}
</span>'''
def generate_movement_design(word):
"""Generate a completely new random design for the movement animation."""
fonts = [
"'VT323', monospace",
"'Josefin Sans', sans-serif",
"'Rajdhani', sans-serif",
"'Anton', sans-serif",
"'Caveat', cursive",
"'Patrick Hand', cursive",
"'Nothing You Could Do', cursive",
"'Reenie Beanie', cursive",
"'Orbitron', sans-serif",
"'Raleway', sans-serif"
]
font_sizes = ["18px", "19px", "20px"] # Narrower range
font_tops = ["0px", "1px", "-1px"] # Smaller adjustments
letter_spacings = ["-1px", "0px", "1px"] # Reduced range
text_shadows = [
"0px 0px 1px",
"0px 0px 2px",
"1px 0px 0px",
"0px 0px 0px",
"0px 1px 0px",
"0px 2px 0px",
"0px 1px 1px",
"1px 1px 0px",
"1px 0px 1px"
]
skew_angles = ["-25deg", "-20deg", "-15deg", "-10deg", "0deg", "10deg", "15deg", "20deg", "25deg"]
# Generate random color for the movement design
random_color = f'#{random.randint(0, 0xFFFFFF):06x}'
# Generate unique animation name
animation_name = f"animate_{random.randint(0, 10000)}"
# Create keyframes for the animation sequence
keyframes = f"""
@keyframes {animation_name} {{
0% {{ transform: scale(1) rotate(0deg); }}
50% {{ transform: scale(1.2) rotate(10deg); }}
100% {{ transform: scale(1) rotate(0deg); }}
}}
"""
letters = list(word)
styled_letters = []
for i, letter in enumerate(letters):
style = {
'font-family': random.choice(fonts),
'line-height': '1.6', # Consistent with body text
'font-size': random.choice(font_sizes),
'letter-spacing': random.choice(letter_spacings),
'text-shadow': random.choice(text_shadows),
'transform': f'skew({random.choice(skew_angles)})',
'margin-top': random.choice(["-0.02cm", "0.00cm", "0.02cm"]), # Reduced range
'position': 'relative',
'top': random.choice(font_tops),
'color': random_color,
'display': 'inline-block',
'margin': '0 1px',
'vertical-align': 'middle',
'animation': f'{animation_name} 0.5s ease-in-out',
'animation-delay': f'{i * 0.1}s'
}
style_str = '; '.join([f'{k}: {v}' for k, v in style.items()])
styled_letter = f'<span class="styled-letter" style="{style_str}">{letter}</span>'
styled_letters.append(styled_letter)
return f'''
<style>
{keyframes}
.styled-letter {{
transition: all 0.3s ease;
}}
</style>
<span style="display: inline-flex;
align-items: baseline;
vertical-align: middle;
margin: 0 2px;">
{" ".join(styled_letters)}
</span>
'''
def process_text(input_text):
"""Process text and generate the initial output with special word styled in black."""
global initial_word_design, special_word
# Generate text with limited length
generated = generator(input_text, num_return_sequences=1)
generated_text = generated[0]['generated_text']
generated_text = generated_text[:200] # Limit output length
words = generated_text.split()
for i, word in enumerate(words):
clean_word = ''.join(filter(str.isalnum, word)).lower()
if clean_word in SPECIAL_WORDS:
special_word = word
initial_word_design = generate_initial_design(word)
words[i] = initial_word_design
else:
words[i] = word
output_html = ' '.join(words)
final_output = f"""
<html>
<head>
<link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@100&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Rajdhani:wght@300&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Anton&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Caveat&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Patrick+Hand&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Nothing+You+Could+Do&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Reenie+Beanie&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Orbitron&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Raleway:500" rel="stylesheet">
<style>
body {{
background-color: #fff;
color: #000;
font-size: 18px;
line-height: 1.6;
font-family: "Josefin Sans", sans-serif;
padding: 20px;
}}
</style>
</head>
<body>
<div style='max-width: 800px; margin: auto;'>
{output_html}
</div>
<script>
function triggerContinuousMovement() {{
setInterval(() => {{
document.querySelectorAll('.styled-letter').forEach(letter => {{
letter.style.animation = '';
setTimeout(() => {{
letter.style.animation = '{animation_name} 0.5s ease-in-out';
}}, 10);
}});
}}, 1000);
}}
</script>
</body>
</html>
"""
return final_output
def trigger_movement(input_html):
"""Function to trigger the movement animation."""
global initial_word_design, special_word
if not initial_word_design or not special_word:
return input_html
movement_design = generate_movement_design(special_word)
updated_html = input_html.replace(initial_word_design, movement_design, 1)
return updated_html
# Create Gradio interface using Blocks
with gr.Blocks() as demo:
gr.Markdown("# CircularText Styler\nEnter a prompt to generate text with special word styling.")
with gr.Row():
input_text = gr.Textbox(label="Input Prompt")
submit_button = gr.Button("Generate")
output_html = gr.HTML()
animate_button = gr.Button("Trigger Movement")
submit_button.click(process_text, inputs=input_text, outputs=output_html)
animate_button.click(trigger_movement, inputs=output_html, outputs=output_html)
# Launch the app
demo.launch()