fiddle with contrast utility

Author: svgeesus

css-color-4/contrast.html

@@ -7,13 +7,23 @@
 	// then use the contrast() utility function
 	// to compute WCAG contrast.
 
-		var back=document.querySelector(#fg);
-		var fore=document.querySelector(#bg);
-		back.addEventListener("input", updateFirst, false);
-		fore.addEventListener("input", updateFirst, false);
+		var back, fore, bgcol, fgcol;
+		window.addEventListener("load", startup, false);
+
+		function startup() {
+			back=document.querySelector(#fg);
+			fore=document.querySelector(#bg);
+			back.addEventListener("input", watchpickers, false);
+			fore.addEventListener("input", watchpickers, false);
+		}
 
 		function watchpickers(event) {
-			// if either picker changes,
+			// if either picker changes, update the two colors
+			// and output the contrast ratio
+
+			var contrast = document.querySelector("result>span");
+			bgcol = event.target.value;
+			fgcol =
 		}
 	</script>
 	<style>

css-color-4/utilities.js

@@ -35,7 +35,7 @@ function sRGB_to_LCH(RGB) {
     return Lab_to_LCH(XYZ_to_Lab(D65_to_D50(lin_sRGB_to_XYZ(lin_sRGB(RGB)))));
 }
 
-functions LCH_to_sRGB(LCH) {
+function LCH_to_sRGB(LCH) {
     // convert an array of CIE LCH values
     // to CIE Lab, and then to XYZ,
     // adapt from D50 to D65,
@@ -46,5 +46,5 @@ functions LCH_to_sRGB(LCH) {
     // or components greater than 1.0
     // so check for that :)
 
-    return gam(sRGB(XYZ_to_lin_sRGB(Lab_to_XYZ(D50_to_D65(LCH_to_Lab(LCH)))));
+    return gam(sRGB(XYZ_to_lin_sRGB(Lab_to_XYZ(D50_to_D65(LCH_to_Lab(LCH))))));
 }