-
+
diff --git a/src/calibrate.js b/src/calibrate.js
index fb78183..341dc98 100644
--- a/src/calibrate.js
+++ b/src/calibrate.js
@@ -11,17 +11,6 @@ const names = [
'white',
];
-const reference = [
- [1,0,0,1],
- [0,1,0,1],
- [0,0,1,1],
- [1,1,0,1],
- [0,1,1,1],
- [1,0,1,1],
- [1,1,1,1],
- [0,0,0,1],
-];
-
const getCenter = (el) => {
const rect = el.getBoundingClientRect();
return [rect.x + rect.width/2, rect.y + rect.height/2];
@@ -65,7 +54,7 @@ module.exports = (gl, svg) => {
.reduce((a, b) => a.map((ac, i) => ac + b[i]), [0, 0, 0, 0])
.map(c => c / samples.length);
measured.push(average);
- reference.push(JSON.parse(region.dataset.color));
+ reference.push([...JSON.parse(region.dataset.color), 1]);
}
console.table({ reference: reference.map(fmt), measured: measured.map(fmt) });
diff --git a/src/index.js b/src/index.js
index 31a738d..219f21b 100644
--- a/src/index.js
+++ b/src/index.js
@@ -23,12 +23,27 @@ const sliders = Object.fromEntries(
.map(n => [n, document.getElementById(`slider-${n}`)])
);
const canvas = document.getElementById('canvas');
-const template = document.getElementById('calibration-template');
+let template = document.getElementById('calibration-template');
let gl, program, texture;
let updateInput, cleanupInput;
let cameraCorrection = null; // localStorage.density_lens_corr && JSON.parse(localStorage.density_lens_corr);
+let templateI = 0;
+
+const loadTemplate = async () => {
+ const res = await fetch(`assets/calibration/${templateI}.svg`);
+ if (!res.ok) throw new Error(`unable to load template ${templateI}`);
+
+ template.outerHTML = await res.text();
+ template = document.getElementById('calibration-template');
+ template.onclick = async (e) => {
+ e.stopPropagation();
+ templateI = (templateI + 1) % 3;
+ loadTemplate();
+ };
+};
+
const screenCorrection = (() => {
const colors = [0x00adee, 0xed6ea7, 0xfff200];
let matrix = [];
@@ -180,5 +195,6 @@ const resize = () => {
window.onresize = resize;
resize();
update();
+loadTemplate();
buttons.start.disabled = false;