Update app.py
Browse files
app.py
CHANGED
@@ -14,40 +14,45 @@ model = AutoModelForCausalLM.from_pretrained(
|
|
14 |
)
|
15 |
|
16 |
@spaces.GPU(duration=120)
|
17 |
-
def
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
18 |
messages = [
|
19 |
-
{"role": "system", "content": "You are a
|
20 |
{"role": "user", "content": prompt}
|
21 |
]
|
22 |
formatted_prompt = tokenizer.apply_chat_template(messages, add_generation_prompt=True, tokenize=False)
|
23 |
|
24 |
-
|
25 |
-
if image is not None:
|
26 |
-
image = Image.open(image).convert("RGB")
|
27 |
-
inputs = tokenizer(formatted_prompt, images=[image], return_tensors="pt", padding=True).to(model.device)
|
28 |
-
else:
|
29 |
-
inputs = tokenizer(formatted_prompt, return_tensors="pt", padding=True).to(model.device)
|
30 |
|
31 |
-
# Generate
|
32 |
with torch.no_grad():
|
33 |
outputs = model.generate(
|
34 |
**inputs,
|
35 |
-
max_new_tokens=
|
36 |
do_sample=True,
|
37 |
-
temperature=
|
38 |
-
top_k=
|
39 |
top_p=0.95,
|
40 |
)
|
41 |
|
42 |
-
|
43 |
-
|
44 |
-
return response
|
45 |
|
46 |
# Custom CSS
|
47 |
css = """
|
48 |
body {
|
49 |
-
background-color: #
|
50 |
-
color: #e0e0e0;
|
51 |
font-family: 'Arial', sans-serif;
|
52 |
}
|
53 |
.container {
|
@@ -56,37 +61,34 @@ body {
|
|
56 |
padding: 20px;
|
57 |
}
|
58 |
.gradio-container {
|
59 |
-
background-color:
|
60 |
border-radius: 15px;
|
61 |
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
62 |
}
|
63 |
.header {
|
64 |
-
background-color: #
|
|
|
65 |
padding: 20px;
|
66 |
border-radius: 15px 15px 0 0;
|
67 |
text-align: center;
|
68 |
margin-bottom: 20px;
|
69 |
}
|
70 |
.header h1 {
|
71 |
-
color: #e94560;
|
72 |
font-size: 2.5em;
|
73 |
margin-bottom: 10px;
|
74 |
}
|
75 |
-
.header p {
|
76 |
-
color: #a0a0a0;
|
77 |
-
}
|
78 |
.input-group, .output-group {
|
79 |
-
background-color: #
|
80 |
padding: 20px;
|
81 |
border-radius: 10px;
|
82 |
margin-bottom: 20px;
|
83 |
}
|
84 |
.input-group label, .output-group label {
|
85 |
-
color: #
|
86 |
font-weight: bold;
|
87 |
}
|
88 |
.generate-btn {
|
89 |
-
background-color: #
|
90 |
color: white !important;
|
91 |
border: none !important;
|
92 |
border-radius: 5px !important;
|
@@ -96,72 +98,31 @@ body {
|
|
96 |
transition: background-color 0.3s ease !important;
|
97 |
}
|
98 |
.generate-btn:hover {
|
99 |
-
background-color: #
|
100 |
-
}
|
101 |
-
.example-prompts {
|
102 |
-
background-color: #1f2b47;
|
103 |
-
padding: 15px;
|
104 |
-
border-radius: 10px;
|
105 |
-
margin-bottom: 20px;
|
106 |
-
}
|
107 |
-
.example-prompts h3 {
|
108 |
-
color: #e94560;
|
109 |
-
margin-bottom: 10px;
|
110 |
-
}
|
111 |
-
.example-prompts ul {
|
112 |
-
list-style-type: none;
|
113 |
-
padding-left: 0;
|
114 |
-
}
|
115 |
-
.example-prompts li {
|
116 |
-
margin-bottom: 5px;
|
117 |
-
cursor: pointer;
|
118 |
-
transition: color 0.3s ease;
|
119 |
-
}
|
120 |
-
.example-prompts li:hover {
|
121 |
-
color: #e94560;
|
122 |
}
|
123 |
"""
|
124 |
|
125 |
-
# Example prompts
|
126 |
-
example_prompts = [
|
127 |
-
"Describe this image in detail.",
|
128 |
-
"What emotions does this image evoke?",
|
129 |
-
"Imagine a story based on this image.",
|
130 |
-
"What technical aspects of photography are demonstrated in this image?",
|
131 |
-
"How might this image be used in advertising?"
|
132 |
-
]
|
133 |
-
|
134 |
# Gradio interface
|
135 |
with gr.Blocks(css=css) as iface:
|
136 |
gr.HTML(
|
137 |
"""
|
138 |
<div class="header">
|
139 |
-
<h1>Pixtral
|
140 |
-
<p>
|
141 |
</div>
|
142 |
"""
|
143 |
)
|
144 |
|
145 |
with gr.Group():
|
146 |
-
with gr.Group(elem_classes="example-prompts"):
|
147 |
-
gr.HTML("<h3>Example Prompts:</h3>")
|
148 |
-
example_buttons = [gr.Button(prompt) for prompt in example_prompts]
|
149 |
-
|
150 |
with gr.Group(elem_classes="input-group"):
|
151 |
-
image_input = gr.Image(type="filepath", label="Upload an image
|
152 |
-
|
153 |
-
|
154 |
-
temperature = gr.Slider(minimum=0.1, maximum=2.0, value=0.7, step=0.1, label="Temperature")
|
155 |
-
generate_btn = gr.Button("Generate", elem_classes="generate-btn")
|
156 |
|
157 |
with gr.Group(elem_classes="output-group"):
|
158 |
-
output = gr.Textbox(label="Generated
|
159 |
-
|
160 |
-
generate_btn.click(generate_response, inputs=[image_input, prompt, max_length, temperature], outputs=output)
|
161 |
|
162 |
-
|
163 |
-
for button in example_buttons:
|
164 |
-
button.click(lambda x: x, inputs=[button], outputs=[prompt])
|
165 |
|
166 |
# Launch the app
|
167 |
iface.launch()
|
|
|
14 |
)
|
15 |
|
16 |
@spaces.GPU(duration=120)
|
17 |
+
def generate_description(image, detail_level):
|
18 |
+
if image is None:
|
19 |
+
return "Please upload an image to generate a description."
|
20 |
+
|
21 |
+
image = Image.open(image).convert("RGB")
|
22 |
+
|
23 |
+
detail_prompts = {
|
24 |
+
"Brief": "Provide a brief description of this image in 2-3 sentences.",
|
25 |
+
"Detailed": "Describe this image in detail, including main subjects, colors, composition, and any notable elements.",
|
26 |
+
"Comprehensive": "Provide a comprehensive analysis of this image, including subjects, colors, composition, mood, potential symbolism, and any other relevant details you can observe."
|
27 |
+
}
|
28 |
+
|
29 |
+
prompt = detail_prompts[detail_level]
|
30 |
+
|
31 |
messages = [
|
32 |
+
{"role": "system", "content": "You are a highly observant AI assistant specialized in describing images accurately and in detail."},
|
33 |
{"role": "user", "content": prompt}
|
34 |
]
|
35 |
formatted_prompt = tokenizer.apply_chat_template(messages, add_generation_prompt=True, tokenize=False)
|
36 |
|
37 |
+
inputs = tokenizer(formatted_prompt, images=[image], return_tensors="pt", padding=True).to(model.device)
|
|
|
|
|
|
|
|
|
|
|
38 |
|
|
|
39 |
with torch.no_grad():
|
40 |
outputs = model.generate(
|
41 |
**inputs,
|
42 |
+
max_new_tokens=300,
|
43 |
do_sample=True,
|
44 |
+
temperature=0.7,
|
45 |
+
top_k=50,
|
46 |
top_p=0.95,
|
47 |
)
|
48 |
|
49 |
+
description = tokenizer.decode(outputs[0][inputs['input_ids'].shape[1]:], skip_special_tokens=True)
|
50 |
+
return description.strip()
|
|
|
51 |
|
52 |
# Custom CSS
|
53 |
css = """
|
54 |
body {
|
55 |
+
background-color: #f0f0f5;
|
|
|
56 |
font-family: 'Arial', sans-serif;
|
57 |
}
|
58 |
.container {
|
|
|
61 |
padding: 20px;
|
62 |
}
|
63 |
.gradio-container {
|
64 |
+
background-color: white;
|
65 |
border-radius: 15px;
|
66 |
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
67 |
}
|
68 |
.header {
|
69 |
+
background-color: #4a90e2;
|
70 |
+
color: white;
|
71 |
padding: 20px;
|
72 |
border-radius: 15px 15px 0 0;
|
73 |
text-align: center;
|
74 |
margin-bottom: 20px;
|
75 |
}
|
76 |
.header h1 {
|
|
|
77 |
font-size: 2.5em;
|
78 |
margin-bottom: 10px;
|
79 |
}
|
|
|
|
|
|
|
80 |
.input-group, .output-group {
|
81 |
+
background-color: #f9f9f9;
|
82 |
padding: 20px;
|
83 |
border-radius: 10px;
|
84 |
margin-bottom: 20px;
|
85 |
}
|
86 |
.input-group label, .output-group label {
|
87 |
+
color: #4a90e2;
|
88 |
font-weight: bold;
|
89 |
}
|
90 |
.generate-btn {
|
91 |
+
background-color: #4a90e2 !important;
|
92 |
color: white !important;
|
93 |
border: none !important;
|
94 |
border-radius: 5px !important;
|
|
|
98 |
transition: background-color 0.3s ease !important;
|
99 |
}
|
100 |
.generate-btn:hover {
|
101 |
+
background-color: #3a7bc8 !important;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
102 |
}
|
103 |
"""
|
104 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
105 |
# Gradio interface
|
106 |
with gr.Blocks(css=css) as iface:
|
107 |
gr.HTML(
|
108 |
"""
|
109 |
<div class="header">
|
110 |
+
<h1>Pixtral Image Description Generator</h1>
|
111 |
+
<p>Upload an image and get a detailed description using the powerful Pixtral-12B model.</p>
|
112 |
</div>
|
113 |
"""
|
114 |
)
|
115 |
|
116 |
with gr.Group():
|
|
|
|
|
|
|
|
|
117 |
with gr.Group(elem_classes="input-group"):
|
118 |
+
image_input = gr.Image(type="filepath", label="Upload an image")
|
119 |
+
detail_level = gr.Radio(["Brief", "Detailed", "Comprehensive"], label="Description Detail Level", value="Detailed")
|
120 |
+
generate_btn = gr.Button("Generate Description", elem_classes="generate-btn")
|
|
|
|
|
121 |
|
122 |
with gr.Group(elem_classes="output-group"):
|
123 |
+
output = gr.Textbox(label="Generated Description", lines=10)
|
|
|
|
|
124 |
|
125 |
+
generate_btn.click(generate_description, inputs=[image_input, detail_level], outputs=output)
|
|
|
|
|
126 |
|
127 |
# Launch the app
|
128 |
iface.launch()
|