dokumentace

index.html

@@ -21,19 +21,42 @@
 		T &dash; <input type="text" id="time" size="12" placeholder="hh : mm : ss">
 	</div>	
 	<script>
+		// v podstatě se jedná o starý trik, kdy se kód nadefinuje jako anonymní funkce
+		// která se okam žitě zavolá
+		// ((...) => ...)() je identické '(function (...) { ... })()' akorát kratší
+
+		// t, on a tmr jsou argumenty, ale zneužíváme je pro state,
+		// teoreticky se dá volat na libovolném elementu, takže je kód reusable :Dd
+		// t  = element, který se používá jako časovač
+		// on = značí, jestli časovač právě běží
+		// tmr= handle na setInterval 
 		((t = document.querySelector("#time"), on = false, tmr = undefined) =>
+			// přidání eventu
 			t.addEventListener(
 				"keyup",
+				// konvertuje čas buď v sekundách nebo v hh:mm:ss (nebo mm:ss) na sekundy
+				// algoritmus v podstatě spočívá v tom, že sekundy jsou X * 60^0, minuty X * 60^1, hodiny X * 60^2
+				// event reaguje pouze, pokud je keyCode 13 a timer už neběží
 				(e, s = t.value.split(':').reduce((a, x) => (60 * a) + +x)) => e.keyCode == 13 && !on
+					// pokud je tedy čas spustit timer
 					? (
+						// aby se neděly problémy
 						on = true,
+						// samotné spuštění timeru
+						// pokud s (tj. počet zbývajících sekund) je nula, zabij a resetuj timer,
+						// jinak naparsuj sekundy jako Date a vypiš v HH:MM:SS formátu
 						tmr = setInterval(() => s == 0
 							? (on = false, clearInterval(tmr), t.value = "")
-							: t.value = (new Date(s-- * 1000)).toISOString().substr(11, 8).replace(/:/g, ' : '), 1000)
+							: t.value = (new Date(s-- * 1000)) // naparsuje sekundy a zároveň odečte `s`
+								.toISOString() // konverze na časový string v ISO formátu
+								.substr(11, 8) // vybere jen HH:MM:SS
+								.replace(/:/g, ' : ') // "HH:MM:SS" -> "HH : MM : SS", aby to odpovídalo původnímu formátu :D
+							, 1000 // interval timeru, tj. sekunda
 						)
-					: 0
 					)
-		)()
+					: 0 // kouzelná nula jako noop, aby byly zeplněny obě větve terciálního operátoru
+			)
+		)() // na závěr je potřeba funkci zavolat, aby tahle krása začala fungovat :D
 	</script>
 </body>
 </html>