Main

sawsent · Apr 18, 2024 · 93b3457 · 93b3457
2 parents a5ab4d3 + 9970c47
commit 93b3457
Show file tree

Hide file tree

Showing 31 changed files with 220 additions and 18,759 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/MoodRisers app/css/stylesheet.css b/MoodRisers app/css/stylesheet.css
@@ -0,0 +1,11 @@
+#main{
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+    width: 100svw;
+    height: 100svh;
+}
+
+#searchbar{
+ width: 50%;
+}
diff --git a/MoodRisers app/index.html b/MoodRisers app/index.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+    <script type="module" src="./js/index.js"></script> 
+    <link rel="stylesheet" href="css/stylesheet.css">
+    <title>Document</title>
+</head>
+<body>
+    <div id="container"></div>
+</body>
+</html>
diff --git a/MoodRisers app/js/controller/homeController.js b/MoodRisers app/js/controller/homeController.js
@@ -0,0 +1,8 @@
+import homeView from "../view/homeView.js";
+
+async function init() {
+    homeView.render();
+
+}
+
+export default { init };
diff --git a/MoodRisers app/js/controller/resultController.js b/MoodRisers app/js/controller/resultController.js
@@ -0,0 +1,12 @@
+import resultService from "../service/resultService.js";
+import resultView from "../view/resultView.js";
+
+async function init(args) {
+    console.log(args);
+    const message = await resultService.get(args[0]);
+
+    resultView.render(message.playlist_id);
+
+}
+
+export default { init };
diff --git a/MoodRisers app/js/index.js b/MoodRisers app/js/index.js
@@ -0,0 +1,6 @@
+import router from "./router.js";
+
+window.addEventListener("DOMContentLoaded", function () {
+    console.log("DOM is loaded");
+    router.init();
+})
diff --git a/MoodRisers app/js/router.js b/MoodRisers app/js/router.js
@@ -1,4 +1,4 @@
-import routes from '/js/routes.js'
+import routes from './routes.js'
 
 function setCurrentRoute({ path, controller }) {
 

diff --git a/MoodRisers app/js/routes.js b/MoodRisers app/js/routes.js
@@ -1,7 +1,15 @@
 export default {
-    home: {
-        path: "/",
-        controller: "homeController",
-    },
-
+  home: {
+    path: "/",
+    controller: "homeController",
+  },
+
+  result: {
+    path: "/result",
+    controller: "resultController",
+  },
+  currentPath: {
+    path: "",
+    controller: "",
+  },
 };
diff --git a/MoodRisers app/js/service/homeService.js b/MoodRisers app/js/service/homeService.js
@@ -0,0 +1,34 @@
+function render(path = `https://kitsu.io/api/edge/anime?page[limit]=20&page[offset]=0`) {
+    return showApi(path);
+}
+
+async function fetchApi(path) {
+    const api = path;
+
+    const response = await fetch(api);
+    const body = await response.json();
+
+    if (!response.ok) {
+        throw new Error(body.message); // throwing inside async rejects the returned promise
+    }
+
+    return body;
+}
+
+async function showApi(path) {
+    try {
+        const user = await fetchApi(path);
+        /* user.data[0].attributes.canonicalTitle.array.forEach(element => {
+            
+        }); */
+
+      return user;
+
+
+    } catch (err) {
+        console.log(err.message);
+    }
+
+}
+
+export default {render};
diff --git a/MoodRisers app/js/service/resultService.js b/MoodRisers app/js/service/resultService.js
@@ -0,0 +1,32 @@
+async function get(message) {
+    return await fetchAPI(message);
+}
+
+async function fetchApi(message) {
+    const api = "https://gcc-backend-s8wv.onrender.com/api/get/";
+
+    const response = await fetch(`${api}${message}`);
+    const body = await response.json();
+
+
+
+    return body;
+}
+
+async function fetchAPI(message) {
+    try {
+        const user = await fetchApi(message);
+        /* user.data[0].attributes.canonicalTitle.array.forEach(element => {
+            
+        }); */
+
+      return user;
+
+
+    } catch (err) {
+        console.log(err.message);
+    }
+
+}
+
+export default {get};
diff --git a/MoodRisers app/js/view/homeView.js b/MoodRisers app/js/view/homeView.js
@@ -0,0 +1,57 @@
+
+ const list = document.createElement("div");
+  const buttonContainer = document.createElement("div");
+  const button = document.createElement("button");
+  container.className = "bg-light";
+
+
+  button.type = "button";
+  button.innerHTML = "Next";
+  button.className = "btn btn-dark";
+
+
+  list.style = `display: flex`;
+  list.className = `text-center`; 
+
+      const item = document.createElement("div");
+
+function render() {
+  const container = document.querySelector("#container");
+  container.innerHTML = ""; //removes the previous elements
+
+
+      item.className = `col text-black bg-light mb-3" style="max-width: 18rem;`;
+      item.innerHTML = `
+      <div>
+      <form id="main">
+          <center><div class="mb-3" id="searchbar">
+            <h2 for="exampleInputPassword1" class="form-label">Welcome dear friend, how are you felling today?</h2>
+            <br>
+            <br>
+            <input type="text" id="prompt">
+          </div>
+          <center><div class="col-md-1">
+              <button class="btn btn-outline-info" id="button">Submit</button></center>
+          </div>
+        </form>
+  </div>`;
+
+      list.appendChild(item);
+
+
+  container.appendChild(list);
+  container.appendChild(buttonContainer);
+
+    buttonContainer.appendChild(button);
+
+    $('#button').on('click', function() {
+      const prompt = document.getElementById('prompt').value;
+      window.location.hash =`/result/${prompt}`;
+
+
+  })
+
+
+}
+
+export default { render };
diff --git a/MoodRisers app/js/view/resultView.js b/MoodRisers app/js/view/resultView.js
@@ -0,0 +1,29 @@
+const list = document.createElement("div");
+  container.className = "bg-light";
+
+  list.style = `display: flex`;
+  list.className = `text-center`; 
+
+  const item = document.createElement("div");
+
+function render(message) {
+  const container = document.querySelector("#container");
+  container.innerHTML = ""; //removes the previous elements
+ console.log(message);
+      item.className = `col text-black bg-light mb-3" style="max-width: 18rem;`;
+      item.innerHTML = `
+      <div>
+      <iframe style="border-radius:12px" src="https://open.spotify.com/embed/playlist/${message}?utm_source=generator&theme=0" width="100%" height="352" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
+  </div>`;
+
+      list.appendChild(item);
+
+
+  container.appendChild(list);
+
+
+
+
+}
+
+export default { render };
diff --git a/MoodRisers app/react-moodrisers/.gitignore b/MoodRisers app/react-moodrisers/.gitignore
diff --git a/MoodRisers app/react-moodrisers/README.md b/MoodRisers app/react-moodrisers/README.md