Spaces:

Aleksmorshen
/

Testreact

Running

App Files Files Community

Aleksmorshen commited on 21 days ago

Commit

9434d7b

verified ·

1 Parent(s): 465aa0f

Update index.html

Browse files

Files changed (1) hide show

index.html +225 -7

index.html CHANGED Viewed

@@ -3,7 +3,7 @@
 <head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>Synkris Look 7</title>
 <style>
 :root {
     --bg: #000000;
@@ -79,6 +79,7 @@ p.subtitle {
     border-radius: 8px;
     transition: all 0.3s ease;
     text-transform: uppercase;
 }
 .mode-btn.active {
@@ -224,6 +225,7 @@ select option {
     <div class="mode-selector">
         <button id="modeModelBtn" class="mode-btn active" onclick="switchMode('model')">Фото на модели</button>
         <button id="modeObjectBtn" class="mode-btn" onclick="switchMode('object')">Предметное фото</button>
     </div>
@@ -307,7 +309,7 @@ select option {
                         <option value="walking towards camera">Идет на камеру</option>
                         <option value="sitting relaxed">Сидит расслабленно</option>
                         <option value="leaning against a wall">Оперевшись о стену</option>
-                        <option value="dynamic action pose">Динамичная поза</option>
                     </select>
                 </div>
                 <!-- Row 5 - COMPOSITION -->
@@ -354,7 +356,7 @@ select option {
                     </select>
                 </div>
-                <!-- NEW ROW 7 - LOCATION -->
                 <div class="form-group full-width">
                     <label for="location">Локация</label>
                     <select id="location">
@@ -377,6 +379,173 @@ select option {
                 </div>
             </div>
             <!-- === OBJECT PHOTOGRAPHY MODE === -->
             <div id="objectMode" class="form-mode">
                 <div class="form-group full-width">
@@ -448,15 +617,27 @@ select option {
 <script>
 let currentMode = 'model';
 function switchMode(mode) {
     currentMode = mode;
     document.getElementById('modelMode').classList.toggle('active', mode === 'model');
     document.getElementById('objectMode').classList.toggle('active', mode === 'object');
     document.getElementById('modeModelBtn').classList.toggle('active', mode === 'model');
     document.getElementById('modeObjectBtn').classList.toggle('active', mode === 'object');
 }
 function autoAdjustDefaults() {
     if (currentMode !== 'model') return;
     const gender = document.getElementById('gender').value;
@@ -483,7 +664,6 @@ async function processAndOpen() {
     const originalText = btn.innerHTML;
     let fullPrompt = '';
-    // Этот негативный промпт можно вставлять в соответствующее поле на сайте, если оно есть
     const negative_prompt = "cropped, watermark, text, 3d render, cartoon, anime, plastic look, doll, artificial, blurry, distorted, malformed, ugly, disfigured, amputation, ugly, gross, disgusting";
     if (currentMode === 'model') {
@@ -498,11 +678,10 @@ async function processAndOpen() {
         const emotion = document.getElementById('emotion').value;
         const pose = document.getElementById('pose').value;
         const details = document.getElementById('model_details').value || "in a casual stylish outfit";
-        const location = document.getElementById('location').value; // <-- Получаем значение локации
         const light = document.getElementById('light').value;
         const camera = document.getElementById('camera').value;
-        // Собираем сцену из локации и деталей
         const scene = `${details}, ${location}`;
         fullPrompt = `style:: ${style}.
@@ -512,6 +691,45 @@ model_details:: physique is ${bodyType}, ${hairColor} ${hairstyle}, face express
 scene:: ${scene}.
 technical:: professional photography, ${light}, shot on ${camera}, 8k, sharp focus, hyper-detailed, realistic skin texture with pores, masterpiece.`;
     } else { // Object mode
         const objectName = document.getElementById('object_name').value || "a product";
         const objectStyle = document.getElementById('object_style').value;
@@ -534,7 +752,6 @@ composition:: ${objectComposition}.
 technical:: commercial studio quality, ${objectLighting}, 8k resolution, sharp focus, ultra-realistic, masterpiece.`;
     }
-    // Убираем лишние пробелы и переносы строк, делая промпт чище
     const cleanPrompt = fullPrompt.replace(/\s+/g, ' ').trim();
     try {
@@ -561,6 +778,7 @@ technical:: commercial studio quality, ${objectLighting}, 8k resolution, sharp f
 document.addEventListener('DOMContentLoaded', () => {
     switchMode('model');
     autoAdjustDefaults();
 });
 </script>

 <head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Synkris Look 8</title>
 <style>
 :root {
     --bg: #000000;
     border-radius: 8px;
     transition: all 0.3s ease;
     text-transform: uppercase;
+    white-space: nowrap;
 }
 .mode-btn.active {
     <div class="mode-selector">
         <button id="modeModelBtn" class="mode-btn active" onclick="switchMode('model')">Фото на модели</button>
+        <button id="modeChildBtn" class="mode-btn" onclick="switchMode('child')">Фото на модели (дети)</button>
         <button id="modeObjectBtn" class="mode-btn" onclick="switchMode('object')">Предметное фото</button>
     </div>
                         <option value="walking towards camera">Идет на камеру</option>
                         <option value="sitting relaxed">Сидит расслабленно</option>
                         <option value="leaning against a wall">Оперевшись о стену</option>
+                        <option value="dynamic action pose" selected>Динамичная поза</option>
                     </select>
                 </div>
                 <!-- Row 5 - COMPOSITION -->
                     </select>
                 </div>
+                <!-- Row 7 - LOCATION -->
                 <div class="form-group full-width">
                     <label for="location">Локация</label>
                     <select id="location">
                 </div>
             </div>
+            <!-- === CHILD MODEL PHOTOGRAPHY MODE === -->
+            <div id="childModelMode" class="form-mode">
+                <div class="full-width">
+                    <div class="mode-selector">
+                        <button id="modeNewbornBtn" class="mode-btn active" onclick="switchChildMode('newborn')">Новорожденные (0-6 мес)</button>
+                        <button id="modeOlderChildBtn" class="mode-btn" onclick="switchChildMode('older')">Дети (1-17 лет)</button>
+                    </div>
+                </div>
+                <!-- Newborn Sub-Mode -->
+                <div id="newbornMode" class="form-mode active">
+                    <div class="form-group">
+                        <label for="newborn_age">Возраст</label>
+                        <select id="newborn_age">
+                            <option value="newborn baby, 0-3 months old">0-3 месяца</option>
+                            <option value="baby, 3-6 months old">3-6 месяцев</option>
+                        </select>
+                    </div>
+                    <div class="form-group">
+                        <label for="newborn_emotion">Эмоция/Состояние</label>
+                        <select id="newborn_emotion">
+                            <option value="sleeping peacefully">Сладко спит</option>
+                            <option value="calm and serene">Спокойное</option>
+                            <option value="a gentle, slight smile">Легкая улыбка</option>
+                            <option value="curious look">Любопытный взгляд</option>
+                        </select>
+                    </div>
+                    <div class="form-group full-width">
+                        <label for="newborn_pose">Поза</label>
+                        <select id="newborn_pose">
+                            <option value="lying on its back, wrapped in a soft blanket">Лежит на спине в одеяле</option>
+                            <option value="in a cute tummy time pose">Лежит на животике</option>
+                            <option value="held gently in parents' hands (hands only visible)">В руках родителей (видны только руки)</option>
+                            <option value="sleeping in a cute prop like a basket">Спит в корзинке</option>
+                        </select>
+                    </div>
+                    <div class="form-group full-width">
+                        <label for="newborn_details">Одежда и Детали</label>
+                        <textarea id="newborn_details" placeholder="Пример: в милой вязаной шапочке с ушками, на бежевом фоне"></textarea>
+                    </div>
+                    <div class="form-group">
+                        <label for="child_shotType">Ракурс/План</label>
+                        <select id="child_shotType">
+                             <option value="Close-up on face">Крупный план лица</option>
+                             <option value="Medium shot">Средний план</option>
+                             <option value="Full body shot from above">В полный рост (вид сверху)</option>
+                        </select>
+                    </div>
+                    <div class="form-group">
+                        <label for="child_light">Свет</label>
+                        <select id="child_light">
+                            <option value="soft, natural window light">Мягкий дневной свет</option>
+                            <option value="warm, gentle studio light">Теплый студийный</option>
+                            <option value="dreamy backlight">Сказочный контровой</option>
+                        </select>
+                    </div>
+                     <div class="form-group full-width">
+                        <label for="child_style">Эстетика</label>
+                        <select id="child_style">
+                            <option value="Bright and Airy photography">Светлая и воздушная</option>
+                            <option value="Cozy and warm mood">Уютная и теплая</option>
+                            <option value="Minimalistic and clean">Минимализм</option>
+                            <option value="Vintage film look">Пленка (винтаж)</option>
+                        </select>
+                    </div>
+                </div>
+                <!-- Older Child Sub-Mode -->
+                <div id="olderChildMode" class="form-mode">
+                     <div class="form-group">
+                        <label for="older_gender">Пол</label>
+                        <select id="older_gender">
+                            <option value="girl">Девочка</option>
+                            <option value="boy">Мальчик</option>
+                        </select>
+                    </div>
+                    <div class="form-group">
+                        <label for="older_age">Возраст</label>
+                        <select id="older_age">
+                            <option value="1-2 years old toddler">1-2 года</option>
+                            <option value="3-5 years old child">3-5 лет</option>
+                            <option value="6-9 years old child">6-9 лет</option>
+                            <option value="10-13 years old pre-teen">10-13 лет</option>
+                            <option value="14-17 years old teenager">14-17 лет</option>
+                        </select>
+                    </div>
+                    <div class="form-group">
+                        <label for="older_nationality">Внешность/Этнос</label>
+                        <select id="older_nationality">
+                             <option value="Eastern European">Восточная Европа</option>
+                             <option value="Northern European">Скандинавская</option>
+                             <option value="Asian">Азиатская</option>
+                             <option value="Latin American">Латиноамериканская</option>
+                             <option value="Mixed Race">Смешанная</option>
+                        </select>
+                    </div>
+                    <div class="form-group">
+                        <label for="older_emotion">Эмоция/Выражение лица</label>
+                        <select id="older_emotion">
+                            <option value="happy and laughing">Счастливый, смеется</option>
+                            <option value="curious and exploring">Любопытный</option>
+                            <option value="thoughtful and calm">Задумчивый</option>
+                            <option value="energetic and playful">Игривый</option>
+                        </select>
+                    </div>
+                    <div class="form-group full-width">
+                        <label for="older_pose">Поза</label>
+                        <select id="older_pose">
+                             <option value="running in a field">Бежит по полю</option>
+                             <option value="sitting and playing with toys">Сидит, играя с игрушками</option>
+                             <option value="hugging a pet">Обнимает питомца</option>
+                             <option value="looking confidently at the camera">Уверенно смотрит в камеру</option>
+                        </select>
+                    </div>
+                     <div class="form-group full-width">
+                        <label for="older_details">Одежда и Детали</label>
+                        <textarea id="older_details" placeholder="Пример: в джинсовом комбинезоне и желтой футболке, с веснушками на лице"></textarea>
+                    </div>
+                    <!-- Copied Technical Fields -->
+                    <div class="form-group">
+                        <label for="older_shotType">Ракурс/План</label>
+                        <select id="older_shotType">
+                            <option value="Full body shot">В полный рост</option>
+                            <option value="Medium shot, waist up">По пояс</option>
+                            <option value="Portrait shot">Портрет</option>
+                            <option value="Action shot">В движении</option>
+                        </select>
+                    </div>
+                    <div class="form-group">
+                        <label for="older_light">Свет</label>
+                        <select id="older_light">
+                            <option value="natural morning light">Естественный утренний</option>
+                            <option value="golden hour sunset light">Закатный "золотой час"</option>
+                            <option value="cinematic lighting">Кинематографичный</option>
+                            <option value="volumetric studio lighting">Объемный студийный</option>
+                        </select>
+                    </div>
+                    <div class="form-group">
+                        <label for="older_style">Эстетика</label>
+                        <select id="older_style">
+                            <option value="Raw Candid Photography">Живое фото (Raw)</option>
+                            <option value="Cinematic Movie Still">Кадр из фильма</option>
+                            <option value="Street Style Photo">Уличный стиль</option>
+                             <option value="Vintage Analog Film">Пленка (Vintage)</option>
+                        </select>
+                    </div>
+                    <div class="form-group">
+                        <label for="older_camera">Камера/Объектив</label>
+                        <select id="older_camera">
+                            <option value="Sony A7III, 35mm F1.4 lens">Sony 35mm (Универсал)</option>
+                            <option value="Canon EOS R5, 85mm F1.2 lens">Canon 85mm (Боке)</option>
+                             <option value="shot on 35mm film, Kodak Portra 400">Пленка Kodak Portra</option>
+                        </select>
+                    </div>
+                     <div class="form-group full-width">
+                        <label for="older_location">Локация</label>
+                        <select id="older_location">
+                            <option value="in a sunny park with green grass">Солнечный парк</option>
+                            <option value="on a sandy beach building sandcastles">Пляж</option>
+                            <option value="in a cozy, brightly lit playroom">Уютная игровая комната</option>
+                            <option value="on a city street during a walk">Городская улица</option>
+                            <option value="in a magical forest">Сказочный лес</option>
+                        </select>
+                    </div>
+                </div>
+            </div>
             <!-- === OBJECT PHOTOGRAPHY MODE === -->
             <div id="objectMode" class="form-mode">
                 <div class="form-group full-width">
 <script>
 let currentMode = 'model';
+let currentChildMode = 'newborn';
 function switchMode(mode) {
     currentMode = mode;
     document.getElementById('modelMode').classList.toggle('active', mode === 'model');
+    document.getElementById('childModelMode').classList.toggle('active', mode === 'child');
     document.getElementById('objectMode').classList.toggle('active', mode === 'object');
     document.getElementById('modeModelBtn').classList.toggle('active', mode === 'model');
+    document.getElementById('modeChildBtn').classList.toggle('active', mode === 'child');
     document.getElementById('modeObjectBtn').classList.toggle('active', mode === 'object');
 }
+function switchChildMode(childMode) {
+    currentChildMode = childMode;
+    document.getElementById('newbornMode').classList.toggle('active', childMode === 'newborn');
+    document.getElementById('olderChildMode').classList.toggle('active', childMode === 'older');
+    document.getElementById('modeNewbornBtn').classList.toggle('active', childMode === 'newborn');
+    document.getElementById('modeOlderChildBtn').classList.toggle('active', childMode === 'older');
+}
 function autoAdjustDefaults() {
     if (currentMode !== 'model') return;
     const gender = document.getElementById('gender').value;
     const originalText = btn.innerHTML;
     let fullPrompt = '';
     const negative_prompt = "cropped, watermark, text, 3d render, cartoon, anime, plastic look, doll, artificial, blurry, distorted, malformed, ugly, disfigured, amputation, ugly, gross, disgusting";
     if (currentMode === 'model') {
         const emotion = document.getElementById('emotion').value;
         const pose = document.getElementById('pose').value;
         const details = document.getElementById('model_details').value || "in a casual stylish outfit";
+        const location = document.getElementById('location').value;
         const light = document.getElementById('light').value;
         const camera = document.getElementById('camera').value;
         const scene = `${details}, ${location}`;
         fullPrompt = `style:: ${style}.
 scene:: ${scene}.
 technical:: professional photography, ${light}, shot on ${camera}, 8k, sharp focus, hyper-detailed, realistic skin texture with pores, masterpiece.`;
+    } else if (currentMode === 'child') {
+        if (currentChildMode === 'newborn') {
+            const style = document.getElementById('child_style').value;
+            const shotType = document.getElementById('child_shotType').value;
+            const age = document.getElementById('newborn_age').value;
+            const emotion = document.getElementById('newborn_emotion').value;
+            const pose = document.getElementById('newborn_pose').value;
+            const details = document.getElementById('newborn_details').value || "wearing a cute outfit";
+            const light = document.getElementById('child_light').value;
+            fullPrompt = `style:: ${style}, tender and heartwarming.
+composition:: ${shotType}.
+subject:: A photorealistic portrait of a cute ${age}.
+details:: Expression is ${emotion}, ${pose}, ${details}.
+technical:: professional newborn photography, ${light}, shot on Canon EOS R5, 85mm F1.2 lens, 8k, sharp focus on eyes, hyper-detailed, realistic soft baby skin texture, masterpiece.`;
+        } else { // Older child
+            const style = document.getElementById('older_style').value;
+            const shotType = document.getElementById('older_shotType').value;
+            const age = document.getElementById('older_age').value;
+            const gender = document.getElementById('older_gender').value;
+            const nationality = document.getElementById('older_nationality').value;
+            const emotion = document.getElementById('older_emotion').value;
+            const pose = document.getElementById('older_pose').value;
+            const details = document.getElementById('older_details').value || "in a stylish casual outfit";
+            const location = document.getElementById('older_location').value;
+            const light = document.getElementById('older_light').value;
+            const camera = document.getElementById('older_camera').value;
+            const scene = `${details}, ${location}`;
+            fullPrompt = `style:: ${style}.
+composition:: ${shotType}.
+subject:: A photorealistic portrait of a ${age} ${nationality} ${gender}.
+details:: Face expression is ${emotion}, pose is ${pose}.
+scene:: ${scene}.
+technical:: professional photography, ${light}, shot on ${camera}, 8k, sharp focus, hyper-detailed, realistic skin texture, masterpiece.`;
+        }
     } else { // Object mode
         const objectName = document.getElementById('object_name').value || "a product";
         const objectStyle = document.getElementById('object_style').value;
 technical:: commercial studio quality, ${objectLighting}, 8k resolution, sharp focus, ultra-realistic, masterpiece.`;
     }
     const cleanPrompt = fullPrompt.replace(/\s+/g, ' ').trim();
     try {
 document.addEventListener('DOMContentLoaded', () => {
     switchMode('model');
     autoAdjustDefaults();
+    switchChildMode('newborn');
 });
 </script>