1 files changed, 103 insertions, 0 deletions
diff --git a/frontend/src/AddBook.svelte b/frontend/src/AddBook.svelte
new file mode 100644
index 0000000..9352808
--- /dev/null
+++ b/frontend/src/AddBook.svelte
@@ -0,0 +1,103 @@
+<script lang="ts">
+  import { postToServer } from "./utils";
+
+  export let whereami: string;
+  export let mode: string;
+  export let ebook: any;
+
+  let author: string = ebook ? ebook.author : "",
+    title: string = ebook ? ebook.title : "",
+    isbn: string = ebook ? ebook.isbn : "",
+    format: string = ebook ? ebook.format : "",
+    pages: string = ebook ? ebook.pages : "",
+    description: string = ebook ? ebook.description : "",
+    year: number = ebook ? ebook.year : null,
+    id: number = ebook ? ebook.id : null,
+    publisher: string = ebook ? ebook.publisher : "";
+
+  async function add() {
+    await postToServer(
+      "/book",
+      {
+        author,
+        title,
+        year,
+        publisher,
+        id,
+        isbn,
+        format,
+        pages,
+        description,
+      },
+      true
+    );
+    author = "";
+    title = "";
+    year = null;
+    publisher = "";
+    id = null;
+    isbn = "";
+    format = "";
+    pages = "";
+    description = "";
+    if (mode === "edit") whereami = "books";
+  }
+</script>
+
+<main>
+  <button type="button" on:click={add}>
+    {mode[0].toUpperCase() + mode.substring(1)}
+  </button><br />
+  <label for="author">Author:</label>
+  <input bind:value={author} id="author" maxlength="100" /><br />
+  <label for="title">Title:</label>
+  <input bind:value={title} id="title" maxlength="100" /><br />
+  <label for="year">Year:</label>
+  <input
+    bind:value={year}
+    id="year"
+    type="number"
+    min="0000"
+    step="1"
+    max="2000000"
+  /><br />
+  <label for="publisher">Publisher:</label>
+  <input bind:value={publisher} id="publisher" maxlength="100" /><br />
+  <label for="isbn">Isbn:</label>
+  <input bind:value={isbn} id="isbn" maxlength="13" /><br />
+  <label for="format">Format:</label>
+  <input bind:value={format} id="format" maxlength="3" /><br />
+  <label for="pages">Pages:</label>
+  <input
+    bind:value={pages}
+    id="pages"
+    type="number"
+    min="0"
+    step="1"
+    max="2000000"
+  /><br />
+  <label for="description">Description:</label>
+  <input bind:value={description} id="description" maxlength="255" /><br />
+  <button type="button" on:click={() => (whereami = "books")}>Go back</button>
+</main>
+
+<style>
+  :root {
+    font-family: "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell;
+  }
+
+  main {
+    text-align: center;
+    font-size: 1.9em;
+  }
+  button {
+    margin-top: 30px;
+    margin-bottom: 30px;
+    margin-left: 15px;
+    text-decoration: underline;
+    font-size: 1em;
+  }
+  input {
+    font-size: 1em;
+  }
+</style>