svg feedback fix seed increment behavior

svg-feedback/index.html

@@ -64,6 +64,7 @@ <h1>LLM SVG Art Evolution</h1>
         <h2>History</h2>
         <div id="history"></div>
     </div>
+    <script src="script.js"></script>
 
     <script>
         const elements = {
@@ -251,11 +252,9 @@ <h2>History</h2>
             const maxRetries = 3;
             const model = getSelectedModel();
             const temperature = parseFloat(elements.temperature.value);
-            const seed = parseInt(elements.seed.value) >= 0 ? 
-                parseInt(elements.seed.value) : 
-                currentSeed++; // Use and increment the current seed
+            const seed = currentSeed;// + retryCount; // Increment seed based on retry count
 
-            const systemPrompt = `You are an animated SVG art generator. Create SVG code that fits within a 800x600 viewBox.
+            const systemPrompt = `You are an animated SVG art generator. Create SVG code with 100% width and height.
             Follow these rules:
             0. Your code should be inspired by the demoscene. Self-containted. Small. Re-using elements and groups creatively.
             1. Always start with <?xml version="1.0" encoding="UTF-8"?> and proper SVG tags
@@ -266,7 +265,8 @@ <h2>History</h2>
             6. Return ONLY the SVG code wrapped in \`\`\`svg code blocks
             7. animations should be slow and fluid
             8. please add directions for the next evolution as explanation underneath the svg
-
+            9. The svg should have width and height 100%
+            10. The background is dark
             Creative Direction: ${prompt}`;
 
             const userMessage = currentState ? 
@@ -304,11 +304,8 @@ <h2>History</h2>
                 const svgContent = extractSvgContent(text);
 
                 // Validate SVG completeness
-                if (!svgContent) {
-                    throw new Error('No valid SVG content found in response');
-                }
 
-                if (!svgContent.includes('</svg>')) {
+                if (!svgContent || !svgContent.includes('</svg>')) {
                     throw new Error('Incomplete SVG content');
                 }
 
@@ -318,6 +315,7 @@ <h2>History</h2>
 
             } catch (error) {
                 console.error('Error:', error);
+                currentSeed++;
                 if (retryCount < maxRetries) {
                     console.log(`Retry ${retryCount + 1}/${maxRetries}: ${error.message}`);
                     return generateText(prompt, currentState, retryCount + 1);
@@ -382,6 +380,10 @@ <h2>History</h2>
             isRunning = true;
             elements.start.disabled = true;
             elements.stop.disabled = false;
+
+            if (parseInt(elements.seed.value) >= 0) {
+                initialSeed = parseInt(elements.seed.value);    
+            }
 
             frames = [];
             frameIndex = 0;
@@ -435,7 +437,7 @@ <h2>History</h2>
                 temperature: elements.temperature.value,
                 initialSvg: elements.initialSvg.value,
                 model: elements.modelSelect.value,
-                seed: currentSeed
+                seed: initialSeed
             };
 
             const savedPresets = JSON.parse(localStorage.getItem('savedPresets2') || '{}');

svg-feedback/styles.css

@@ -251,3 +251,10 @@ textarea {
     border-color: #333;
     color: #aaa;
 }
+
+#history svg {
+    background: var(--bg-primary);
+    border: 1px solid var(--border);
+    border-radius: 4px;
+    margin: 5px;
+}