setting up front 1

2026-07-31 17:41:55 +03:00
parent b88fde739c
commit bf8b9219fc
48 changed files with 2250 additions and 11 deletions
@@ -0,0 +1,50 @@
+import { Controller } from '@hotwired/stimulus'
+
+export default class extends Controller {
+    static targets = ['price', 'image', 'swatch', 'colorName']
+    static values  = { variants: Array, selected: Number }
+
+    connect() {
+        const params    = new URLSearchParams(window.location.search)
+        const urlId     = parseInt(params.get('variant'))
+        const defaultId = this.variantsValue[0]?.id
+
+        this.selectedValue = urlId && this.variantsValue.find(v => v.id === urlId)
+            ? urlId
+            : defaultId
+    }
+
+    selectVariant(event) {
+        const id = parseInt(event.currentTarget.dataset.variantId)
+        this.selectedValue = id
+
+        const url = new URL(window.location)
+        url.searchParams.set('variant', id)
+        window.history.pushState({}, '', url)
+    }
+
+    selectedValueChanged(id) {
+        if (!id) return
+
+        const variant = this.variantsValue.find(v => v.id === id)
+        if (!variant) return
+
+        if (this.hasPriceTarget && variant.price !== null) {
+            this.priceTarget.textContent = '€' + parseFloat(variant.price).toFixed(2)
+        }
+
+        if (this.hasImageTarget && variant.image) {
+            this.imageTarget.src = variant.image
+        }
+
+        this.swatchTargets.forEach(swatch => {
+            const isSelected = parseInt(swatch.dataset.variantId) === id
+            swatch.classList.toggle('is-selected', isSelected)
+            swatch.setAttribute('aria-pressed', String(isSelected))
+
+            if (isSelected && this.hasColorNameTarget) {
+                this.colorNameTarget.textContent = swatch.getAttribute('aria-label')
+            }
+        })
+    }
+}