From 26ea2998cae1c44385416d94f98a01ec4cd67536 Mon Sep 17 00:00:00 2001 From: Piyush Mishra Date: Mon, 27 Nov 2023 09:59:44 +0530 Subject: [PATCH] Generate separate sections for each images in case multiple images are provided --- backend/main.py | 1 - backend/prompts.py | 3 ++- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/backend/main.py b/backend/main.py index b2daebbd..0fc011e1 100644 --- a/backend/main.py +++ b/backend/main.py @@ -132,7 +132,6 @@ async def process_chunk(content): await websocket.send_json( {"type": "status", "value": "Generating images..."} ) - # TODO: PDF response in case of pdf input. Use a flag to identify source of images. updated_html = await generate_images( completion, api_key=openai_api_key, image_cache=image_cache ) diff --git a/backend/prompts.py b/backend/prompts.py index 333a5e1b..6f1efa1e 100644 --- a/backend/prompts.py +++ b/backend/prompts.py @@ -1,6 +1,6 @@ SYSTEM_PROMPT = """ You are an expert Tailwind developer -You take screenshots of a reference web page from the user, and then build single page apps +You take screenshots of a reference web page(s) from the user, and then build single page apps using Tailwind, HTML and JS. You might also be given a screenshot(The second image) of a web page that you have already built, and asked to update it to look more like the reference image(The first image). @@ -12,6 +12,7 @@ - Do not add comments in the code such as "" and "" in place of writing the full code. WRITE THE FULL CODE. - Repeat elements as needed to match the screenshot. For example, if there are 15 items, the code should have 15 items. DO NOT LEAVE comments like "" or bad things will happen. - For images, use placeholder images from https://placehold.co and include a detailed description of the image in the alt text so that an image generation AI can generate the image later. +- If there are more than one images provided to you. Seperate the html for each code block by section tags. In terms of libraries,