diff --git a/assets/letters/A.png b/assets/letters/A.png index 1fdcd67..ed43dfc 100644 Binary files a/assets/letters/A.png and b/assets/letters/A.png differ diff --git a/assets/letters/B.png b/assets/letters/B.png index fbf4970..111b506 100644 Binary files a/assets/letters/B.png and b/assets/letters/B.png differ diff --git a/assets/letters/C.png b/assets/letters/C.png index 40c1c37..011777f 100644 Binary files a/assets/letters/C.png and b/assets/letters/C.png differ diff --git a/assets/letters/D.png b/assets/letters/D.png new file mode 100644 index 0000000..287079f Binary files /dev/null and b/assets/letters/D.png differ diff --git a/assets/letters/E.png b/assets/letters/E.png new file mode 100644 index 0000000..a7cd308 Binary files /dev/null and b/assets/letters/E.png differ diff --git a/assets/letters/F.png b/assets/letters/F.png new file mode 100644 index 0000000..601c985 Binary files /dev/null and b/assets/letters/F.png differ diff --git a/assets/letters/G.png b/assets/letters/G.png new file mode 100644 index 0000000..51f478f Binary files /dev/null and b/assets/letters/G.png differ diff --git a/assets/letters/H.png b/assets/letters/H.png new file mode 100644 index 0000000..a99a189 Binary files /dev/null and b/assets/letters/H.png differ diff --git a/assets/letters/I.png b/assets/letters/I.png new file mode 100644 index 0000000..c618878 Binary files /dev/null and b/assets/letters/I.png differ diff --git a/assets/letters/J.png b/assets/letters/J.png new file mode 100644 index 0000000..d6ce1bf Binary files /dev/null and b/assets/letters/J.png differ diff --git a/assets/letters/K.png b/assets/letters/K.png new file mode 100644 index 0000000..644afa9 Binary files /dev/null and b/assets/letters/K.png differ diff --git a/assets/letters/L.png b/assets/letters/L.png new file mode 100644 index 0000000..86c367d Binary files /dev/null and b/assets/letters/L.png differ diff --git a/assets/letters/M.png b/assets/letters/M.png new file mode 100644 index 0000000..eb3636d Binary files /dev/null and b/assets/letters/M.png differ diff --git a/assets/letters/N.png b/assets/letters/N.png new file mode 100644 index 0000000..3d4f420 Binary files /dev/null and b/assets/letters/N.png differ diff --git a/assets/letters/O.png b/assets/letters/O.png new file mode 100644 index 0000000..9a28e67 Binary files /dev/null and b/assets/letters/O.png differ diff --git a/assets/letters/P.png b/assets/letters/P.png new file mode 100644 index 0000000..2f8fe38 Binary files /dev/null and b/assets/letters/P.png differ diff --git a/assets/letters/Q.png b/assets/letters/Q.png new file mode 100644 index 0000000..0cac933 Binary files /dev/null and b/assets/letters/Q.png differ diff --git a/assets/letters/R.png b/assets/letters/R.png new file mode 100644 index 0000000..a32a46a Binary files /dev/null and b/assets/letters/R.png differ diff --git a/assets/letters/S.png b/assets/letters/S.png new file mode 100644 index 0000000..e22c08c Binary files /dev/null and b/assets/letters/S.png differ diff --git a/assets/letters/T.png b/assets/letters/T.png new file mode 100644 index 0000000..8a4470e Binary files /dev/null and b/assets/letters/T.png differ diff --git a/assets/letters/U.png b/assets/letters/U.png new file mode 100644 index 0000000..1f34f74 Binary files /dev/null and b/assets/letters/U.png differ diff --git a/assets/letters/V.png b/assets/letters/V.png new file mode 100644 index 0000000..0f1e558 Binary files /dev/null and b/assets/letters/V.png differ diff --git a/assets/letters/W.png b/assets/letters/W.png new file mode 100644 index 0000000..85e6339 Binary files /dev/null and b/assets/letters/W.png differ diff --git a/assets/letters/X.png b/assets/letters/X.png new file mode 100644 index 0000000..8b7a941 Binary files /dev/null and b/assets/letters/X.png differ diff --git a/assets/letters/Y.png b/assets/letters/Y.png new file mode 100644 index 0000000..1287040 Binary files /dev/null and b/assets/letters/Y.png differ diff --git a/assets/letters/Z.png b/assets/letters/Z.png new file mode 100644 index 0000000..ae7c572 Binary files /dev/null and b/assets/letters/Z.png differ diff --git a/index.html b/index.html index 80286e8..0d53502 100644 --- a/index.html +++ b/index.html @@ -23,7 +23,7 @@ -
+
diff --git a/index.js b/index.js index e152782..12ffd70 100644 --- a/index.js +++ b/index.js @@ -2,10 +2,12 @@ var ranid = 1; var cntdrag = 1; -let data_tabl = ["A", "B", "C"]; +let data_tabl = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"]; let prefix = "assets/"; +let numcolumns = 2; + function cleanup(){ var htmls = []; var returntos = []; @@ -70,19 +72,46 @@ function getRandomElement(array){ return array[getRandomInt(0, array.length)]; } +// imageholder.append(); +// letterholder.append + +function columnize(arrayin, columns){ + var tmp2 = ""; + for (var i = 0; i < arrayin.length; i += columns) { + var tmp = ""; + for (var x = i; x < i + columns; x++) { + if (x > arrayin.length - 1){ + break; + } + tmp += ""; + } + tmp += ""; + tmp2 += tmp; + } + tmp2 += "
" + arrayin[x] + "
"; + return tmp2; +} + function showImages() { + var images = []; + var letters = []; + + let imageholder = $("#imageholder"); + let letterholder = $("#letterholder"); + for (let i = 0 ; i < data_tabl.length; i++) { let imagepath = prefix + "images/" + data_tabl[i] + ".png"; let letterpath = prefix + "letters/" + data_tabl[i] + ".png"; - let imageholder = $("#imageholder"); - let letterholder = $("#letterholder"); - - imageholder.append("
"); + images.push("
"); ranid += 1; - letterholder.append("
"); + letters.push("
"); ranid += 1; } + + imageholder.append(columnize(images, numcolumns)); + letterholder.append(columnize(letters, numcolumns)); + } function generatePair(){ @@ -128,7 +157,7 @@ function drop(ev) { let cntdrag = ev.dataTransfer.getData("cntdrag"); let datacode = ev.dataTransfer.getData("datacode"); if (!ev.target.outerHTML.includes("img")){ - $('[cntdrag="' + cntdrag + '"]').remove(); + //$('[cntdrag="' + cntdrag + '"]').remove(); ev.target.setAttribute("datacode", datacode); ev.target.innerHTML = data; }