Initial commit w/ v1.0.0

5 files changed, 243 insertions, 0 deletions

diff --git a/src/data.php b/src/data.php
new file mode 100644
index 0000000..aaf9d88
--- /dev/null
+++ b/src/data.php
@@ -0,0 +1,38 @@
+<?php
+function get_node_value($from, string $name): string
+{
+  return $from->getElementsByTagName($name)->item(0)->nodeValue;
+}
+function get_doc(): DOMDocument
+{
+  $doc = new DOMDocument();
+  $path = "/home/maks/school/clientApps/mlos/src/db.xml";
+  $doc->load($path);
+  return $doc;
+}
+function get_data(): array
+{
+  $doc = get_doc();
+  $out = [];
+  $games = $doc->getElementsByTagName("game");
+  $i = 0;
+  while ($game = $games->item($i++)) {
+    $out[] = [
+      "id" => $game->getAttribute("id"),
+      "order" => $game->getAttribute("order"),
+      "name" => get_node_value($game, "name"),
+      "thumbnail" => get_node_value($game, "thumbnail"),
+      "author" => get_node_value($game, "author"),
+      "magazine" => get_node_value($game, "magazine"),
+    ];
+  }
+  usort($out, function ($a, $b) {
+    return $a["order"] - $b["order"];
+  });
+  return [$out, $doc->getElementsByTagName("count")->item(0)->nodeValue];
+}
+
+$doc = get_doc();
+$xpath = new DOMXpath($doc);
+$game = $xpath->query('//game[@id="2"]/name')->item(0);
+// var_dump($game);
diff --git a/src/db.xml b/src/db.xml
new file mode 100644
index 0000000..7579d72
--- /dev/null
+++ b/src/db.xml
@@ -0,0 +1,30 @@
+<?xml version="1.0"?>
+<root>
+  <mid>12</mid>
+  <count>5</count>
+  <game id="1" order="4">
+    <name>Wiedzmi&#x144;</name>
+    <thumbnail>wiedzmin.png</thumbnail>
+    <author>&#x104;ndrzej S&#x119;pkiewicz</author>
+    <magazine>Fantastyka</magazine>
+  </game>
+  <game id="2" order="2">
+    <name>W&#x142;adca pier&#x15B;cieni</name>
+    <thumbnail>ring.png</thumbnail>
+    <author>Tolkien Sapkowski</author>
+    <magazine>CDAction 1999</magazine>
+  </game>
+  <game id="3" order="3">
+    <name>Artix</name>
+    <thumbnail>artix.png</thumbnail>
+    <author>NotSoArchDev</author>
+    <magazine>Torvalds 1987</magazine>
+  </game>
+  <game id="4" order="1">
+    <name>&#x1F976;</name>
+    <author>&#x1F911;</author>
+    <thumbnail>&#x1F64A;.png</thumbnail>
+    <magazine>&#x1F64A;</magazine>
+  </game>
+
+<game id="11" order="5"><name>&lt;b&gt;Thinkpad&lt;/b&gt;</name><author>&lt;b&gt;Lenovo&lt;/b&gt;</author><thumbnail>&lt;br&gt;thinkpad.png</thumbnail><magazine>&lt;b&gt;Intel(R)&lt;/b&gt;</magazine></game></root>
diff --git a/src/main.js b/src/main.js
new file mode 100644
index 0000000..db9a00f
--- /dev/null
+++ b/src/main.js
@@ -0,0 +1,83 @@
+//import './style.css';
+function edit(e) {
+  e.preventDefault();
+  const tar = e.target;
+  const form = tar.parentNode;
+  form.onseeked;
+  const id = tar.dataset.id;
+  const tds = document.querySelectorAll(`[data-id="${id}"]`);
+  const names = ["name", "thumbnail", "author", "magazine",];
+  tds.forEach((el, i) => {
+    if (el.tagName === "TD") {
+      const v = el.innerHTML;
+      el.innerHTML = `<input name="${names[i]}" value="${v}">`;
+    }
+    else if (el === tar) {
+      el.style.display = "none";
+    }
+    else {
+      const iel = el;
+      if (iel.type !== "hidden") {
+        iel.value = "Save";
+        el.onclick = e => save(e, tds);
+      }
+    }
+  });
+}
+//@ts-expect-error
+window.edit = edit;
+async function save(e, tds) {
+  console.log(tds);
+  const tar = e.target;
+  const body = new FormData();
+  e.preventDefault();
+  let i = 0;
+  tds.forEach((el) => {
+    if (el.tagName === "TD") {
+      const v = el.firstChild.value;
+
+      if (i === 3)
+        el.innerHTML = v;
+      else
+        el.innerText = v;
+
+      switch (i) {
+        case 0:
+          body.append("name", v);
+          break;
+        case 1:
+          body.append("thumbnail", v);
+          break;
+        case 2:
+          body.append("author", v);
+          break;
+        case 3:
+          body.append("magazine", v);
+          break;
+      }
+      i++;
+    }
+    else if (el === tar) {
+      const iel = el;
+      iel.value = "Remove";
+      iel.onclick = null;
+    }
+    else {
+      const iel = el;
+      if (iel.type === "hidden") {
+        body.append(iel.name, iel.value);
+      }
+      else {
+        iel.style.display = "";
+      }
+    }
+  });
+  console.log(await (await fetch("api/add.php", {
+    method: "POST",
+    headers: {
+      // "Content-Type": "multipart/form-data",
+    },
+    body
+  })).text());
+}
+//# sourceMappingURL=main.js.map
diff --git a/src/main.ts b/src/main.ts
new file mode 100644
index 0000000..c4b616b
--- /dev/null
+++ b/src/main.ts
@@ -0,0 +1,67 @@
+import './style.css'
+
+function edit(e: PointerEvent) {
+  e.preventDefault();
+  const tar = e.target as HTMLInputElement;
+  const form = tar.parentNode as HTMLFormElement
+  form.onseeked
+  const id = tar.dataset.id;
+  const tds = document.querySelectorAll(`[data-id="${id}"]`) as NodeListOf<HTMLElement>
+  const names = ["name", "thumbnail", "author", "magazine",]
+  tds.forEach((el, i) => {
+    if (el.tagName === "TD") {
+      const v = el.innerHTML;
+      el.innerHTML = `<input name="${names[i]}" value="${v}">`
+    } else if (el === tar) {
+      el.style.display = "none"
+    } else {
+      const iel = (el as HTMLInputElement)
+      if (iel.type !== "hidden") {
+        iel.value = "Save"
+        el.onclick = e => save(e, tds);
+      }
+    }
+  })
+}
+//@ts-expect-error
+window.edit = edit;
+
+async function save(e: MouseEvent, tds: NodeListOf<HTMLElement>) {
+  console.log(tds)
+  const tar = e.target as HTMLInputElement
+  const body = new FormData();
+  e.preventDefault();
+  let i = 0;
+  tds.forEach((el) => {
+    if (el.tagName === "TD") {
+      const v = (el.firstChild as HTMLInputElement).value;
+      el.innerHTML = v
+      switch (i) {
+        case 0: body.append("name", v); break;
+        case 1: body.append("thumbnail", v); break;
+        case 2: body.append("author", v); break;
+        case 3: body.append("magazine", v); break;
+      }
+      i++;
+    } else if (el === tar) {
+      const iel = (el as HTMLInputElement)
+      iel.value = "Remove"
+      iel.onclick = null;
+    } else {
+      const iel = (el as HTMLInputElement)
+      if (iel.type === "hidden") {
+        body.append(iel.name, iel.value);
+      } else {
+        iel.style.display = ""
+      }
+    }
+  })
+  await fetch("api/add.php", {
+    method: "POST",
+    headers: {
+      "Content-Type": "multipart/form-data",
+    },
+    body
+  });
+}
+
diff --git a/src/style.css b/src/style.css
new file mode 100644
index 0000000..bbcdf49
--- /dev/null
+++ b/src/style.css
@@ -0,0 +1,25 @@
+header {
+  display: flex;
+  justify-content: center;
+  padding: 20px;
+}
+table {
+  margin: 0 auto;
+  border-spacing: 15px;
+}
+td {
+  margin: 100px;
+}
+header button {
+ font-size: 1em;
+  padding: 10px;
+}
+html {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  /* text-align: center; */
+  color: #2c3e50;
+  font-size: 2em;
+  /* margin-top: 60px; */
+}