Spaces:
Running
Running
| 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() |