akhaliq HF staff commited on
Commit
39f7657
1 Parent(s): 0a936ec

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +43 -45
app.py CHANGED
@@ -1,30 +1,47 @@
1
  import gradio as gr
 
 
 
2
  from together import Together
3
  import base64
4
  from io import BytesIO
5
- from PIL import Image
6
  import numpy as np
7
  import traceback
8
- import json
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
9
 
10
  def generate_gradio_app(api_key, image):
11
  if not api_key:
12
  return "Error: API key not provided. Please enter your Together API key."
13
 
14
  try:
15
- # Initialize the Together client with the provided API key
16
- client = Together(api_key=api_key)
17
 
18
- # Convert numpy array to PIL Image
19
- if isinstance(image, np.ndarray):
20
- image = Image.fromarray(image.astype('uint8'), 'RGB')
21
 
22
- # Convert the image to base64
23
- buffered = BytesIO()
24
- image.save(buffered, format="PNG")
25
- img_str = base64.b64encode(buffered.getvalue()).decode()
26
-
27
- # Prepare the prompt
28
  prompt = """You are an AI assistant specialized in UI/UX design and Gradio app development. Analyze the attached screenshot or UI mockup and generate a concise Gradio code that recreates the main elements of this design. Follow these steps:
29
 
30
  1. Briefly describe the main elements of the UI.
@@ -39,58 +56,39 @@ def generate_gradio_app(api_key, image):
39
 
40
  Please generate the Gradio code based on the provided image, focusing on the most crucial elements to fit within the token limit."""
41
 
42
- # Make the API call with the corrected message format
 
 
 
 
 
 
 
 
 
43
  response = client.chat.completions.create(
44
  model="meta-llama/Llama-3.2-90B-Vision-Instruct-Turbo",
45
- messages=[
46
- {
47
- "role": "user",
48
- "content": prompt + f"\n\n<image>\ndata:image/png;base64,{img_str}\n</image>"
49
- }
50
- ],
51
  max_tokens=2000,
52
  temperature=0.7,
53
  top_p=0.7,
54
  top_k=50,
55
  repetition_penalty=1,
56
- stop=["<|eot_id|>", "<|eom_id|>"],
57
- stream=False
58
  )
59
-
60
- # Debug: Print relevant parts of the response
61
- print("API Response received. Content available:", bool(response.choices))
62
 
63
- # Extract the generated code from the response
64
  if response.choices and response.choices[0].message:
65
  generated_code = response.choices[0].message.content
66
  print("Generated code length:", len(generated_code))
 
67
  else:
68
  return "Error: Unexpected response structure from the API."
69
-
70
- if not generated_code:
71
- return "Error: No code generated from the model. Please try again."
72
-
73
- return generated_code
74
 
75
  except Exception as e:
76
  error_message = str(e)
77
  stack_trace = traceback.format_exc()
78
-
79
- # Check if the error is related to the API response
80
- if "TogetherErrorResponse" in error_message:
81
- try:
82
- # Try to parse the error message as JSON
83
- error_data = json.loads(error_message.split("TogetherErrorResponse")[-1].strip())
84
- if isinstance(error_data.get('code'), int):
85
- error_data['code'] = str(error_data['code']) # Convert code to string
86
- error_message = f"API Error: {error_data.get('message', 'Unknown error')}"
87
- except json.JSONDecodeError:
88
- # If parsing fails, use the original error message
89
- pass
90
-
91
  return f"An error occurred: {error_message}\n\nStack trace:\n{stack_trace}\n\nPlease check your API key and try again."
92
 
93
- # The rest of your code remains the same
94
  with gr.Blocks() as demo:
95
  gr.Markdown("# Generate Concise Gradio App from Wireframe")
96
  gr.Markdown("Enter your Together API key, upload an image of your UI design, and we'll generate a compact Gradio code to recreate its main elements.")
 
1
  import gradio as gr
2
+ from PIL import Image
3
+ import requests
4
+ import os
5
  from together import Together
6
  import base64
7
  from io import BytesIO
 
8
  import numpy as np
9
  import traceback
10
+
11
+ # Initialize Together client
12
+ client = None
13
+
14
+ def initialize_client(api_key=None):
15
+ global client
16
+ if api_key:
17
+ client = Together(api_key=api_key)
18
+ elif "TOGETHER_API_KEY" in os.environ:
19
+ client = Together()
20
+ else:
21
+ raise ValueError("Please provide an API key or set the TOGETHER_API_KEY environment variable")
22
+
23
+ def encode_image(image, max_size=(800, 800), quality=85):
24
+ if isinstance(image, np.ndarray):
25
+ image = Image.fromarray(image.astype('uint8'), 'RGB')
26
+
27
+ image.thumbnail(max_size)
28
+ if image.mode in ('RGBA', 'LA'):
29
+ background = Image.new(image.mode[:-1], image.size, (255, 255, 255))
30
+ background.paste(image, mask=image.split()[-1])
31
+ image = background
32
+ buffered = BytesIO()
33
+ image.save(buffered, format="JPEG", quality=quality)
34
+ return base64.b64encode(buffered.getvalue()).decode('utf-8')
35
 
36
  def generate_gradio_app(api_key, image):
37
  if not api_key:
38
  return "Error: API key not provided. Please enter your Together API key."
39
 
40
  try:
41
+ initialize_client(api_key)
 
42
 
43
+ encoded_image = encode_image(image)
 
 
44
 
 
 
 
 
 
 
45
  prompt = """You are an AI assistant specialized in UI/UX design and Gradio app development. Analyze the attached screenshot or UI mockup and generate a concise Gradio code that recreates the main elements of this design. Follow these steps:
46
 
47
  1. Briefly describe the main elements of the UI.
 
56
 
57
  Please generate the Gradio code based on the provided image, focusing on the most crucial elements to fit within the token limit."""
58
 
59
+ messages = [
60
+ {
61
+ "role": "user",
62
+ "content": [
63
+ {"type": "text", "text": prompt},
64
+ {"type": "image_url", "image_url": {"url": f"data:image/jpeg;base64,{encoded_image}"}}
65
+ ]
66
+ }
67
+ ]
68
+
69
  response = client.chat.completions.create(
70
  model="meta-llama/Llama-3.2-90B-Vision-Instruct-Turbo",
71
+ messages=messages,
 
 
 
 
 
72
  max_tokens=2000,
73
  temperature=0.7,
74
  top_p=0.7,
75
  top_k=50,
76
  repetition_penalty=1,
77
+ stop=["<|eot_id|>", "<|eom_id|>"]
 
78
  )
 
 
 
79
 
 
80
  if response.choices and response.choices[0].message:
81
  generated_code = response.choices[0].message.content
82
  print("Generated code length:", len(generated_code))
83
+ return generated_code
84
  else:
85
  return "Error: Unexpected response structure from the API."
 
 
 
 
 
86
 
87
  except Exception as e:
88
  error_message = str(e)
89
  stack_trace = traceback.format_exc()
 
 
 
 
 
 
 
 
 
 
 
 
 
90
  return f"An error occurred: {error_message}\n\nStack trace:\n{stack_trace}\n\nPlease check your API key and try again."
91
 
 
92
  with gr.Blocks() as demo:
93
  gr.Markdown("# Generate Concise Gradio App from Wireframe")
94
  gr.Markdown("Enter your Together API key, upload an image of your UI design, and we'll generate a compact Gradio code to recreate its main elements.")