X-Git-Url: https://git.auder.net/?p=xogo.git;a=blobdiff_plain;f=utils%2FdrawDiagrams.js;fp=utils%2FdrawDiagrams.js;h=46726431f74aa36f81f60cc89f27c891314e5324;hp=0000000000000000000000000000000000000000;hb=5abaabb3061f9c2927e2204a33a58c309f3a0082;hpb=65c770d1d8b4b1d6fe3beae9f0ada4bf8f8856cb

diff --git a/utils/drawDiagrams.js b/utils/drawDiagrams.js
new file mode 100644
index 0000000..4672643
--- /dev/null
+++ b/utils/drawDiagrams.js
@@ -0,0 +1,37 @@
+function fenToDiag(vname) {
+  import(`/variants/${vname}/class.js`).then(module => {
+    window.V = module.default;
+    for (const [k, v] of Object.entries(V.Aliases))
+      window[k] = v;
+    drawDiagrams();
+  });
+}
+
+// TODO: heuristic to improve for ratio != 1 (how?)
+function getDiagSize() {
+  if (window.innerWidth > 1000)
+    return 500;
+  if (window.innerWidth < 800)
+    return window.innerWidth;
+  return window.innerWidth / 2;
+}
+
+function drawDiagrams() {
+  const diagrams = document.getElementsByClassName("diag");
+  for (let i=0; i<diagrams.length; i++) {
+    let chessboard = document.createElement("div");
+    chessboard.classList.add("chessboard");
+    diagrams[i].appendChild(chessboard);
+    const diagSize = getDiagSize();
+    diagrams[i].style.width = diagSize + "px";
+    diagrams[i].style.height = diagSize + "px";
+    diagrams[i].id = "diag_" + i;
+    const vr = new V({
+      element: "diag_" + i,
+      fen: diagrams[i].dataset.fen,
+      color: diagrams[i].dataset.col || 'w',
+      options: {},
+      diagram: true
+    });
+  }
+}