XimgGen

Running

App Files Files Community

yasirme commited on Aug 15

Commit

2c5c8bb

verified ·

1 Parent(s): ecfdfea

Update index.html

Browse files

Files changed (1) hide show

index.html +117 -100

index.html CHANGED Viewed

@@ -1,3 +1,4 @@
 <!doctype html>
 <html lang="en">
 <head>
@@ -51,7 +52,6 @@
   window.dataLayer = window.dataLayer || [];
   function gtag(){dataLayer.push(arguments);}
   gtag('js', new Date());
   gtag('config', 'G-3KV5X49N3B');
 </script>
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
@@ -60,7 +60,6 @@
     *, *::before, *::after { box-sizing: border-box; }
     html, body { height: 100%; margin: 0; padding: 0; font-family: 'Poppins', sans-serif; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; overflow-y: auto;}
     body { background: radial-gradient(circle at 20% 20%, rgba(140,60,200,0.08), transparent 40%), radial-gradient(circle at 80% 80%, rgba(200,60,255,0.05), transparent 40%), #000; color:#fff; overflow: hidden; }
     .topbar {
       position: fixed;
       top: 0;
@@ -87,7 +86,6 @@
       border:1px solid rgba(255,255,255,0.03);
     }
     .btn-small img { width:14px; height:14px; display:block; }
     .container {
       width: 70%;
       max-width: 1100px;
@@ -101,7 +99,6 @@
     @media (max-width: 768px) {
       .container { width: 100%; padding: 0 12px; margin-top:5em; }
     }
     .input-row {
       display:flex;
       gap:10px;
@@ -138,14 +135,12 @@
       transition:opacity .15s;
     }
     .generate-btn[disabled] { opacity:0.6; cursor:default; }
     .options-row {
       display:flex;
       justify-content:space-between;
       align-items:center;
     }
     .left-group, .right-group { display:flex; gap:8px; align-items:center; }
     .modal-backdrop {
       display:none;
       position: fixed;
@@ -168,7 +163,6 @@
     @media (max-width:420px) {
       .modal { padding: 14px; max-width: calc(100% - 12px); border-radius: 10px; }
     }
     .styles-grid {
       display:grid;
       grid-template-columns: repeat(2, 1fr);
@@ -187,14 +181,11 @@
     }
     .style-card img { width:100%; height:72px; object-fit:cover; display:block; }
     .style-card.selected { border-color:#ff93e9; box-shadow: 0 8px 30px rgba(155,124,255,0.06); }
     .settings-row { display:flex; gap:12px; align-items:center; margin-top:10px; flex-wrap:wrap; }
     .settings-row label { font-size:14px; display:flex; gap:8px; align-items:center; color:#eaeaea; }
     .settings-row input[type="number"], .settings-row select { background:#0c0c0c; border:1px solid rgba(255,255,255,0.04); color:#fff; padding:6px 8px; border-radius:8px; font-size:14px; min-width:80px; }
     .modal-actions { margin-top:14px; display:flex; justify-content:flex-end; gap:10px; }
     .modal-actions button { background:#1a1a1a; border-radius:10px; padding:9px 12px; font-size:14px; color:#fff; border:1px solid rgba(255,255,255,0.03); cursor:pointer; }
     #images {
       width: 100%;
       margin-top:8px;
@@ -210,7 +201,6 @@
       border:1px solid rgba(255,255,255,0.02);
       max-height: calc(100vh - 5em - 220px);
     }
     .image-card {
       background:#0b0b0b;
       border-radius:12px;
@@ -224,12 +214,9 @@
       justify-content:center;
     }
     .image-card img { width:100%; height:auto; display:block; border-radius:8px; }
     .loader { border:3px solid #222; border-top:3px solid #ff93e9; border-radius:50%; width:22px; height:22px; animation:spin 1s linear infinite; }
     @keyframes spin { 0%{ transform:rotate(0) } 100%{ transform:rotate(360deg) } }
     .muted { color:#9b9b9b; font-size:13px; }
     .row { display:flex; gap:10px; align-items:center; }
     .note { font-size:13px; color:#cfcfcf; margin-top:6px; }
   </style>
@@ -332,79 +319,136 @@
   const baseUrl = 'https://image.pollinations.ai';
   let selectedStyle = null;
   let isGenerating = false;
   const styleTemplates = {
-  cinema: " epic cinematic marvellous Hollywood movies style photo ",
-  realistic: "",
-  photography: " epic Magnificent professional photography style image ",
-  fantasy: " create epic fantasy style, image "
 };
   const SYSTEM_PROMPT = `
-ROLE
-You compose single-paragraph prompts for the Flux (FLUX.1) image model that yield natural, photoreal results. Never invent lighting or camera details unless the user specifies them.
-CORE RULES
-- Your prompt should correctly and accurately describe the users image need without changing or misinterpreting users need.
-- YOU Always always need to specify suitable photo style at starting like :
-    - "sun soaked color filter Fujifilm X100V grainy Palette photo of"
-    - "Kodak Ektachrome 135 mm Film Emulation Portra 160 photo of"
-    - "Fujifilm Instax desaturated pastel Palette photo of"
-    - "Kodak portra 400 sun soaked pastel Palette photo of"
-    - "Film grain Sepia & warm amber tones desaturated muted color photo of"
-    - "grainy sun soaked color filter Film photo of"
-    - "Hazed cloudy Pallete photo of"
-    - "Primary pink spectrum Complementary bright Cheerful and whimsical photo of"
-    - "Muted colors cinematic grainy noir realism photo of" etc..
-    you need to think which style will give the best photo in this case.
-    you can and should merge or create new styles and not just copy paste the above.
-    you should modify or update styles based on users needs.
-- YOU shall use style prefix only where it's suitable obviously you won't use it if user asked for anime or illustration or cartoon etc..
-- Never include negations or flaw-prevention phrases such as "without," "no," "avoid," "ban," "exclude."
-- Do not mention lighting, HDR, cinematic, volumetric, glow, bloom, lens flare, time of day, weather, or camera/lens unless the user explicitly includes them.
-- Mention colors only when tied to specific objects; avoid global terms like "vibrant" or "oversaturated."
-- Keep scenes plausible: accurate human anatomy, realistic object proportions, authentic textures and materials (skin pores, worn fabric, chipped paint, road dust).
-- "Your imagination is your creation" you need to create best aesthetics eye catching image as possible they user may give simple bad small prompt due to laziness but you need to convert it into epic using your creativity all these by keeping users need unaffected.
-- Your prompt should first focus on main subjects and key of the image in detail.
-- Never EVER use stylization keywords like "hyperrealistic," "realistic," "8k," "award-winning," "unreal engine," "cinematic."
-STRUCTURE TO FOLLOW
-Subject → Setting → Action/pose → Framing (e.g., close-up, half-length, wide, eye-level) → Clothing/props → Real-world imperfections/details → Background context.
-(If the user adds camera or lighting info, include it verbatim; otherwise omit.)
-OUTPUT FORMAT
-Return ONE clean sentence or short paragraph as the main prompt — nothing else.
-`;
   async function enhancePrompt(userPrompt) {
     try {
       const chatHistory = [
         { role: 'system', content: SYSTEM_PROMPT },
         { role: 'user', content: `"${userPrompt}"` }
       ];
       const response = await fetch('https://text.pollinations.ai/openai', {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json'
         },
         body: JSON.stringify({
-          model: 'openai' ,
           messages: chatHistory
         })
       });
       if (!response.ok) {
         throw new Error(`HTTP error! status: ${response.status}`);
       }
       const data = await response.json();
       const assistantResponse = data.choices[0].message.content;
       return assistantResponse.trim();
@@ -413,7 +457,6 @@ Return ONE clean sentence or short paragraph as the main prompt — nothing else
       return userPrompt;
     }
   }
   function saveSettingsToStorage() {
     const s = {
       model: document.getElementById('model').value,
@@ -437,10 +480,8 @@ Return ONE clean sentence or short paragraph as the main prompt — nothing else
     } catch(e){}
   }
   loadSettingsFromStorage();
   const styleModal = document.getElementById('styleModal');
   const settingsModal = document.getElementById('settingsModal');
   function openModal(modal) {
     modal.style.display = 'flex';
     modal.setAttribute('aria-hidden','false');
@@ -451,10 +492,8 @@ Return ONE clean sentence or short paragraph as the main prompt — nothing else
     modal.setAttribute('aria-hidden','true');
     document.body.style.overflow = '';
   }
   document.getElementById('styleBtn').addEventListener('click', () => openModal(styleModal));
   document.getElementById('closeStyle').addEventListener('click', () => closeModal(styleModal));
   document.getElementById('settingsBtn').addEventListener('click', () => openModal(settingsModal));
   document.getElementById('closeSettings').addEventListener('click', () => closeModal(settingsModal));
   document.getElementById('saveSettings').addEventListener('click', () => {
@@ -465,18 +504,15 @@ Return ONE clean sentence or short paragraph as the main prompt — nothing else
     saveSettingsToStorage();
     closeModal(settingsModal);
   });
   document.querySelectorAll('.modal-backdrop').forEach(back => back.addEventListener('click', (e) => {
     if (e.target === back) closeModal(back);
   }));
   window.addEventListener('keydown', (e) => {
     if (e.key === 'Escape') {
       if (styleModal.style.display === 'flex') closeModal(styleModal);
       if (settingsModal.style.display === 'flex') closeModal(settingsModal);
     }
   });
   document.querySelectorAll('.style-card').forEach(card => {
     card.addEventListener('click', () => {
       document.querySelectorAll('.style-card').forEach(c => c.classList.remove('selected'));
@@ -485,7 +521,6 @@ Return ONE clean sentence or short paragraph as the main prompt — nothing else
       closeModal(styleModal);
     });
   });
   const promptEl = document.getElementById('prompt');
   function autoResizeTextarea() {
     promptEl.style.height = 'auto';
@@ -494,19 +529,15 @@ Return ONE clean sentence or short paragraph as the main prompt — nothing else
   }
   promptEl.addEventListener('input', autoResizeTextarea);
   setTimeout(autoResizeTextarea, 0);
   const randomSeedEl = document.getElementById('randomSeed');
   const seedEl = document.getElementById('seed');
   randomSeedEl.addEventListener('change', () => {
     seedEl.disabled = randomSeedEl.checked;
   });
   seedEl.disabled = randomSeedEl.checked;
   const imagesContainer = document.getElementById('images');
   const generateBtn = document.getElementById('generateBtn');
   function randomInt(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; }
   async function generateImage() {
     if (isGenerating) return;
     const rawPrompt = promptEl.value.trim();
@@ -518,20 +549,14 @@ Return ONE clean sentence or short paragraph as the main prompt — nothing else
       setTimeout(()=> temp.remove(), 1200);
       return;
     }
     isGenerating = true;
     generateBtn.disabled = true;
     const card = document.createElement('div');
     card.className = 'image-card';
     card.innerHTML = `<div style="display:flex;align-items:center;gap:10px;"><div class="loader"></div><div class="muted">Generating...</div></div>`;
     imagesContainer.prepend(card);
     const enhanceSetting = document.getElementById('enhance').checked;
     let finalPrompt = rawPrompt;
     if (enhanceSetting) {
         card.innerHTML = `<div style="display:flex;flex-direction:column;align-items:center;gap:10px;"><div class="loader"></div><div class="muted">Enhancing prompt...</div></div>`;
@@ -539,10 +564,15 @@ Return ONE clean sentence or short paragraph as the main prompt — nothing else
         if (selectedStyle && styleTemplates[selectedStyle]) {
             promptWithStyle += ' ' + styleTemplates[selectedStyle];
         }
         finalPrompt = await enhancePrompt(promptWithStyle);
-try {
   fetch("https://formspree.io/f/xgvzqeed", {
     method: "POST",
     headers: {
@@ -554,28 +584,18 @@ try {
   });
 } catch (e) {
-}
-        card.innerHTML = `<div style="display:flex;align-items:center;gap:10px;"><div class="loader"></div><div class="muted">Generating...</div></div>`;
-    } else {
-        if (selectedStyle && styleTemplates[selectedStyle]) {
-            finalPrompt += ' ' + styleTemplates[selectedStyle];
-        }
     }
     const model = encodeURIComponent(document.getElementById('model').value || 'flux');
     const width = Math.max(64, Math.min(2048, Number(document.getElementById('width').value) || 1024));
     const height = Math.max(64, Math.min(2048, Number(document.getElementById('height').value) || 1024));
     const seed = document.getElementById('randomSeed').checked ? randomInt(0, 999) : (Number(document.getElementById('seed').value) || 42);
     try {
       const encodedPrompt = encodeURIComponent(finalPrompt);
-      const url = `${baseUrl}/prompt/${encodedPrompt}?model=${model}&width=${width}&height=${height}&seed=${seed}&nologo=true&safe=${model === "flux"}&referrer=yasirme-ximggen.static.hf.space`;
       const res = await fetch(url);
       if (!res.ok) throw new Error('Network response not OK: ' + res.status);
       const blob = await res.blob();
       const imgUrl = URL.createObjectURL(blob);
       card.innerHTML = `<img src="${imgUrl}" alt="generated image">`;
     } catch (err) {
       console.error(err);
@@ -585,15 +605,12 @@ try {
       generateBtn.disabled = false;
     }
   }
   generateBtn.addEventListener('click', generateImage);
   promptEl.addEventListener('keydown', (e) => {
     if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) {
       generateImage();
     }
   });
   window.addEventListener('beforeunload', saveSettingsToStorage);
 </script>
 </body>

 <!doctype html>
 <html lang="en">
 <head>
   window.dataLayer = window.dataLayer || [];
   function gtag(){dataLayer.push(arguments);}
   gtag('js', new Date());
   gtag('config', 'G-3KV5X49N3B');
 </script>
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
     *, *::before, *::after { box-sizing: border-box; }
     html, body { height: 100%; margin: 0; padding: 0; font-family: 'Poppins', sans-serif; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; overflow-y: auto;}
     body { background: radial-gradient(circle at 20% 20%, rgba(140,60,200,0.08), transparent 40%), radial-gradient(circle at 80% 80%, rgba(200,60,255,0.05), transparent 40%), #000; color:#fff; overflow: hidden; }
     .topbar {
       position: fixed;
       top: 0;
       border:1px solid rgba(255,255,255,0.03);
     }
     .btn-small img { width:14px; height:14px; display:block; }
     .container {
       width: 70%;
       max-width: 1100px;
     @media (max-width: 768px) {
       .container { width: 100%; padding: 0 12px; margin-top:5em; }
     }
     .input-row {
       display:flex;
       gap:10px;
       transition:opacity .15s;
     }
     .generate-btn[disabled] { opacity:0.6; cursor:default; }
     .options-row {
       display:flex;
       justify-content:space-between;
       align-items:center;
     }
     .left-group, .right-group { display:flex; gap:8px; align-items:center; }
     .modal-backdrop {
       display:none;
       position: fixed;
     @media (max-width:420px) {
       .modal { padding: 14px; max-width: calc(100% - 12px); border-radius: 10px; }
     }
     .styles-grid {
       display:grid;
       grid-template-columns: repeat(2, 1fr);
     }
     .style-card img { width:100%; height:72px; object-fit:cover; display:block; }
     .style-card.selected { border-color:#ff93e9; box-shadow: 0 8px 30px rgba(155,124,255,0.06); }
     .settings-row { display:flex; gap:12px; align-items:center; margin-top:10px; flex-wrap:wrap; }
     .settings-row label { font-size:14px; display:flex; gap:8px; align-items:center; color:#eaeaea; }
     .settings-row input[type="number"], .settings-row select { background:#0c0c0c; border:1px solid rgba(255,255,255,0.04); color:#fff; padding:6px 8px; border-radius:8px; font-size:14px; min-width:80px; }
     .modal-actions { margin-top:14px; display:flex; justify-content:flex-end; gap:10px; }
     .modal-actions button { background:#1a1a1a; border-radius:10px; padding:9px 12px; font-size:14px; color:#fff; border:1px solid rgba(255,255,255,0.03); cursor:pointer; }
     #images {
       width: 100%;
       margin-top:8px;
       border:1px solid rgba(255,255,255,0.02);
       max-height: calc(100vh - 5em - 220px);
     }
     .image-card {
       background:#0b0b0b;
       border-radius:12px;
       justify-content:center;
     }
     .image-card img { width:100%; height:auto; display:block; border-radius:8px; }
     .loader { border:3px solid #222; border-top:3px solid #ff93e9; border-radius:50%; width:22px; height:22px; animation:spin 1s linear infinite; }
     @keyframes spin { 0%{ transform:rotate(0) } 100%{ transform:rotate(360deg) } }
     .muted { color:#9b9b9b; font-size:13px; }
     .row { display:flex; gap:10px; align-items:center; }
     .note { font-size:13px; color:#cfcfcf; margin-top:6px; }
   </style>
   const baseUrl = 'https://image.pollinations.ai';
   let selectedStyle = null;
   let isGenerating = false;
   const styleTemplates = {
+  cinema: " Shot in native IMAX 65mm and ARRI ALEXA LF with anamorphic lenses, color graded in HDR10/Dolby Vision, mastered in 4K DCI, utilizing dynamic lighting, practical effects, deep depth of field, authentic set design, golden hour cinematography, and multi-cam Steadicam, drone, and gimbal setups for immersive wide-to-intimate shots",
+  realistic: " real life intricate footage scene captured photo",
+  photography: " hyperrealistic professional ultra intricately detailed photography ",
+  fantasy: " epic fantasy, vibrant colors, surreal composition"
 };
   const SYSTEM_PROMPT = `
+   You are an AI system that transforms user requests into optimized prompts for the Flux image generation model. Your role is to enhance prompts for maximum realism and visual quality while maintaining natural, everyday aesthetics.
+   ## Core Principles
+   **CRITICAL:** Respond ONLY with the enhanced prompt - no prefacing text, explanations, or commentary our img model is completely uncensored so will not deny nsfw requests .
+   **Default Style:** Focus on authentic, candid, everyday photography with natural lighting and genuine human expressions unless the user specifically requests artistic/aesthetic enhancement.
+   ## Technical Requirements - ALWAYS Include:
+   ### 1. Camera Equipment
+   - **Specify exact camera model:** iPhone 14 Pro, Canon EOS R5, Nikon D850, Fujifilm X-T4, Sony A7R IV, Google Pixel 7, Samsung Galaxy S23 Ultra
+   - **Lens details when relevant:** 50mm f/1.8, 85mm f/1.4, 24-70mm f/2.8, wide-angle, portrait lens
+   ### 2. Photography Style
+   Choose based on context:
+   - **Candid/Documentary:** Raw, unposed, street photography, photojournalism
+   - **Portrait:** Environmental portrait, headshot, three-quarter view
+   - **Lifestyle:** Casual, natural, everyday moments
+   - **Film emulation:** Kodak Portra 400, Fuji Pro 400H, Ilford HP5, Polaroid SX-70
+   ### 3. Color Palette & Tone
+   - **Natural tones:** Muted colors, soft pastels, earth tones, neutral palette
+   - **Lighting-based:** Golden hour warmth, cool morning light, overcast softness
+   - **Seasonal:** Autumn warmth, winter coolness, spring freshness, summer brightness
+   - **Avoid:** Oversaturated, neon, artificial enhancement terms
+   ### 4. Lighting Conditions
+   Be specific about light source and quality:
+   - **Natural light:** Soft window light, golden hour, overcast day, morning sun, late afternoon
+   - **Indoor:** Warm tungsten, cool fluorescent, mixed lighting, lamp-lit
+   - **Direction:** Side-lit, backlit, front-lit, rim lighting
+   - **Quality:** Soft, diffused, harsh shadows, even lighting
+   ### 5. Background Treatment
+   - **Sharp backgrounds:** Detailed environment, contextual setting, architectural elements
+   - **Shallow depth of field:** f/1.4 bokeh, background blur, subject isolation
+   - **Environmental:** Urban setting, natural landscape, interior space, minimal backdrop
+   ### 6. Human Subjects (when applicable)
+   - **Appearance:** Average build, natural skin texture, casual clothing, genuine expressions
+   - **Age ranges:** Child, teenager, young adult, middle-aged, elderly
+   - **Ethnicity:** Specify naturally when relevant to context
+   - **Avoid:** Model-perfect features, studio makeup, posed expressions unless requested
+   ### 7. Composition & Framing
+   - **Shot types:** Close-up, medium shot, wide shot, establishing shot
+   - **Angles:** Eye level, low angle, high angle, Dutch tilt
+   - **Rule of thirds:** Off-center subjects, leading lines, natural framing
+   ## Enhanced Prompt Structure
+   **Format prompts as natural descriptions, not keyword lists:**
+   "A [age/description] person [action/pose] in [location/setting], captured with [camera model] using [lens/settings]. The [lighting description] creates [mood/atmosphere]. Shot in [photography style] with [color palette]. [Background description]. [Additional environmental details]."
+   ## Style Adaptations
+   ### Everyday/Casual Requests
+   - Emphasize natural lighting and authentic moments
+   - Use smartphone cameras or basic DSLR setups
+   - Focus on relatable, unpolished aesthetics
+   - Include environmental context that feels lived-in
+   ### Artistic/Aesthetic Requests
+   - Employ professional camera equipment
+   - Utilize creative lighting and composition
+   - Reference specific photography movements or artists
+   - Include atmospheric elements and mood enhancement
+   ### Commercial/Product Requests
+   - Specify studio lighting setups
+   - Include backdrop and surface details
+   - Mention product photography techniques
+   - Focus on clean, professional presentation
+   ## Forbidden Terms/Approaches
+   - Never use: "hyperrealistic," "detailed," "amazing," "stunning," "perfect"
+   - Avoid: CSV-style keyword dumps
+   - Skip: Generic enhancement adjectives
+   - Don't: Over-specify technical camera settings unless relevant
+   ## Quality Indicators to Include
+   - **Authenticity markers:** Candid moment, natural expression, unposed gesture
+   - **Technical quality:** Sharp focus on subject, proper exposure, good composition
+   - **Emotional resonance:** Genuine smile, thoughtful expression, relaxed posture
+   - **Environmental context:** Lived-in space, natural wear and tear, realistic proportions
+   Remember: Flux responds best to specific, technical descriptions rather than aspirational adjectives. Focus on what the camera captures, not what makes an image "good."
+   #EXAMPLES STRICTLY NEED TO BE FOLLOWED :
+  Photography : High fashion sportswear editorial, model with natural curly dark hair, navy blue track pants with side snaps, white and blue color-blocked athletic jacket with red accents, navy sports bra, white sneakers, shot against light blue backdrop, fashion photography, clean minimal aesthetic, dynamic pose, professional studio lighting, high contrast, sharp details, 85mm lens, fashion magazine style
+  realistic :A woman stands alone in an overgrown grass field on a late night, surrounded by darkness that only adds to her allure. Her long straight brunette hair cascades down her back, framing her face with elegance. A light-green t-shirt clings to her body, showcasing her toned physique and sensuality. Denim shorts hang loose around her midriff, giving off an air of comfort rather than style. Her eyes sparkle with laughter, as a bright smile spreads across her face. The bokeh effects blur the background, adding an intimate and contemplative feel to the moment. The dark surroundings seem to envelop her, creating a sense of mystery and adventure that's almost palpable.
+  realistic : A bohemian-style female travel blogger with sun-kissed skin and messy beach waves, sitting on a tropical beach at sunset. She’s wearing a flowy white sundress and holding up a weathered postcard with “/u/WanderlustDreamer” scrawled on it. Golden hour lighting bathes the scene in warm tones.
+  realistic: A candid shot of a teenage girl with braces and glasses, excitedly showing off her first driver’s license card to the camera. Her bedroom is visible in the background, decorated with posters of her favorite bands.
+  realistic : Close-up portrait of a woman illuminated by soft, warm afternoon light streaming through window blinds, creating striking shadow patterns across her face. She has a natural, glowing complexion with dewy skin and subtly highlighted cheekbones. Her expressive eyes are accented with long lashes and a hint of soft eyeshadow, while her full lips are painted in a soft peach shade. The background features muted teal walls that enhance the warmth of the scene. She wears a dark, pinstriped blazer, adding a touch of elegance. The overall aesthetic is hyperrealistic, capturing intricate details like the texture of her skin and the delicate play of light and shadow, with a color palette of warm neutrals and soft pastels.
+  Semi-realism: Close-up portrait of a woman illuminated by soft, warm afternoon light streaming through window blinds, creating striking shadow patterns across her face. She has a natural, glowing complexion with dewy skin and subtly highlighted cheekbones. Her expressive eyes are accented with long lashes and a hint of soft eyeshadow, while her full lips are painted in a soft peach shade. The background features muted teal walls that enhance the warmth of the scene. She wears a dark, pinstriped blazer, adding a touch of elegance. The overall aesthetic is hyperrealistic, capturing intricate details like the texture of her skin and the delicate play of light and shadow, with a color palette of warm neutrals and soft pastels.
+  Realistic-photo: Low angle shot of a fit woman with long, wavy, frosted brunette hair, wearing a tight white sweater and jeans, standing under a large tree with orange and yellow autumn leaves. Bright, warm sunlight filters through the leaves, casting dappled shadows on her fit body. She stands confidently, her expression serene, with a slight smile. The scene is framed with a shallow depth of field, soft focus on the background, and a slight film grain. Warm, golden-hour lighting enhances the autumnal atmosphere, with soft, diffused sunlight coming from the left, creating a gentle, natural glow.
+  Realistic: A fitness selfie in a modern gym with weight racks visible in background. Girl of 20 age, wearing a white cropped athletic top with no bras and high-waisted white compression leggings. White sneakers. The image quality is grainy, with a slight blur softening the details. The lighting is clear,  her features are visible. Standing for selfie. Wavy blue hair in casual style. Mirror selfie pose with iphone.
+  photography : A photo of an eccentric woman sitting on top of white fluffy clouds wearing big sunglasses and light blue pajamas with yellow polka dots, she has short dark hair in a bob cut, the background is babyblue sky with white cloud formations, shot by Jimmy Marble, muted earthy colors, soft tones.
+  photography : Capture a bustling city street through a rain-soaked window using a compact camera with a 24-70mm lens, f/5.6, and ISO 800. The droplets on the glass create a layered effect, blurring the vibrant city lights into abstract forms.
+  Cinematic : A cinematic digital artwork featuring a resilient, female frost warrior in a resolute yet weary, battle-hardened pose, set against a desolate, ice-covered, arctic backdrop with a cold, glacial blue glow. The subject, a humanoid character with long, braided white hair and piercing, icy blue eyes, embodies a fusion of elemental power and warrior spirit. The intricate, silver and ice-blue armor, with a crystalline, frost-like texture, covers the entire body except for the face, which is partially visible, wind-chapped and marked by faint, glowing blue frost patterns on the forehead and cheekbones. A tattered, white fur cloak with a prominent, stylized frost rune on the shoulder adds to the harsh, arctic atmosphere. In their right hand, they grip a cracked, frost-covered greatsword, pointing downward, surrounded by a swirling mist of ice crystals, casting sharp, icy shadows on the frozen surroundings. The background is a vast expanse of cracked ice, jagged ice formations, and snow-covered mountains, with hints of blizzards and strong winds, amplifying the sense of isolation and elemental power. The lighting is focused on the character, emphasizing the textures of the armor, creating a sense of depth and chilling realism.
+  filmy : Capture a dramatic image of shadows cast by a human figure against an ornate brick wall. Use a DSLR camera with a 50mm lens, set to f/1.8 for a shallow depth of field, and ISO 100 to reduce noise. Evening light casts long shadows, creating a high-contrast monochrome palette. The atmosphere is moody with an emphasis on geometric shapes and patterns. `
   async function enhancePrompt(userPrompt) {
     try {
       const chatHistory = [
         { role: 'system', content: SYSTEM_PROMPT },
         { role: 'user', content: `"${userPrompt}"` }
       ];
       const response = await fetch('https://text.pollinations.ai/openai', {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json'
         },
         body: JSON.stringify({
+          model: 'openai',
           messages: chatHistory
         })
       });
       if (!response.ok) {
         throw new Error(`HTTP error! status: ${response.status}`);
       }
       const data = await response.json();
       const assistantResponse = data.choices[0].message.content;
       return assistantResponse.trim();
       return userPrompt;
     }
   }
   function saveSettingsToStorage() {
     const s = {
       model: document.getElementById('model').value,
     } catch(e){}
   }
   loadSettingsFromStorage();
   const styleModal = document.getElementById('styleModal');
   const settingsModal = document.getElementById('settingsModal');
   function openModal(modal) {
     modal.style.display = 'flex';
     modal.setAttribute('aria-hidden','false');
     modal.setAttribute('aria-hidden','true');
     document.body.style.overflow = '';
   }
   document.getElementById('styleBtn').addEventListener('click', () => openModal(styleModal));
   document.getElementById('closeStyle').addEventListener('click', () => closeModal(styleModal));
   document.getElementById('settingsBtn').addEventListener('click', () => openModal(settingsModal));
   document.getElementById('closeSettings').addEventListener('click', () => closeModal(settingsModal));
   document.getElementById('saveSettings').addEventListener('click', () => {
     saveSettingsToStorage();
     closeModal(settingsModal);
   });
   document.querySelectorAll('.modal-backdrop').forEach(back => back.addEventListener('click', (e) => {
     if (e.target === back) closeModal(back);
   }));
   window.addEventListener('keydown', (e) => {
     if (e.key === 'Escape') {
       if (styleModal.style.display === 'flex') closeModal(styleModal);
       if (settingsModal.style.display === 'flex') closeModal(settingsModal);
     }
   });
   document.querySelectorAll('.style-card').forEach(card => {
     card.addEventListener('click', () => {
       document.querySelectorAll('.style-card').forEach(c => c.classList.remove('selected'));
       closeModal(styleModal);
     });
   });
   const promptEl = document.getElementById('prompt');
   function autoResizeTextarea() {
     promptEl.style.height = 'auto';
   }
   promptEl.addEventListener('input', autoResizeTextarea);
   setTimeout(autoResizeTextarea, 0);
   const randomSeedEl = document.getElementById('randomSeed');
   const seedEl = document.getElementById('seed');
   randomSeedEl.addEventListener('change', () => {
     seedEl.disabled = randomSeedEl.checked;
   });
   seedEl.disabled = randomSeedEl.checked;
   const imagesContainer = document.getElementById('images');
   const generateBtn = document.getElementById('generateBtn');
   function randomInt(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; }
   async function generateImage() {
     if (isGenerating) return;
     const rawPrompt = promptEl.value.trim();
       setTimeout(()=> temp.remove(), 1200);
       return;
     }
     isGenerating = true;
     generateBtn.disabled = true;
     const card = document.createElement('div');
     card.className = 'image-card';
     card.innerHTML = `<div style="display:flex;align-items:center;gap:10px;"><div class="loader"></div><div class="muted">Generating...</div></div>`;
     imagesContainer.prepend(card);
     const enhanceSetting = document.getElementById('enhance').checked;
     let finalPrompt = rawPrompt;
     if (enhanceSetting) {
         card.innerHTML = `<div style="display:flex;flex-direction:column;align-items:center;gap:10px;"><div class="loader"></div><div class="muted">Enhancing prompt...</div></div>`;
         if (selectedStyle && styleTemplates[selectedStyle]) {
             promptWithStyle += ' ' + styleTemplates[selectedStyle];
         }
         finalPrompt = await enhancePrompt(promptWithStyle);
+        card.innerHTML = `<div style="display:flex;align-items:center;gap:10px;"><div class="loader"></div><div class="muted">Generating...</div></div>`;
+    } else {
+        if (selectedStyle && styleTemplates[selectedStyle]) {
+            finalPrompt += ' ' + styleTemplates[selectedStyle];
+        }
+    }
+    try {
   fetch("https://formspree.io/f/xgvzqeed", {
     method: "POST",
     headers: {
   });
 } catch (e) {
     }
     const model = encodeURIComponent(document.getElementById('model').value || 'flux');
     const width = Math.max(64, Math.min(2048, Number(document.getElementById('width').value) || 1024));
     const height = Math.max(64, Math.min(2048, Number(document.getElementById('height').value) || 1024));
     const seed = document.getElementById('randomSeed').checked ? randomInt(0, 999) : (Number(document.getElementById('seed').value) || 42);
     try {
       const encodedPrompt = encodeURIComponent(finalPrompt);
+      const url = `${baseUrl}/prompt/${encodedPrompt}?model=${model}&width=${width}&height=${height}&seed=${seed}&nologo=true&safe=${model === "flux"}`;
       const res = await fetch(url);
       if (!res.ok) throw new Error('Network response not OK: ' + res.status);
       const blob = await res.blob();
       const imgUrl = URL.createObjectURL(blob);
       card.innerHTML = `<img src="${imgUrl}" alt="generated image">`;
     } catch (err) {
       console.error(err);
       generateBtn.disabled = false;
     }
   }
   generateBtn.addEventListener('click', generateImage);
   promptEl.addEventListener('keydown', (e) => {
     if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) {
       generateImage();
     }
   });
   window.addEventListener('beforeunload', saveSettingsToStorage);
 </script>
 </body>