urejeno spreminjanje količin sestavin glede na izbrano količino porciji

js/recepti.js

@@ -0,0 +1,31 @@
+
+const recepti = document.querySelectorAll(".recepti_jedi"); //poiscem vse recepte
+
+recepti.forEach(function(recept) { //funkcija gre cez vsak recept posebej
+
+    const osnovnePorcije = Number(recept.dataset.osnovnePorcije); //prebere osnovne porcije in iz stringa spremeni v stevilo ("4" = 4)
+    const vnosPorcij = recept.querySelector(".stevilo_porcij"); //poisce polje za stevilo porciji samo v trenutnem receptu
+    const sestavine = recept.querySelectorAll("[data-kolicina]"); //poisce kolicino vseh sestavin v receptu
+
+    vnosPorcij.addEventListener("input", function() { //ko spremenim vrednost polja se sprozi funkcija
+
+        const novePorcije = Number(vnosPorcij.value); //spet se prebere nova porcija in se spremeni v stevilo
+
+        if (!Number.isInteger(novePorcije) || novePorcije < 1 || novePorcije > 12) { //ce so nove porcije ne celo stevilo ali manjse od ena ali vecje od 12
+            return; //se nic ne vrne
+        }
+
+        sestavine.forEach(function(sestavina) { //funkcija za vsako sestavino
+
+            const osnovnaKolicina = Number(sestavina.dataset.kolicina); //prebere osnovno kolicino in jo pretvori v stevilo
+
+            const novaKolicina = osnovnaKolicina / osnovnePorcije * novePorcije; //preracuna kolicino sestavine za nove porcije
+
+            sestavina.textContent = Number(novaKolicina.toFixed(1)) //zaokrozimo na eno decimalno mesto, number pa odstrani nepotrebne 0 (200.0 = 200)
+                .toLocaleString("sl-SI", { maximumFractionDigits: 1 }); //poskrbi da so decimalke napisane s slovensko vejico
+
+        });
+
+    });
+
+});