File size: 6,535 Bytes
3519dec
 
 
 
 
21e44c2
3519dec
 
 
 
21e44c2
23585ff
3519dec
23585ff
 
3519dec
 
 
 
3397572
3519dec
 
 
3397572
3519dec
23585ff
3519dec
 
 
 
 
 
 
 
6703e90
23585ff
3519dec
 
 
 
 
 
 
 
 
21e44c2
 
78b6f06
 
 
6703e90
 
04a6d22
21e44c2
 
 
 
5843ed7
21e44c2
 
 
 
 
 
 
 
3519dec
 
0f68170
3519dec
 
6703e90
3519dec
6703e90
 
 
 
 
 
 
 
 
 
 
0f68170
6703e90
 
 
 
23585ff
3519dec
 
21e44c2
3519dec
 
 
0f68170
 
5a48237
 
 
 
 
 
 
0f68170
5a48237
 
3519dec
 
 
 
21e44c2
3519dec
 
0f68170
6703e90
 
 
 
 
21e44c2
5843ed7
78b6f06
 
 
 
 
 
 
5843ed7
 
78b6f06
 
 
 
 
21e44c2
6703e90
 
 
 
 
 
 
 
 
 
 
 
3519dec
6703e90
 
 
 
 
 
 
 
 
 
 
 
 
21e44c2
6703e90
 
 
 
 
 
 
 
 
 
 
3519dec
21e44c2
78b6f06
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
import gradio as gr
import requests
from PIL import Image
from io import BytesIO
from tqdm import tqdm
import os
import time

repo = "artificialguybr/TshirtDesignRedmond-V2"

# Generate design based on prompts
def infer(color_prompt, phone_type_prompt, design_prompt):
    prompt = (
        f"A single vertical {color_prompt} colored {phone_type_prompt} back cover featuring a bold {design_prompt} design on the front, hanging on the plain wall. The soft light and shadows, creating a striking contrast against the minimal background, evoking modern sophistication."
    )
    full_prompt = f"{prompt}"

    print("Generating image with prompt:", full_prompt)
    api_url = f"https://api-inference.huggingface.co/models/{repo}"
    headers = {}
    payload = {
        "inputs": full_prompt,
        "parameters": {
            "negative_prompt": "(worst quality, low quality, lowres, oversaturated, grayscale, bad photo:1.4)",
            "num_inference_steps": 30,
            "scheduler": "DPMSolverMultistepScheduler",
        },
    }

    error_count = 0
    pbar = tqdm(total=None, desc="Loading model")
    while True:
        response = requests.post(api_url, headers=headers, json=payload)
        if response.status_code == 200:
            speech_text = f"Your design is generated with the color '{color_prompt}', mobile type '{phone_type_prompt}', and design '{design_prompt}'."
            return Image.open(BytesIO(response.content)), speech_text
        elif response.status_code == 503:
            time.sleep(1)
            pbar.update(1)
        elif response.status_code == 500 and error_count < 5:
            time.sleep(1)
            error_count += 1
        else:
            raise Exception(f"API Error: {response.status_code}")

# Save the design
def save_design(image):
    saved_designs_dir = "saved_designs"
    os.makedirs(saved_designs_dir, exist_ok=True)
    file_path = os.path.join(saved_designs_dir, f"design_{int(time.time())}.png")
    image.save(file_path)
    return f"Design saved as {file_path}!"

# Fetch saved designs for display on the Home page
def fetch_saved_designs():
    saved_designs_dir = "saved_designs"
    if not os.path.exists(saved_designs_dir):
        return []
    
    designs = []
    for file_name in os.listdir(saved_designs_dir):
        if file_name.endswith((".png", ".jpg", ".jpeg")):
            designs.append(os.path.join(saved_designs_dir, file_name))
    return designs

# Custom CSS for animations
custom_css = """
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(-45deg, #ff9a9e, #fad0c4, #fbc2eb, #8fd3f4);
    background-size: 400% 400%;
    z-index: -1;
    animation: gradientShift 15s ease infinite;
}
@keyframes gradientShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
"""

# JavaScript for text-to-speech and particles
custom_js = """
<script>
document.addEventListener('DOMContentLoaded', function () {
    // Text-to-speech functionality
    function speak(text) {
        const synth = window.speechSynthesis;
        const utterance = new SpeechSynthesisUtterance(text);
        synth.speak(utterance);
    }
    document.addEventListener('gradio_event:output_update', (event) => {
        const outputText = event.detail?.text || '';
        if (outputText) {
            speak(outputText);
        }
    });
});
</script>
"""

# Gradio interface
with gr.Blocks(css=custom_css) as interface:
    gr.HTML(custom_js)
    gr.Markdown("# **AI Phone Cover Designer**")
    gr.Markdown("Create custom phone covers with AI. Save your designs for future use.")
    
    # Navigation Tabs
    with gr.Tabs():
        with gr.Tab("Home"):
            gr.Markdown("Welcome to the **AI Phone Cover Designer**! Below are some of your saved designs.")
            
            # Gallery to display saved designs
            saved_images_gallery = gr.Gallery(label="Saved Designs").style(grid=[2], height="400px")
            
            # Button to refresh gallery
            refresh_button = gr.Button("Refresh Gallery")
            
            def refresh_gallery():
                return fetch_saved_designs()
            
            refresh_button.click(
                refresh_gallery,
                inputs=[],
                outputs=[saved_images_gallery]
            )

        with gr.Tab("Design"):
            with gr.Row():
                with gr.Column(scale=1):
                    color_prompt = gr.Textbox(label="Color", placeholder="E.g., Red")
                    phone_type_prompt = gr.Textbox(label="Mobile type", placeholder="E.g., iPhone, Samsung")
                    design_prompt = gr.Textbox(label="Design Details", placeholder="E.g., Bold stripes with geometric patterns")
                    chatbot = gr.Chatbot()
                    generate_button = gr.Button("Generate Design")
                    save_button = gr.Button("Save Design")
                with gr.Column(scale=1):
                    output_image = gr.Image(label="Generated Design")
                    output_message = gr.Textbox(label="AI Assistant Message", interactive=False)

            # Button Actions
            generate_button.click(
                infer,
                inputs=[color_prompt, phone_type_prompt, design_prompt],
                outputs=[output_image, output_message],
            )
            save_button.click(
                save_design,
                inputs=[output_image],
                outputs=output_message,
            )

        with gr.Tab("About"):
            gr.Markdown("""            
            ## About AI Phone Cover Maker
            The **AI Phone Cover Maker** is a cutting-edge tool designed to help users create personalized phone cover designs quickly and easily. 
            Powered by AI, it uses advanced image generation techniques to craft unique, high-quality designs for any mobile device.
            
            ### Features:
            - Create custom designs using simple prompts.
            - Generate designs for various phone models.
            - Save your designs for future use.
            
            Start designing today and bring your creative ideas to life!
            """)

# Launch the app
interface.launch(debug=True)