From e47805dd16d10208e17f3b269a8f4d394ee568b1 Mon Sep 17 00:00:00 2001
From: phamhungd <phamhung.d@gmail.com>
Date: Tue, 25 Nov 2025 22:00:09 +0700
Subject: [PATCH] add node prompt

---
 app.py                           |  3 +++
 static/modules/referenceSlots.js |  2 +-
 static/script.js                 | 17 ++++++++++++++---
 templates/index.html             |  6 ++++++
 4 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/app.py b/app.py
index 1e884d3..124f7c4 100644
--- a/app.py
+++ b/app.py
@@ -183,6 +183,7 @@ def generate_image():
     if multipart:
         form = request.form
         prompt = form.get('prompt')
+        note = form.get('note', '')
         aspect_ratio = form.get('aspect_ratio')
         resolution = form.get('resolution', '2K')
         api_key = form.get('api_key') or os.environ.get('GOOGLE_API_KEY')
@@ -191,6 +192,7 @@ def generate_image():
     else:
         data = request.get_json() or {}
         prompt = data.get('prompt')
+        note = data.get('note', '')
         aspect_ratio = data.get('aspect_ratio')
         resolution = data.get('resolution', '2K')
         api_key = data.get('api_key') or os.environ.get('GOOGLE_API_KEY')
@@ -342,6 +344,7 @@ def generate_image():
 
                 metadata = {
                     'prompt': prompt,
+                    'note': note,
                     'aspect_ratio': aspect_ratio or 'Auto',
                     'resolution': resolution,
                     'reference_images': final_reference_paths,
diff --git a/static/modules/referenceSlots.js b/static/modules/referenceSlots.js
index 9ddd6f4..74fc6b3 100644
--- a/static/modules/referenceSlots.js
+++ b/static/modules/referenceSlots.js
@@ -2,7 +2,7 @@ import { dataUrlToBlob, withCacheBuster } from './utils.js';
 
 export function createReferenceSlotManager(imageInputGrid, options = {}) {
     const MAX_IMAGE_SLOTS = 16;
-    const INITIAL_IMAGE_SLOTS = 4;
+    const INITIAL_IMAGE_SLOTS = 2;
     const onChange = options.onChange;
     const imageSlotState = [];
     let cachedReferenceImages = [];
diff --git a/static/script.js b/static/script.js
index 3ba7601..9d4f4eb 100644
--- a/static/script.js
+++ b/static/script.js
@@ -63,6 +63,7 @@ const POPUP_CONTENT = {
 document.addEventListener('DOMContentLoaded', () => {
     const generateBtn = document.getElementById('generate-btn');
     const promptInput = document.getElementById('prompt');
+    const promptNoteInput = document.getElementById('prompt-note');
     const aspectRatioInput = document.getElementById('aspect-ratio');
     const resolutionInput = document.getElementById('resolution');
     const apiKeyInput = document.getElementById('api-key');
@@ -192,6 +193,7 @@ document.addEventListener('DOMContentLoaded', () => {
     }
     refreshApiKeyVisibility();
     promptInput.addEventListener('input', persistSettings);
+    promptNoteInput.addEventListener('input', persistSettings);
     aspectRatioInput.addEventListener('change', persistSettings);
     resolutionInput.addEventListener('change', persistSettings);
 
@@ -229,6 +231,7 @@ document.addEventListener('DOMContentLoaded', () => {
             
             const formData = buildGenerateFormData({
                 prompt: task.prompt,
+                note: task.note || '',
                 aspect_ratio: task.aspectRatio,
                 resolution: task.resolution,
                 api_key: task.apiKey,
@@ -263,6 +266,7 @@ document.addEventListener('DOMContentLoaded', () => {
 
     function addToQueue() {
         const prompt = promptInput.value.trim();
+        const note = promptNoteInput.value.trim();
         const aspectRatio = aspectRatioInput.value;
         const resolution = resolutionInput.value;
         const apiKey = apiKeyInput.value.trim();
@@ -277,8 +281,12 @@ document.addEventListener('DOMContentLoaded', () => {
             return;
         }
 
+        // Concatenate prompt with note if note exists
+        const finalPrompt = note ? `${prompt} ${note}` : prompt;
+
         generationQueue.push({
-            prompt,
+            prompt: finalPrompt,
+            note: note,  // Store original note separately for metadata
             aspectRatio,
             resolution,
             apiKey
@@ -1264,6 +1272,7 @@ document.addEventListener('DOMContentLoaded', () => {
     function applyMetadata(metadata) {
         if (!metadata) return;
         if (metadata.prompt) promptInput.value = metadata.prompt;
+        if (metadata.note) promptNoteInput.value = metadata.note;
         if (metadata.aspect_ratio) aspectRatioInput.value = metadata.aspect_ratio;
         if (metadata.resolution) resolutionInput.value = metadata.resolution;
         
@@ -1348,12 +1357,13 @@ document.addEventListener('DOMContentLoaded', () => {
             const saved = localStorage.getItem(SETTINGS_STORAGE_KEY);
             if (!saved) return {};
 
-            const { apiKey, aspectRatio, resolution, prompt, referenceImages } = JSON.parse(saved);
+            const { apiKey, aspectRatio, resolution, prompt, promptNote, referenceImages } = JSON.parse(saved);
             if (apiKey) apiKeyInput.value = apiKey;
             if (aspectRatio) aspectRatioInput.value = aspectRatio;
             if (resolution) resolutionInput.value = resolution;
             if (prompt) promptInput.value = prompt;
-            return { apiKey, aspectRatio, resolution, prompt, referenceImages };
+            if (promptNote) promptNoteInput.value = promptNote;
+            return { apiKey, aspectRatio, resolution, prompt, promptNote, referenceImages };
         } catch (error) {
             console.warn('Unable to load cached settings', error);
             return {};
@@ -1368,6 +1378,7 @@ document.addEventListener('DOMContentLoaded', () => {
                 aspectRatio: aspectRatioInput.value,
                 resolution: resolutionInput.value,
                 prompt: promptInput.value.trim(),
+                promptNote: promptNoteInput.value.trim(),
                 referenceImages: slotManager.serializeReferenceImages(),
             };
             localStorage.setItem(SETTINGS_STORAGE_KEY, JSON.stringify(settings));
diff --git a/templates/index.html b/templates/index.html
index 41f5f98..f1d6468 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -87,6 +87,12 @@
                         </div>
                     </div>
 
+                    <div class="input-group">
+                        <label for="prompt-note">Note (sẽ được thêm vào prompt)</label>
+                        <textarea id="prompt-note" placeholder="Thêm chi tiết hoặc điều chỉnh cho prompt..."
+                            rows="2"></textarea>
+                    </div>
+
                     <div class="input-group image-inputs">
                         <div class="image-input-header">
                             <label>Reference Images</label>