Spaces:

00Boobs00
/

wanvision-studio

Configuration error

App Files Files Community

00Boobs00 commited on 17 days ago

Commit

82229f9

verified ·

1 Parent(s): 6757240

Upscale this by automatically adding the trigger word/phrase to the prompt and refactoring it with in-depth optimization specific to the base models and LORA models we are using here.

Browse files

Files changed (3) hide show

components/lora-selector.js +32 -8
index.html +1 -1
script.js +58 -2

components/lora-selector.js CHANGED Viewed

@@ -93,16 +93,18 @@ class LoraSelector extends HTMLElement {
       // Clear loading option
       selectElement.innerHTML = '<option value="">Select a LoRA model</option>';
       // Add each LoRA model as an option
       safetensorsFiles.forEach(file => {
         const option = document.createElement('option');
-        option.value = file.rfilename;
-        option.textContent = file.rfilename.replace('.safetensors', '');
         selectElement.appendChild(option);
       });
-      // Dispatch event when models are loaded
       this.dispatchEvent(new CustomEvent('loras-loaded', {
         detail: { models: safetensorsFiles },
         bubbles: true
@@ -118,13 +120,35 @@ class LoraSelector extends HTMLElement {
     }
   }
   get selectedValue() {
-    return this.shadowRoot.getElementById('loraSelect').value;
   }
   set selectedValue(value) {
-    this.shadowRoot.getElementById('loraSelect').value = value;
   }
 }
-customElements.define('lora-selector', LoraSelector);

       // Clear loading option
       selectElement.innerHTML = '<option value="">Select a LoRA model</option>';
       // Add each LoRA model as an option
       safetensorsFiles.forEach(file => {
         const option = document.createElement('option');
+        const modelName = file.rfilename.replace('.safetensors', '');
+        option.value = JSON.stringify({
+          filename: file.rfilename,
+          trigger: this.getTriggerWord(modelName)
+        });
+        option.textContent = modelName;
         selectElement.appendChild(option);
       });
+// Dispatch event when models are loaded
       this.dispatchEvent(new CustomEvent('loras-loaded', {
         detail: { models: safetensorsFiles },
         bubbles: true
     }
   }
+  getTriggerWord(modelName) {
+    const triggers = {
+      'Wan2.2-Disco-Diffusion': 'disco style',
+      'Wan2.2-Futuristic-City': 'futuristic cityscape',
+      'Wan2.2-Anime-Art': 'anime art style',
+      'Wan2.2-Cyberpunk': 'cyberpunk aesthetic',
+      'Wan2.2-Fantasy': 'fantasy illustration',
+      'Wan2.2-Photorealistic': 'photorealistic',
+      'Wan2.2-Watercolor': 'watercolor painting',
+      'Wan2.2-Oil-Painting': 'oil painting',
+      'Wan2.2-Sketch': 'pencil sketch',
+      'Wan2.2-Impressionist': 'impressionist painting'
+    };
+    return triggers[modelName] || 'enhanced style';
+  }
   get selectedValue() {
+    const selected = this.shadowRoot.getElementById('loraSelect').value;
+    try {
+      return JSON.parse(selected);
+    } catch {
+      return { filename: '', trigger: '' };
+    }
   }
   set selectedValue(value) {
+    this.shadowRoot.getElementById('loraSelect').value = JSON.stringify(value);
   }
 }
+customElements.define('lora-selector', LoraSelector);

index.html CHANGED Viewed

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">

 <!DOCTYPE html>
+<html lang="en">upsca
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">

script.js CHANGED Viewed

@@ -44,7 +44,6 @@ document.addEventListener('DOMContentLoaded', function() {
     });
     // Handle LoRA selection
     const loraSelector = document.getElementById('loraSelector');
     // Generate button interaction
     const generateBtn = document.querySelector('button.bg-gradient-to-r');
     generateBtn.addEventListener('click', function() {
@@ -65,6 +64,13 @@ document.addEventListener('DOMContentLoaded', function() {
         const selectedLora = loraSelector.selectedValue;
         console.log('Selected LoRA:', selectedLora);
         // Simulate processing time
         setTimeout(() => {
             // Reset button
@@ -81,4 +87,54 @@ document.addEventListener('DOMContentLoaded', function() {
             `;
         }, 3000);
     });
-});

     });
     // Handle LoRA selection
     const loraSelector = document.getElementById('loraSelector');
     // Generate button interaction
     const generateBtn = document.querySelector('button.bg-gradient-to-r');
     generateBtn.addEventListener('click', function() {
         const selectedLora = loraSelector.selectedValue;
         console.log('Selected LoRA:', selectedLora);
+        // Optimize prompt based on selected LoRA
+        const promptTextarea = document.querySelector('textarea:not([placeholder])');
+        const originalPrompt = promptTextarea.value;
+        const optimizedPrompt = optimizePromptForLora(originalPrompt, selectedLora.trigger);
+        promptTextarea.value = optimizedPrompt;
+        console.log('Optimized prompt:', optimizedPrompt);
         // Simulate processing time
         setTimeout(() => {
             // Reset button
             `;
         }, 3000);
     });
+});
+function optimizePromptForLora(basePrompt, loraTrigger) {
+    if (!loraTrigger) return basePrompt;
+    // Base model optimizations
+    const baseOptimizations = [
+        "high quality, detailed, sharp focus",
+        "professional lighting, cinematic composition",
+        "8k resolution, ultra detailed",
+        "masterpiece, best quality"
+    ];
+    // Motion-specific enhancements
+    const motionEnhancements = [
+        "smooth camera motion",
+        "dynamic movement",
+        "fluid animation",
+        "cinematic pan"
+    ];
+    // Combine all elements
+    const allElements = [...baseOptimizations, ...motionEnhancements];
+    // Check if base prompt already contains optimization keywords
+    const hasQualityKeywords = baseOptimizations.some(keyword =>
+        basePrompt.toLowerCase().includes(keyword.split(',')[0].toLowerCase())
+    );
+    const hasMotionKeywords = motionEnhancements.some(keyword =>
+        basePrompt.toLowerCase().includes(keyword.split(',')[0].toLowerCase())
+    );
+    // Add missing optimizations
+    let optimizedPrompt = basePrompt;
+    if (!hasQualityKeywords) {
+        optimizedPrompt = `${allElements.slice(0, 2).join(', ')}, ${optimizedPrompt}`;
+    }
+    if (!hasMotionKeywords) {
+        optimizedPrompt = `${optimizedPrompt}, ${motionEnhancements.slice(0, 2).join(', ')}`;
+    }
+    // Add LoRA trigger word
+    if (loraTrigger && !basePrompt.toLowerCase().includes(loraTrigger.toLowerCase())) {
+        optimizedPrompt = `${optimizedPrompt}, ${loraTrigger}`;
+    }
+    return optimizedPrompt;
+}