Feature: Adding Ollama support

.env-ollama.example

@@ -0,0 +1,3 @@
+OPENAI_API_KEY=sk-1234567890abcdef
+OPENAI_BASE_URL=http://localhost:11434/v1
+OPENAI_MODEL='llava:7b'

.env-openai.example

@@ -0,0 +1 @@
+OPENAI_API_KEY=[sk-your-key]

.gitignore

@@ -34,3 +34,5 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
+
+.env

README.md

@@ -12,14 +12,28 @@ This works by just taking the current canvas SVG, converting it to a PNG, and se
 
 ## Getting Started
 
-This is a Next.js app. To get started run the following commands in the root directory of the project. You will need an OpenAI API key with access to the GPT-4 Vision API.
+This is a Next.js app. To get started run the following commands in the root directory of the project.
 
 > Note this uses Next.js 14 and requires a version of `node` greater than 18.17. [Read more here](https://nextjs.org/docs/pages/building-your-application/upgrading/version-14).
 
+### OpenAI
+
+You will need an OpenAI API key with access to the GPT-4 Vision API.
+
 ```bash
-echo "OPENAI_API_KEY=sk-your-key" > .env.local
+cp .env-openai.example .env # Edit the .env with your OpenAI key
 npm install
 npm run dev
 ```
 
 Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+### Ollama
+
+You will need access to an Ollama instance with access to an LLM model with vision capabilities, i.e. llava.
+
+```bash
+cp .env-openai.example .env # Edit the .env with your Ollama base url and model name, you can leave the key as is
+npm install
+npm run dev
+```

app/api/toHtml/route.ts

@@ -6,12 +6,21 @@ const systemPrompt = `You are an expert tailwind developer. A user will provide
 if you need to insert an image, use placehold.co to create a placeholder image. Respond only with the html file.`;
 
 export async function POST(request: Request) {
-  const openai = new OpenAI();
+  const apiKey = process.env.OPENAI_API_KEY;
+  const baseURL = process.env.OPENAI_BASE_URL;
+  const model = process.env.OPENAI_MODEL ?? "gpt-4o";
+  const max_tokens = process.env.OPENAI_MAX_TOKENS
+    ? parseInt(process.env.OPENAI_MAX_TOKENS, 10)
+    : 4096;
+
+  const openai = new OpenAI({ baseURL, apiKey });
+
   const { image } = await request.json();
 
   const resp = await openai.chat.completions.create({
-    model: "gpt-4o",
-    max_tokens: 4096,
+    model,
+    max_tokens,
+    temperature: 0.8,
     messages: [
       {
         role: "system",