Added Docker steps (#9)

* Added Docker steps
* Updated Runnable Url
* Added Ollama note in the homepage
* Bumped version to 0.1.1
* Added details about the planned feature

README.md

@@ -4,7 +4,7 @@
 
 This is our Image AI Prompt Generator, and was heavily inspired by [@gokaygokay](https://huggingface.co/gokaygokay)'s [Flux Prompt Generator](https://huggingface.co/spaces/gokaygokay/FLUX-Prompt-Generator) over on [Huggingface](https://huggingface.co).
 
-## Dependencies
+## Run Dependencies
 
 Currently, for LLM Prompt generation, this app requires Ollama to be running. It can run on local (default endpoint - http://localhost:11434), or you can specify the location in the 3rd panel.
 
@@ -26,30 +26,51 @@ The selected settings are persisted into cookies, so that if we revisit the app,
 
 ## Planned Features
 
-* 
+* Add support for Grok API for LLM Prompt generation
 * Please [raise an Issue](./issues/new) for feature you'd like to see here.
 * Please [raise an Issue](./issues/new) for any settings you'd like to see in the Settings panel.
 
 ### Note
 
 * Not all Image generation models will work with the LLM generated prompt. Some require, small concise keyword based prompts instead of the prose-like prompts that will be generated with the LLM model(s). In those models, the basic Prompt might work better than the LLM generated prompts, which will work better for Flux based models.
 
-## Dependencies
+## Running
 
-Run `npm install` to resolve dependencies.
+### k0r0pt AI Image Prompt Generator
 
-## Build
+You can see it in action here - [k0r0pt AI Image Prompt Generator](https://k0r0pt-ai-image-prompt-gen.sudipto.me)
 
-Run `npm run build` to build the project. The build artifacts will be stored in the `dist/` directory.
+### Docker
 
-## Running
+To run with Docker, you can run this command
 
-### Docker
+```shell
+docker run -d -p 8080:80 ghcr.io/k0r0pt/aiimagepromptgenerator
+```
+
+After that, you can open [http://localhost:8080](http://localhost:8080).
 
-Coming soon
 
 ### Bare Metal
 
-Run `npm start` to run the project, after which you can access [http://localhost:4200](http://localhost:4200).
+#### Production
+
+Copy the contents of the `dist` directory to your web server and you'll be good to go.
+
+#### Development
+
+##### Dependencies
+
+Run `npm install` to resolve dependencies.
+
+##### Build
+
+Run `npm run build` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+##### Run
+
+Run `npm start` to run the project, after which you can open [http://localhost:4200](http://localhost:4200).
+
+
 
 Built with [Angular](https://angular.dev/) :heart:

package.json

@@ -1,6 +1,6 @@
 {
   "name": "k0r0pt-ai-image-prompt-gen",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",

src/app/app.component.html

@@ -1,13 +1,16 @@
 <h1>k0r0pt AI Image Prompt Generator</h1>
 <mat-divider></mat-divider>
 <div class="linksGrid">
-  <div id="githubLink"><mat-icon color="primary">home</mat-icon> <b><a href="https://github.com/k0r0pt/aiImagePromptGenerator">Github</a></b></div>
-  <div id="runLink"><mat-icon color="primary">home</mat-icon> <b><a href="https://ai-image-prompt-gen.sudipto.me">Run</a></b></div>
+  <div id="githubLink"><mat-icon color="primary" [svgIcon]="'github'"></mat-icon>&nbsp;<b><a href="https://github.com/k0r0pt/aiImagePromptGenerator">Github</a></b></div>
+  <div id="runLink"><mat-icon color="primary">home</mat-icon>&nbsp;<b><a href="https://k0r0pt-ai-image-prompt-gen.sudipto.me">Run</a></b></div>
   <div id="buildStatusLink"><a href="https://github.com/k0r0pt/aiImagePromptGenerator/actions/workflows/build.yml"><img src="https://github.com/k0r0pt/aiImagePromptGenerator/actions/workflows/build.yml/badge.svg" /></a></div>
 </div>
 <mat-divider></mat-divider>
 <br />
 <br />
+<b>NOTE</b>: You'll need to install <a href="https://ollama.com/">Ollama</a>, and then install and run Llama3.1 - <code>ollama run llama3.1</code>, for this to work.
+<br />
+Alternatively, you can expand the <code>LLM Options</code> in the third panel to specify your Ollama server.
 <br />
 <br />
 <br />

src/app/app.component.ts

@@ -1,10 +1,17 @@
 import { Component } from '@angular/core';
+import { MatIconRegistry } from '@angular/material/icon';
+import { DomSanitizer } from '@angular/platform-browser';
 
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.scss']
 })
 export class AppComponent {
-  title = 'k0r0pt-ai-image-prompt-gen';
+  title = 'k0r0pt-ai-image-prompt-gen'
+  githubLogoUrl = "../assets/github-mark.svg"
+
+  constructor(private domSanitizer: DomSanitizer, private matIconRegistry: MatIconRegistry) {
+    this.matIconRegistry.addSvgIcon("github", this.domSanitizer.bypassSecurityTrustResourceUrl(this.githubLogoUrl));
+  }
 }