Spaces:

hmaras
/

dandy-s-meta-mastermind

Running

App Files Files Community

hmaras commited on Dec 14, 2025

Commit

9a99f1d

verified ·

1 Parent(s): 0573433

// Build Calculator and Utility Handling

Browse files

Files changed (1) hide show

script.js +68 -101

script.js CHANGED Viewed

@@ -1,9 +1,7 @@
-// Build Calculator Form Handling
 document.addEventListener('DOMContentLoaded', function() {
     const buildForm = document.getElementById('build-form');
-    if (!buildForm) return;
     const previewElements = {
         toon: document.getElementById('preview-toon'),
         buildName: document.getElementById('preview-build-name'),
@@ -12,125 +10,94 @@ document.addEventListener('DOMContentLoaded', function() {
         ratingSection: document.getElementById('build-rating')
     };
-    // Maps for display names
-    const displayNames = {
-        toon: {
-            'vee': 'Vee',
-            'pebble': 'Pebble',
-            'sprout': 'Sprout',
-            'shelly': 'Shelly'
-        },
-        goal: {
-            'ichor': 'Ichor Farming',
-            'survival': 'Solo Survival',
-            'research': 'Research Farming',
-            'support': 'Team Support'
-        },
-        trinket: {
-            'remote': "Vee's Remote",
-            'magnifying': 'Magnifying Glass',
-            'plush': 'Dandy Plush',
-            'bow': 'Pink Bow'
-        }
     };
-    // Update preview function
-    function updatePreview() {
-        const formData = new FormData(buildForm);
-        const data = Object.fromEntries(formData.entries());
-        // Update toon preview
-        if (data.toon && displayNames.toon[data.toon]) {
-            previewElements.toon.textContent = displayNames.toon[data.toon];
-        } else {
-            previewElements.toon.textContent = 'Select a Toon';
-        }
-        // Update build name preview
-        if (data.buildName) {
-            previewElements.buildName.textContent = data.buildName;
-            if (data.goal && displayNames.goal[data.goal]) {
-                previewElements.buildName.textContent += ` - ${displayNames.goal[data.goal]}`;
             }
-        } else {
-            previewElements.buildName.textContent = 'No build name yet';
-        }
-        // Update trinkets preview
-        if (data.trinket1 || data.trinket2) {
             const trinkets = [];
-            if (data.trinket1 && displayNames.trinket[data.trinket1]) trinkets.push(displayNames.trinket[data.trinket1]);
-            if (data.trinket2 && displayNames.trinket[data.trinket2]) trinkets.push(displayNames.trinket[data.trinket2]);
             previewElements.trinkets.textContent = trinkets.join(' + ') || 'No trinkets selected';
-        } else {
-            previewElements.trinkets.textContent = 'No trinkets selected';
-        }
-        // Update rationale preview
-        if (data.rationale) {
-            previewElements.rationale.textContent = data.rationale;
-        } else {
-            previewElements.rationale.textContent = 'Add your strategic rationale to see it here';
-        }
-        // Show rating section when form is complete
-        if (data.toon && data.goal && data.trinket1 && data.trinket2 && data.buildName) {
-            previewElements.ratingSection.classList.remove('hidden');
-        } else {
-            previewElements.ratingSection.classList.add('hidden');
-        }
-        feather.replace();
-    }
-    // Initialize preview
-    updatePreview();
-    // Listen for all form changes
-    buildForm.addEventListener('input', updatePreview);
-    buildForm.addEventListener('change', updatePreview);
-    // Handle form submission
-    buildForm.addEventListener('submit', function(e) {
-        e.preventDefault();
-        const formData = new FormData(buildForm);
-        const data = Object.fromEntries(formData.entries());
-        // Validate form
-        if (!data.toon || !data.goal || !data.trinket1 || !data.trinket2 || !data.buildName) {
-            alert('Please fill all required fields!');
-            return;
-        }
-        // Save to localStorage
-        const builds = JSON.parse(localStorage.getItem('builds') || '[]');
-        builds.push({
-            ...data,
-            date: new Date().toISOString()
         });
-        localStorage.setItem('builds', JSON.stringify(builds));
-        alert('Build saved successfully!');
-        buildForm.reset();
-        updatePreview(); // Reset preview after submission
-    });
-    // Smooth scrolling for anchor links
-document.querySelectorAll('a[href^="#"]').forEach(anchor => {
-    anchor.addEventListener('click', function (e) {
-        e.preventDefault();
-        document.querySelector(this.getAttribute('href')).scrollIntoView({
-            behavior: 'smooth'
         });
     });
-});
-// Initialize tooltips
-document.addEventListener('DOMContentLoaded', function() {
     const tooltipTriggers = document.querySelectorAll('[data-tooltip]');
     tooltipTriggers.forEach(trigger => {
         const tooltip = document.createElement('div');
-        tooltip.className = 'tooltip hidden md:block bg-dark text-white px-3 py-2 rounded text-sm absolute z-10 whitespace-nowrap';
         tooltip.textContent = trigger.getAttribute('data-tooltip');
         trigger.appendChild(tooltip);
         trigger.addEventListener('mouseenter', () => {
@@ -141,4 +108,4 @@ document.addEventListener('DOMContentLoaded', function() {
             tooltip.classList.add('hidden');
         });
     });
-});

+// Build Calculator and Utility Handling
 document.addEventListener('DOMContentLoaded', function() {
     const buildForm = document.getElementById('build-form');
     const previewElements = {
         toon: document.getElementById('preview-toon'),
         buildName: document.getElementById('preview-build-name'),
         ratingSection: document.getElementById('build-rating')
     };
+    // --- Configuration Maps ---
+    const config = {
+        toonNames: { 'vee': 'Vee', 'pebble': 'Pebble', 'sprout': 'Sprout', 'shelly': 'Shelly' },
+        goalNames: { 'ichor': 'Ichor Farming', 'survival': 'Solo Survival', 'research': 'Research Farming', 'support': 'Team Support' },
+        trinketNames: { 'remote': "Vee's Remote", 'magnifying': 'Magnifying Glass', 'plush': 'Dandy Plush', 'bow': 'Pink Bow' }
     };
+    if (buildForm) {
+        // --- Real-time Preview Update ---
+        buildForm.addEventListener('input', function() {
+            const formData = new FormData(buildForm);
+            const data = Object.fromEntries(formData.entries());
+            // Toon and Goal Display
+            const toonDisplay = config.toonNames[data.toon] || 'Select a Toon';
+            previewElements.toon.textContent = toonDisplay;
+            // Build Name and Goal
+            let buildNameDisplay = data.buildName || 'No build name yet';
+            if (data.goal && config.goalNames[data.goal]) {
+                buildNameDisplay = `${buildNameDisplay} - ${config.goalNames[data.goal]}`;
             }
+            previewElements.buildName.textContent = buildNameDisplay;
+            // Trinket Display
             const trinkets = [];
+            if (data.trinket1 && config.trinketNames[data.trinket1]) trinkets.push(config.trinketNames[data.trinket1]);
+            if (data.trinket2 && config.trinketNames[data.trinket2]) trinkets.push(config.trinketNames[data.trinket2]);
             previewElements.trinkets.textContent = trinkets.join(' + ') || 'No trinkets selected';
+            // Rationale Display
+            previewElements.rationale.textContent = data.rationale || 'Add your strategic rationale to see it here';
+            // Show rating section when key fields are filled
+            const isComplete = data.toon && data.goal && data.trinket1 && data.trinket2 && data.buildName;
+            previewElements.ratingSection.classList.toggle('hidden', !isComplete);
+            // Re-render Feather icons if used in the preview
+            feather.replace();
+        });
+        // --- Form Submission and Local Storage Save ---
+        buildForm.addEventListener('submit', function(e) {
+            e.preventDefault();
+            const formData = new FormData(buildForm);
+            const data = Object.fromEntries(formData.entries());
+            // Simple validation check (assuming select fields have default value="")
+            if (!data.toon || !data.goal || !data.trinket1 || !data.trinket2 || !data.buildName || !data.rationale) {
+                alert('Please fill all required fields, including the rationale!');
+                return;
+            }
+            // Save to localStorage
+            const builds = JSON.parse(localStorage.getItem('builds') || '[]');
+            builds.push({ ...data, date: new Date().toISOString() }); // Use spread syntax for efficiency
+            localStorage.setItem('builds', JSON.stringify(builds));
+            alert('Build saved successfully!');
+            buildForm.reset();
+            // Re-render Feather icons after reset
+            feather.replace();
         });
+    }
+    // --- Smooth Scrolling for Anchor Links ---
+    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+        anchor.addEventListener('click', function (e) {
+            e.preventDefault();
+            const target = document.querySelector(this.getAttribute('href'));
+            if (target) {
+                target.scrollIntoView({ behavior: 'smooth' });
+            }
         });
     });
+    // --- Initialize Tooltips ---
     const tooltipTriggers = document.querySelectorAll('[data-tooltip]');
     tooltipTriggers.forEach(trigger => {
         const tooltip = document.createElement('div');
+        // Use consistent classes for styling
+        tooltip.className = 'tooltip hidden md:block bg-gray-800 text-white px-3 py-1 rounded text-xs absolute z-40 whitespace-nowrap opacity-95 transition-opacity duration-200';
         tooltip.textContent = trigger.getAttribute('data-tooltip');
+        // Use a relative container for better positioning
+        trigger.style.position = 'relative';
         trigger.appendChild(tooltip);
         trigger.addEventListener('mouseenter', () => {
             tooltip.classList.add('hidden');
         });
     });
+});