4 files changed, 84 insertions, 0 deletions
diff --git a/services/API.js b/services/API.js
new file mode 100644
index 0000000..b28feba
--- /dev/null
+++ b/services/API.js
@@ -0,0 +1,10 @@
+const API = {
+  // url: "https://firtman.github.io/coffeemasters/api/menu.json",
+  url: "/data/menu.json",
+  fetchMenu: async () => {
+    const result = await fetch(API.url);
+    return await result.json();
+  },
+};
+
+export default API;
diff --git a/services/Menu.js b/services/Menu.js
new file mode 100644
index 0000000..88e3f35
--- /dev/null
+++ b/services/Menu.js
@@ -0,0 +1,5 @@
+import API from "./API.js";
+
+export async function loadData() {
+  app.store.menu = await API.fetchMenu();
+}
diff --git a/services/Router.js b/services/Router.js
new file mode 100644
index 0000000..13ef58e
--- /dev/null
+++ b/services/Router.js
@@ -0,0 +1,61 @@
+const Router = {
+  init: () => {
+    document.querySelectorAll("a.navlink").forEach((a) => {
+      a.addEventListener("click", (event) => {
+        event.preventDefault();
+        const url = event.target.getAttribute("href");
+        Router.go(url);
+      });
+    });
+    // Event Handler for URL changes
+    window.addEventListener("popstate", (event) => {
+      Router.go(event.state.route, false);
+    });
+
+    // Check inital URL
+    Router.go(location.pathname);
+  },
+
+  go: (route, addToHistory = true) => {
+    console.log("Going to route" + route);
+
+    if (addToHistory) {
+      history.pushState({ route }, "", route);
+    }
+
+    let pageElement = null;
+
+    switch (route) {
+      case "/":
+        pageElement = document.createElement("h1");
+        pageElement.textContent = "Menu";
+        break;
+      case "/order":
+        pageElement = document.createElement("h1");
+        pageElement.textContent = "Your Order";
+        break;
+      default:
+        if (route.startsWith("/product-")) {
+          pageElement = document.createElement("h1");
+          pageElement.textContent = "Your Order";
+          const paramId = route.substring(route.lastIndexOf("-") + 1);
+          // Dataset is great for storing costum data because it doesnt get
+          // parsed by the browser
+          pageElement.dataset.id = paramId;
+        }
+    }
+
+    if (pageElement) {
+      // document.querySelector("main").children[0].remove();
+
+      // For little Performance Improvement
+      const cache = document.querySelector("main");
+      cache.innerHTML = "";
+      cache.appendChild(pageElement);
+      window.screenX = 0;
+      window.screenY = 0;
+    }
+  },
+};
+
+export default Router;
diff --git a/services/Store.js b/services/Store.js
new file mode 100644
index 0000000..979a5a6
--- /dev/null
+++ b/services/Store.js
@@ -0,0 +1,8 @@
+import API from "./API.js";
+
+const Store = {
+  menu: null,
+  cart: [],
+};
+
+export default Store;