acteur/franchises/personnages

Fixes #5 impplémentation totale des links
NextFire-N7 · May 30, 2022 · 255198a · 255198a
1 parent dfa1717
commit 255198a
Show file tree

Hide file tree

Showing 4 changed files with 119 additions and 9 deletions.
diff --git a/backend/src/main/java/moe/yuru/myserieslist/entities/Person.java b/backend/src/main/java/moe/yuru/myserieslist/entities/Person.java
@@ -65,8 +65,16 @@ public void setMedias(Collection<Media> medias) {
         this.medias = medias;
     }
 
+    public void addMedia(Media media) {
+        this.medias.add(media);
+    }
+
     public void setRoles(Collection<Chara> roles) {
         this.roles = roles;
     }
 
+    public void addRole(Chara role) {
+        this.roles.add(role);
+    }
+
 }
diff --git a/backend/src/main/java/moe/yuru/myserieslist/services/PersonService.java b/backend/src/main/java/moe/yuru/myserieslist/services/PersonService.java
@@ -7,6 +7,7 @@
 
 import javax.persistence.EntityManager;
 import javax.persistence.PersistenceContext;
+
 import javax.transaction.Transactional;
 import javax.ws.rs.Consumes;
 import javax.ws.rs.GET;
@@ -17,6 +18,8 @@
 import javax.ws.rs.core.MediaType;
 
 import moe.yuru.myserieslist.entities.Person;
+import moe.yuru.myserieslist.entities.Chara;
+import moe.yuru.myserieslist.entities.Media;
 
 @Path("/persons")
 public class PersonService {
@@ -50,4 +53,26 @@ public Person personPost(Person person) {
         return person;
     }
 
+    @POST
+    @Path("/link")
+    @Consumes(MediaType.APPLICATION_JSON)
+    @Produces(MediaType.APPLICATION_JSON)
+    public Person personlinkMedia(Map<String, Serializable> data) {
+        Person person = em.find(Person.class, data.get("personId"));
+        Media media = em.find(Media.class, data.get("mediaId"));
+        person.addMedia(media);
+        return(person);
+    }
+
+    @POST
+    @Path("/linkrole")
+    @Consumes(MediaType.APPLICATION_JSON)
+    @Produces(MediaType.APPLICATION_JSON)
+    public Person personlinkRole(Map<String, Serializable> data) {
+        Person person = em.find(Person.class, data.get("personId"));
+        Chara chara = em.find(Chara.class, data.get("charaId"));
+        person.addRole(chara);
+        return(person);
+    }
+
 }
diff --git a/frontend/components/media/MediaCard.tsx b/frontend/components/media/MediaCard.tsx
@@ -1,13 +1,14 @@
 import Link from "next/link";
 import { useCallback, useState } from "react";
 import { useSessionStorage } from "../../utils/hooks";
-import type { AuthData, Commentaire, Media } from "../../utils/types";
+import { AuthData, Chara, Commentaire, Media, Person, PersonType } from "../../utils/types";
 
 export default function MediaCard({ media }: { media: Media }) {
   const [auth, setAuth] = useSessionStorage<AuthData>("auth");
 
   const [showAddComment, setShowAddComment] = useState(false);
   const [showAddActor, setShowAddActor] = useState(false);
+  const [persons, setpersons] = useState<Person[] | null>(null);
 
   const addToList = useCallback(
     async (e) => {
@@ -36,6 +37,7 @@ export default function MediaCard({ media }: { media: Media }) {
         });
         const data = await resp.json();
         console.log(data);
+        setpersons(data);
       }
     },
     [showAddActor]
@@ -89,7 +91,7 @@ export default function MediaCard({ media }: { media: Media }) {
           <NewCommentaire media={media} setShowAddComment={setShowAddComment} />
         )}
         {auth && showAddActor && (
-          <AddActor media={media} setShowAddActor={setShowAddActor} />
+          <AddActor media={media} setShowAddActor={setShowAddActor} persons={persons} />
         )}
       </div>
     </div>
@@ -200,22 +202,95 @@ function NewCommentaire({
 function AddActor({
   media,
   setShowAddActor,
+  persons,
 }: {
   media: Media;
   setShowAddActor: React.Dispatch<React.SetStateAction<boolean>>;
+  persons : Person[] | null;
 }) {
+  const [acteur, setacteur] = useState(false);
+  const [characts, setchar] = useState<Chara[]|null>(null);
+
+  const getLinkPerso = useCallback(async (e) => {
+    e.preventDefault();
+    const resp = await fetch(`api/characters/${media.id}/link`, {
+      method: "GET",
+      headers: { "Content-Type": "application/json" },
+    });
+    const data = await resp.json();
+    console.log(data);
+  }, [media.id]
+  );
+
   const handleLinkActor = useCallback(async (e) => {
     e.preventDefault();
-  }, []);
+    const resp = await fetch(`/api/persons/link`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        mediaId : media.id,
+        personsId: e.target.elements.actrorlink.value,
+      }),
+    });
+    const data = await resp.json();
+    console.log(data);
+    location.reload();
+    {persons?.map((personnage) => {
+      if (personnage.id == e.target.elements.actorlink.value && 
+        personnage.type == PersonType.ACTEUR) {
+        setacteur(true);
+      } else {
+        setShowAddActor(false);
+        getLinkPerso;
+      }
+    });}
+  }, [media.id, setShowAddActor, persons, getLinkPerso]);
+
+  const handleLinkPerso = useCallback(async (e) => {
+    e.preventDefault();
+    const resp = await fetch(`api/persons/linkrole`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        personsId: e.target.elements.actrorlink.value,
+        charaId: e.target.elements.persolink.value,
+      }),
+    });
+
+    const data = await resp.json();
+    console.log(data);
+    setShowAddActor(false);
+    setacteur(false);
+  }, [setShowAddActor,setacteur]);
 
   return (
     <div className="mt-1000 flex justify-center items-center flex-col rounded-lg shadow-xl p-2">
-      <form onSubmit={handleLinkActor} className="mx-2">
-        <select name="actorlink">
-          <option></option>
-        </select>
-        <input type="submit" className="rounded-full bg-blue-400 px-3 m-2" />
-      </form>
+      {!acteur && (
+        <form onSubmit={handleLinkActor} className="mx-2">
+          <label className="text-blue-400">People to add</label><br/>
+          <select name="actorlink">
+            {persons?.map((personnage) => (
+              <option value={personnage.id} key={personnage.id}>
+                {personnage.firstName} {personnage.lastName}
+              </option>
+            ))}
+          </select><br/>
+          <input type="submit" className="rounded-full bg-blue-400 px-3 m-2" />
+        </form>
+      )}
+      { acteur && (
+        <form onSubmit={handleLinkPerso} className="mx-2">
+          <label className="text-blue-400">Link the Actor to his Character</label><br/>
+          <select name="persolink">
+            {characts?.map((charact) => (
+              <option value={charact.id} key={charact.id}>
+                {charact.nom}
+              </option>
+            ))}
+          </select><br/>
+          <input type="submit" className="rounded-full bg-blue-400 px-3 m-2" />
+        </form>
+      )}
     </div>
   );
 }
diff --git a/frontend/utils/types.ts b/frontend/utils/types.ts
@@ -34,6 +34,7 @@ export interface Commentaire {
 }
 
 export interface Person {
+  id: number;
   lastName: string;
   firstName: string;
   photoUrl: string;
@@ -52,5 +53,6 @@ export interface Franchise {
 }
 
 export interface Chara {
+  id: number;
   nom: string;
 }