diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 000000000..3a89f035f Binary files /dev/null and b/.DS_Store differ diff --git a/Backend/.DS_Store b/Backend/.DS_Store new file mode 100644 index 000000000..c7035aecf Binary files /dev/null and b/Backend/.DS_Store differ diff --git a/Backend/database copy 2.sqlite b/Backend/database copy 2.sqlite new file mode 100644 index 000000000..f6bd01cd1 Binary files /dev/null and b/Backend/database copy 2.sqlite differ diff --git a/Backend/database.sqlite b/Backend/database.sqlite index f6bd01cd1..f5b7f1ea8 100644 Binary files a/Backend/database.sqlite and b/Backend/database.sqlite differ diff --git a/Backend/images/abajour-tahina1686757704872.png b/Backend/images/abajour-tahina1686757704872.png new file mode 100644 index 000000000..b5b314e19 Binary files /dev/null and b/Backend/images/abajour-tahina1686757704872.png differ diff --git a/Backend/images/abajour-tahina1686758855141.png b/Backend/images/abajour-tahina1686758855141.png new file mode 100644 index 000000000..b5b314e19 Binary files /dev/null and b/Backend/images/abajour-tahina1686758855141.png differ diff --git a/Backend/images/appartement-paris-v1686588398147.png b/Backend/images/appartement-paris-v1686588398147.png new file mode 100644 index 000000000..d5784d495 Binary files /dev/null and b/Backend/images/appartement-paris-v1686588398147.png differ diff --git a/Backend/images/appartement-paris-v1686590395833.png b/Backend/images/appartement-paris-v1686590395833.png new file mode 100644 index 000000000..d5784d495 Binary files /dev/null and b/Backend/images/appartement-paris-v1686590395833.png differ diff --git a/Backend/images/appartement-paris-v1686593904507.png b/Backend/images/appartement-paris-v1686593904507.png new file mode 100644 index 000000000..d5784d495 Binary files /dev/null and b/Backend/images/appartement-paris-v1686593904507.png differ diff --git a/Backend/images/appartement-paris-v1686605018941.png b/Backend/images/appartement-paris-v1686605018941.png new file mode 100644 index 000000000..d5784d495 Binary files /dev/null and b/Backend/images/appartement-paris-v1686605018941.png differ diff --git a/Backend/images/appartement-paris-v1686755988274.png b/Backend/images/appartement-paris-v1686755988274.png new file mode 100644 index 000000000..d5784d495 Binary files /dev/null and b/Backend/images/appartement-paris-v1686755988274.png differ diff --git a/Backend/images/appartement-paris-v1686757539590.png b/Backend/images/appartement-paris-v1686757539590.png new file mode 100644 index 000000000..d5784d495 Binary files /dev/null and b/Backend/images/appartement-paris-v1686757539590.png differ diff --git a/Backend/images/appartement-paris-x1686587401999.png b/Backend/images/appartement-paris-x1686587401999.png new file mode 100644 index 000000000..9d5f5cbde Binary files /dev/null and b/Backend/images/appartement-paris-x1686587401999.png differ diff --git a/Backend/images/appartement-paris-x1686587478291.png b/Backend/images/appartement-paris-x1686587478291.png new file mode 100644 index 000000000..9d5f5cbde Binary files /dev/null and b/Backend/images/appartement-paris-x1686587478291.png differ diff --git a/Backend/images/appartement-paris-x1686591600160.png b/Backend/images/appartement-paris-x1686591600160.png new file mode 100644 index 000000000..9d5f5cbde Binary files /dev/null and b/Backend/images/appartement-paris-x1686591600160.png differ diff --git a/Backend/images/appartement-paris-x1686595080520.png b/Backend/images/appartement-paris-x1686595080520.png new file mode 100644 index 000000000..9d5f5cbde Binary files /dev/null and b/Backend/images/appartement-paris-x1686595080520.png differ diff --git a/Backend/images/appartement-paris-xviii1686591184425.png b/Backend/images/appartement-paris-xviii1686591184425.png new file mode 100644 index 000000000..9d0e54cce Binary files /dev/null and b/Backend/images/appartement-paris-xviii1686591184425.png differ diff --git a/Backend/images/appartement-paris-xviii1686591331711.png b/Backend/images/appartement-paris-xviii1686591331711.png new file mode 100644 index 000000000..9d0e54cce Binary files /dev/null and b/Backend/images/appartement-paris-xviii1686591331711.png differ diff --git a/Backend/images/appartement-paris-xviii1686593847104.png b/Backend/images/appartement-paris-xviii1686593847104.png new file mode 100644 index 000000000..9d0e54cce Binary files /dev/null and b/Backend/images/appartement-paris-xviii1686593847104.png differ diff --git a/Backend/images/appartement-paris-xviii1686756168844.png b/Backend/images/appartement-paris-xviii1686756168844.png new file mode 100644 index 000000000..9d0e54cce Binary files /dev/null and b/Backend/images/appartement-paris-xviii1686756168844.png differ diff --git a/Backend/images/appartement-paris-xviii1686757674069.png b/Backend/images/appartement-paris-xviii1686757674069.png new file mode 100644 index 000000000..9d0e54cce Binary files /dev/null and b/Backend/images/appartement-paris-xviii1686757674069.png differ diff --git a/Backend/images/appartement-paris-xviii1686759337451.png b/Backend/images/appartement-paris-xviii1686759337451.png new file mode 100644 index 000000000..9d0e54cce Binary files /dev/null and b/Backend/images/appartement-paris-xviii1686759337451.png differ diff --git a/Backend/images/bar-lullaby-paris1686590530991.png b/Backend/images/bar-lullaby-paris1686590530991.png new file mode 100644 index 000000000..953b074f8 Binary files /dev/null and b/Backend/images/bar-lullaby-paris1686590530991.png differ diff --git a/Backend/images/bar-lullaby-paris1686604899791.png b/Backend/images/bar-lullaby-paris1686604899791.png new file mode 100644 index 000000000..953b074f8 Binary files /dev/null and b/Backend/images/bar-lullaby-paris1686604899791.png differ diff --git a/Backend/images/bar-lullaby-paris1686755967966.png b/Backend/images/bar-lullaby-paris1686755967966.png new file mode 100644 index 000000000..953b074f8 Binary files /dev/null and b/Backend/images/bar-lullaby-paris1686755967966.png differ diff --git a/Backend/images/bar-lullaby-paris1686757753910.png b/Backend/images/bar-lullaby-paris1686757753910.png new file mode 100644 index 000000000..953b074f8 Binary files /dev/null and b/Backend/images/bar-lullaby-paris1686757753910.png differ diff --git a/Backend/images/finn-QhjgAniliuY-unsplash_11686590216613.png b/Backend/images/finn-QhjgAniliuY-unsplash_11686590216613.png new file mode 100644 index 000000000..935704982 Binary files /dev/null and b/Backend/images/finn-QhjgAniliuY-unsplash_11686590216613.png differ diff --git a/Backend/images/finn-QhjgAniliuY-unsplash_11686681985976.png b/Backend/images/finn-QhjgAniliuY-unsplash_11686681985976.png new file mode 100644 index 000000000..935704982 Binary files /dev/null and b/Backend/images/finn-QhjgAniliuY-unsplash_11686681985976.png differ diff --git a/Backend/images/finn-QhjgAniliuY-unsplash_11686757691428.png b/Backend/images/finn-QhjgAniliuY-unsplash_11686757691428.png new file mode 100644 index 000000000..935704982 Binary files /dev/null and b/Backend/images/finn-QhjgAniliuY-unsplash_11686757691428.png differ diff --git a/Backend/images/hotel-first-arte-new-delhi1686512691334.png b/Backend/images/hotel-first-arte-new-delhi1686512691334.png new file mode 100644 index 000000000..9040b6598 Binary files /dev/null and b/Backend/images/hotel-first-arte-new-delhi1686512691334.png differ diff --git a/Backend/images/hotel-first-arte-new-delhi1686591277575.png b/Backend/images/hotel-first-arte-new-delhi1686591277575.png new file mode 100644 index 000000000..9040b6598 Binary files /dev/null and b/Backend/images/hotel-first-arte-new-delhi1686591277575.png differ diff --git a/Backend/images/hotel-first-arte-new-delhi1686682113413.png b/Backend/images/hotel-first-arte-new-delhi1686682113413.png new file mode 100644 index 000000000..9040b6598 Binary files /dev/null and b/Backend/images/hotel-first-arte-new-delhi1686682113413.png differ diff --git a/Backend/images/hotel-first-arte-new-delhi1686757774674.png b/Backend/images/hotel-first-arte-new-delhi1686757774674.png new file mode 100644 index 000000000..9040b6598 Binary files /dev/null and b/Backend/images/hotel-first-arte-new-delhi1686757774674.png differ diff --git a/Backend/images/hotel-first-arte-new-delhi1686846120360.png b/Backend/images/hotel-first-arte-new-delhi1686846120360.png new file mode 100644 index 000000000..9040b6598 Binary files /dev/null and b/Backend/images/hotel-first-arte-new-delhi1686846120360.png differ diff --git a/Backend/images/hotel-first-arte-new-delhi1686846515997.png b/Backend/images/hotel-first-arte-new-delhi1686846515997.png new file mode 100644 index 000000000..9040b6598 Binary files /dev/null and b/Backend/images/hotel-first-arte-new-delhi1686846515997.png differ diff --git a/Backend/images/la-balisiere1686588138349.png b/Backend/images/la-balisiere1686588138349.png new file mode 100644 index 000000000..8848c50ca Binary files /dev/null and b/Backend/images/la-balisiere1686588138349.png differ diff --git a/Backend/images/la-balisiere1686593982031.png b/Backend/images/la-balisiere1686593982031.png new file mode 100644 index 000000000..8848c50ca Binary files /dev/null and b/Backend/images/la-balisiere1686593982031.png differ diff --git a/Backend/images/la-balisiere1686595926854.png b/Backend/images/la-balisiere1686595926854.png new file mode 100644 index 000000000..8848c50ca Binary files /dev/null and b/Backend/images/la-balisiere1686595926854.png differ diff --git a/Backend/images/la-balisiere1686755948020.png b/Backend/images/la-balisiere1686755948020.png new file mode 100644 index 000000000..8848c50ca Binary files /dev/null and b/Backend/images/la-balisiere1686755948020.png differ diff --git a/Backend/images/la-balisiere1686757732780.png b/Backend/images/la-balisiere1686757732780.png new file mode 100644 index 000000000..8848c50ca Binary files /dev/null and b/Backend/images/la-balisiere1686757732780.png differ diff --git a/Backend/images/la-balisiere1686759316692.png b/Backend/images/la-balisiere1686759316692.png new file mode 100644 index 000000000..8848c50ca Binary files /dev/null and b/Backend/images/la-balisiere1686759316692.png differ diff --git a/Backend/images/la-balisiere1686846597042.png b/Backend/images/la-balisiere1686846597042.png new file mode 100644 index 000000000..8848c50ca Binary files /dev/null and b/Backend/images/la-balisiere1686846597042.png differ diff --git a/Backend/images/la-balisiere1686846622420.png b/Backend/images/la-balisiere1686846622420.png new file mode 100644 index 000000000..8848c50ca Binary files /dev/null and b/Backend/images/la-balisiere1686846622420.png differ diff --git a/Backend/images/le-coteau-cassis1686588035938.png b/Backend/images/le-coteau-cassis1686588035938.png new file mode 100644 index 000000000..4b4210985 Binary files /dev/null and b/Backend/images/le-coteau-cassis1686588035938.png differ diff --git a/Backend/images/le-coteau-cassis1686594080240.png b/Backend/images/le-coteau-cassis1686594080240.png new file mode 100644 index 000000000..4b4210985 Binary files /dev/null and b/Backend/images/le-coteau-cassis1686594080240.png differ diff --git a/Backend/images/le-coteau-cassis1686755908929.png b/Backend/images/le-coteau-cassis1686755908929.png new file mode 100644 index 000000000..4b4210985 Binary files /dev/null and b/Backend/images/le-coteau-cassis1686755908929.png differ diff --git a/Backend/images/le-coteau-cassis1686757660007.png b/Backend/images/le-coteau-cassis1686757660007.png new file mode 100644 index 000000000..4b4210985 Binary files /dev/null and b/Backend/images/le-coteau-cassis1686757660007.png differ diff --git a/Backend/images/le-coteau-cassis1686757805456.png b/Backend/images/le-coteau-cassis1686757805456.png new file mode 100644 index 000000000..4b4210985 Binary files /dev/null and b/Backend/images/le-coteau-cassis1686757805456.png differ diff --git a/Backend/images/photo-9143881686588262044.jpg b/Backend/images/photo-9143881686588262044.jpg new file mode 100644 index 000000000..ce95935bc Binary files /dev/null and b/Backend/images/photo-9143881686588262044.jpg differ diff --git a/Backend/images/photo-9143881686588316381.jpg b/Backend/images/photo-9143881686588316381.jpg new file mode 100644 index 000000000..ce95935bc Binary files /dev/null and b/Backend/images/photo-9143881686588316381.jpg differ diff --git a/Backend/images/photo-9143881686588369673.jpg b/Backend/images/photo-9143881686588369673.jpg new file mode 100644 index 000000000..ce95935bc Binary files /dev/null and b/Backend/images/photo-9143881686588369673.jpg differ diff --git a/Backend/images/photo-9143881686589970340.jpg b/Backend/images/photo-9143881686589970340.jpg new file mode 100644 index 000000000..ce95935bc Binary files /dev/null and b/Backend/images/photo-9143881686589970340.jpg differ diff --git a/Backend/images/photo-9143881686757113767.jpg b/Backend/images/photo-9143881686757113767.jpg new file mode 100644 index 000000000..ce95935bc Binary files /dev/null and b/Backend/images/photo-9143881686757113767.jpg differ diff --git a/Backend/images/photo-lampe1686757498875.jpg b/Backend/images/photo-lampe1686757498875.jpg new file mode 100644 index 000000000..f2ce19cd4 Binary files /dev/null and b/Backend/images/photo-lampe1686757498875.jpg differ diff --git a/Backend/images/restaurant-sushisen-londres1686587959538.png b/Backend/images/restaurant-sushisen-londres1686587959538.png new file mode 100644 index 000000000..9ef5faed7 Binary files /dev/null and b/Backend/images/restaurant-sushisen-londres1686587959538.png differ diff --git a/Backend/images/restaurant-sushisen-londres1686757790922.png b/Backend/images/restaurant-sushisen-londres1686757790922.png new file mode 100644 index 000000000..9ef5faed7 Binary files /dev/null and b/Backend/images/restaurant-sushisen-londres1686757790922.png differ diff --git a/Backend/images/structures-thermopolis1686756152520.png b/Backend/images/structures-thermopolis1686756152520.png new file mode 100644 index 000000000..16510c087 Binary files /dev/null and b/Backend/images/structures-thermopolis1686756152520.png differ diff --git a/Backend/images/structures-thermopolis1686761147888.png b/Backend/images/structures-thermopolis1686761147888.png new file mode 100644 index 000000000..16510c087 Binary files /dev/null and b/Backend/images/structures-thermopolis1686761147888.png differ diff --git a/Backend/images/villa-ferneze1686757717043.png b/Backend/images/villa-ferneze1686757717043.png new file mode 100644 index 000000000..afb1d38c0 Binary files /dev/null and b/Backend/images/villa-ferneze1686757717043.png differ diff --git a/FrontEnd/.DS_Store b/FrontEnd/.DS_Store new file mode 100644 index 000000000..1c456e7ff Binary files /dev/null and b/FrontEnd/.DS_Store differ diff --git a/FrontEnd/app.js b/FrontEnd/app.js new file mode 100644 index 000000000..051a54ba3 --- /dev/null +++ b/FrontEnd/app.js @@ -0,0 +1,18 @@ +import ApiDataProvider from "./src/ApiDataProvider.js"; +import CardBuilder from "./src/CardBuilder.js"; +import EventListener from "./src/EventListener.js"; +import ModalBuilder from "./src/ModalBuilder.js"; +import UserLogin from "./src/UserLogin.js"; + +EventListener.listen(); +UserLogin.validToken(); + +ApiDataProvider.getCategories().then((categories) => { + CardBuilder.displayCategories(categories); + ModalBuilder.selectCategoryId(); +}); + +ApiDataProvider.getProjects().then((projects) => { + CardBuilder.displayProjects(projects); + ModalBuilder.displayModalProjects(projects); +}); diff --git a/FrontEnd/assets/.DS_Store b/FrontEnd/assets/.DS_Store new file mode 100644 index 000000000..0f1679010 Binary files /dev/null and b/FrontEnd/assets/.DS_Store differ diff --git a/FrontEnd/assets/icons/.DS_Store b/FrontEnd/assets/icons/.DS_Store new file mode 100644 index 000000000..4606a5270 Binary files /dev/null and b/FrontEnd/assets/icons/.DS_Store differ diff --git a/FrontEnd/assets/icons/Move.svg b/FrontEnd/assets/icons/Move.svg new file mode 100644 index 000000000..a32910603 --- /dev/null +++ b/FrontEnd/assets/icons/Move.svg @@ -0,0 +1,4 @@ + + + + diff --git a/FrontEnd/assets/icons/arrow-left-long-solid.svg b/FrontEnd/assets/icons/arrow-left-long-solid.svg new file mode 100644 index 000000000..b4320aff6 --- /dev/null +++ b/FrontEnd/assets/icons/arrow-left-long-solid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/FrontEnd/assets/icons/arrows-up-down-left-right-solid.svg b/FrontEnd/assets/icons/arrows-up-down-left-right-solid.svg new file mode 100644 index 000000000..0c9033f54 --- /dev/null +++ b/FrontEnd/assets/icons/arrows-up-down-left-right-solid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/FrontEnd/assets/icons/icons-image.png b/FrontEnd/assets/icons/icons-image.png new file mode 100644 index 000000000..6970caa7d Binary files /dev/null and b/FrontEnd/assets/icons/icons-image.png differ diff --git a/FrontEnd/assets/icons/pen-to-square white.png b/FrontEnd/assets/icons/pen-to-square white.png new file mode 100644 index 000000000..898926d44 Binary files /dev/null and b/FrontEnd/assets/icons/pen-to-square white.png differ diff --git a/FrontEnd/assets/icons/pen-to-square-regular.svg b/FrontEnd/assets/icons/pen-to-square-regular.svg new file mode 100644 index 000000000..27eb7c9b5 --- /dev/null +++ b/FrontEnd/assets/icons/pen-to-square-regular.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/FrontEnd/assets/icons/trash-can-regular.svg b/FrontEnd/assets/icons/trash-can-regular.svg new file mode 100644 index 000000000..22e7133cc --- /dev/null +++ b/FrontEnd/assets/icons/trash-can-regular.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/FrontEnd/assets/icons/trash-can-regular2.svg b/FrontEnd/assets/icons/trash-can-regular2.svg new file mode 100644 index 000000000..27ee29cd8 --- /dev/null +++ b/FrontEnd/assets/icons/trash-can-regular2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/FrontEnd/assets/images/finn-QhjgAniliuY-unsplash 1.png b/FrontEnd/assets/images/finn-QhjgAniliuY-unsplash 1.png new file mode 100644 index 000000000..935704982 Binary files /dev/null and b/FrontEnd/assets/images/finn-QhjgAniliuY-unsplash 1.png differ diff --git a/FrontEnd/assets/style.css b/FrontEnd/assets/style.css index 7bca0ed1a..1b86ea1b8 100644 --- a/FrontEnd/assets/style.css +++ b/FrontEnd/assets/style.css @@ -31,6 +31,14 @@ footer, header, hgroup, menu, nav, section { body { line-height: 1; } +#conteneur-page { + position: relative; + min-height: 100vh; + width: 100%; +} +main { + padding-bottom: 3.75rem; +} ol, ul { list-style: none; } @@ -49,19 +57,328 @@ table { /** end reset css**/ body { max-width: 1140px; + height: 100%; margin:auto; font-family: 'Work Sans' ; font-size: 14px; + background-color: #FFFEF8; +} + + +/************************* MODALES GENERALES ************************/ +.modal-container { + display: none; +} +.modal-container-active{ + display: block; +} +.overlay { + position: absolute; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.3); +} +.modal { + position: absolute; + background: #FFFFFF; + border-radius: 10px; + left: 50%; + transform: translateX(-50%); + top: 600px; + width: 67%; + display: inline-block; + min-height: 450px; + height: 750px; +} +.modal-hidden { + display: none; +} + +/***** Modale de la galerie *****/ +.errorMessage{ + color: red; + font-weight: 700; + text-align: center; + padding-top: 10px; +} +.modal h3 { + position: absolute; + width: 100%; + top: 60px; + font-size: 26px; + text-align: center; +} +/** bouton pour fermer la modale **/ +.close-btn { + position: absolute; + top: 26px; + right: 30px; + background-color: #FFFFFF; + border: none; + cursor: pointer; +} +/** div avec tous les projets **/ +.modal-contain-projects { + position: absolute; + left: 50%; + transform: translateX(-50%); + top: 100px; + display: grid; + grid-template-columns: repeat(5, 100px); + overflow: scroll; + min-height: 270px; + max-height: 460px; +} + +/** élément figure **/ +.modal-figure-project { + position: relative; + display: flex; + flex-direction: column; + width: 90%; + height: 156px; + /* margin-top: 10px; */ +} +/** bouton image poubelle**/ +.modal-delete-btn { + position: absolute; + background-color: transparent; + border: none; + top: 5px; + right: 5px; + width: 17px; + height: 17px; + cursor: pointer; +} +/** icône poubelle **/ +.modal-delete-project { + position: absolute; + background-color: #000000; + border: none; + border-radius: 2px; + top: 0; + right: 0; +} +/** icône flêche **/ +.modale-arrow-project { + display: none; +} +/** Image de la modale **/ +.modal-image-project { + height: 80%; +} +/** active icône flêche au survol de l'image **/ +.modal-image-project:hover ~ .modale-arrow-project { + display: block; + position: absolute; + background-color: #000000; + border: none; + border-radius: 2px; + width: 14px; + height: 14px; + top: 5px; + right: 25px; + +} +/** style des deux images "poubelle" et "flêche" **/ +.modale-arrow-project { + width: 10px; + height: 10px; + padding: 2px; +} +/** bouton "éditer" **/ +.modal-button-project { + background-color: #fff; + border: none; + color: #000; + font-size: 12px; + text-align: start; + margin-top: 2px; + cursor: pointer; +} +.modal hr { + position: absolute; + width: 420px; + bottom: 150px; + left: 50%; + transform: translate(-50%, -50%); + border: 1px solid #B3B3B3; +} +/** bouton Ajouter une photo **/ +#addPicture { + position: absolute; + bottom: 70px; + left: 50%; + transform: translate(-50%, -50%); + background: #1D6154; + border-radius: 60px; + border: none; + color: #fff; + padding: 10px 50px; + cursor: pointer; +} +/** Supprimer toutes les photos **/ +#deleteAllPicture { + position: absolute; + bottom: 35px; + left: 50%; + transform: translate(-50%, -50%); + background-color: #fff; + color: #D65353; + border: none; + cursor: pointer; +} +/*********** Modale ajout photo ************/ + +/** conteneur pour ajouter l'image **/ +/** bouton retour à la modale galerie **/ +.return-modal-gallery { + position: absolute; + width: 40px; + height: 15px; + top: 26px; + left: 10px; + padding: 0; + border: none; + background-color: #fff; + cursor: pointer; +} +.return-modal-gallery img { + width: 100%; + height: 100%; +} + +/** conteneur ajout de l'image + label/input + submit **/ +.picture-modal-contain { + position: absolute; + width: 420px; + height: 190px; + top: 210px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + background: #E8F1F7; + border-radius: 3px; + left: 50%; + transform: translate(-50%, -50%); +} +.modal-ajout-picture { + width: 100%; + height: 100%; +} +#imagePreview { + min-width: 70px; + min-height: 70px; +} +#buttonAddProject { + width: 175px; + height: 40px; + padding: auto; + background: #CBD6DC; + border-radius: 50px; + border: none; + margin: 10px 0; + color: #306685; + cursor: pointer; +} +.textPreview { + font-size: 10px; + color: #444444; +} +/* messages d'erreur au submit */ +.errorSubmit { + color: red; + font-weight: 700; +} +/* message d'erreur image */ +#theImage { + position: absolute; + top: 310px; + left: 22%; +} +/*message d'erreur titre */ +#theTitle { + margin-bottom: 10px; +} + +/* conteneur label-input */ +.input-modal-picture { + position: absolute; + display: flex; + flex-direction: column; + top: 440px; + left: 50%; + transform: translate(-50%, -50%); +} +.input-modal-picture label { + color: #3D3D3D; + font-size: 14px; +} +#title-picture, #categorie-picture { + width: 420px; + height: 50px; + margin: 10px 0 20px 0; + border: none; + background: #FFFFFF; + box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.09); +} +.picture-modal hr { + position: absolute; + bottom: 170px; +} +#submitPicture { + position: absolute; + background-color: #A7A7A7; + border: none; + border-radius: 60px; + left: 50%; + transform: translate(-50%, -50%); + padding: 10px 49px; + color: #fff; + bottom: 60px; + width: 240px; +} + +/************************* MODE EDITION **********************/ +.hidden { + display: none; +} +.mode { + display: flex; + justify-content: center; + align-items: center; + height: 60px; + background-color: #000; +} +.mode img { + width: 20px; + height: 20px; } +.mode p { + color: #FFFFFF; + margin: 0 20px 0 7px; +} +.mode button { + background-color: #fff; + border: none; + border-radius: 60px; + padding: 10px 23px; +} + +/********************************* HEADER **********************/ header { display: flex; justify-content: space-between; margin: 50px 0 } +header a { + text-decoration: none; + color: black; +} section { margin: 50px 0 } - h1{ display: flex; flex-direction: column; @@ -70,34 +387,35 @@ h1{ font-weight: 800; color: #B1663C } - h1 > span { font-family: 'Work Sans'; font-size:10px; letter-spacing: 0.1em; -; -} - -h2{ - font-family: 'Syne'; - font-weight: 700; - font-size: 30px; - color: #1D6154 } nav ul { display: flex; align-items: center; list-style-type: none; - } nav li { padding: 0 10px; font-size: 1.2em; } - li:hover { color: #B1663C; } +li a:hover { + color: #B1663C; + cursor: pointer; +} + +/*********** SECTION 1 AVEC PHOTO ET PARAGRAPHE **********/ +h2{ + font-family: 'Syne'; + font-weight: 700; + font-size: 30px; + color: #1D6154 +} #introduction { display: flex; align-items: center; @@ -121,10 +439,57 @@ li:hover { #introduction p { margin-bottom: 0.5em; } + #portfolio h2 { text-align: center; margin-bottom: 1em; } +/** modifier la photo de profil **/ +.photo-hidden { + display: flex; + width: 14px; + height: 14px; + margin: 15px 0 0 55px; +} +/** section contenant le h2, le bouton et l'image modifier **/ +.projet { + display: flex; + justify-content: center; +} +.edit { + display: flex; + padding-top: 0.75em; + margin-left: 30px; +} +/** icône "pen to square **/ +.img-edit { + width: 14px; + height: 14px; +} +/** bouton pour modifier les projets **/ +.edit-btn { + background-color: #FFFEF8; + border: none; + height: 15px; + cursor: pointer; +} +/******************* LES FILTRES *********************/ +.button-filter { + display: block; + text-align: center; + margin-bottom: 2em; +} +.categorie-button { + font-family: 'Syne'; + color: #1D6154; + background-color: #FFFEF8; + margin-left: 1rem; + padding: 9px 20px; + border: 1px solid #1D6154; + border-radius: 60px; + cursor: pointer; +} +/********************** GALLERIES D'IMAGES ****************/ .gallery { width: 100%; display: grid; @@ -132,18 +497,18 @@ li:hover { grid-column-gap: 20px; grid-row-gap: 20px; } - .gallery img { width: 100%; - + height: 90%; + margin-bottom: 10px; } +/********************* FORMULAIRE DE CONTACT ****************/ #contact { width: 50%; margin: auto; } #contact > * { text-align: center; - } #contact h2{ margin-bottom: 20px; @@ -154,7 +519,6 @@ margin: auto; display: flex; flex-direction: column; } - #contact input { height: 50px; font-size: 1.2em; @@ -168,7 +532,6 @@ margin: auto; border: none; box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.09); } - input[type="submit"]{ font-family: 'Syne'; font-weight: 700; @@ -179,6 +542,14 @@ input[type="submit"]{ text-align: center; border-radius: 60px ; } +/************************* FOOTER **************************/ +footer { + background-color: #FFFFFF; + position: absolute; + bottom: 0; + width: 100%; + height: 3.75rem; +} footer nav ul { display: flex; @@ -186,3 +557,55 @@ footer nav ul { margin: 2em } +/************************* Page Login ****************************/ + +#login { + width: 50%; + margin: auto; + text-align: center; +} +#login h2 { + padding: 50px 0; +} +#login a { + color: black; +} +.mail, .password { + width: 70%; + display: flex; + flex-direction: column; + margin: auto; +} +.mail label, .password label { + text-align: start; + margin-bottom: 10px; +} +.mail input, .password input { + height: 50px; + width: 100%; + margin-bottom: 30px; + background: #FFFFFF; + border: none; + box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.09); +} +.button { + background: #1D6154; + border: none; + border-radius: 60px; + padding: 10px 40px; + margin-top: 20px; + cursor: pointer; +} +.connect { + color: #FFFFFF; +} +.ancre { + margin: 40px 0 20px 0; +} +.error{ + color: red; + font-weight: 700; +} + + + diff --git a/FrontEnd/index.html b/FrontEnd/index.html index 3f4a16298..efb071fa0 100644 --- a/FrontEnd/index.html +++ b/FrontEnd/index.html @@ -11,99 +11,129 @@ -
-

Sophie Bluel Architecte d'inteérieur

- -
-
-
-
- -
-
-

Designer d'espace

-

Je raconte votre histoire, je valorise vos idées. Je vous accompagne de la conception à la livraison finale du chantier.

-

Chaque projet sera étudié en commun, de façon à mettre en valeur les volumes, les matières et les couleurs dans le respect de l’esprit des lieux et le choix adapté des matériaux. Le suivi du chantier sera assuré dans le souci du détail, le respect du planning et du budget.

-

En cas de besoin, une équipe pluridisciplinaire peut-être constituée : architecte DPLG, décorateur(trice)

-
-
-
-

Mes Projets

-
-
- Abajour Tahina -
Abajour Tahina
-
-
- Appartement Paris V -
Appartement Paris V
-
-
- Restaurant Sushisen - Londres -
Restaurant Sushisen - Londres
-
-
- Villa “La Balisiere” - Port Louis -
Villa “La Balisiere” - Port Louis
-
-
- Structures Thermopolis -
Structures Thermopolis
-
-
- Appartement Paris X -
Appartement Paris X
-
-
- Pavillon “Le coteau” - Cassis -
Pavillon “Le coteau” - Cassis
-
-
- Villa Ferneze - Isola d’Elba -
Villa Ferneze - Isola d’Elba
-
-
- Appartement Paris XVIII -
Appartement Paris XVIII
-
-
- Bar “Lullaby” - Paris -
Bar “Lullaby” - Paris
-
-
- Hotel First Arte - New Delhi -
Hotel First Arte - New Delhi
-
+
+ -
-
-

Contact

-

Vous avez un projet ? Discutons-en !

-
- - - - - - - -
-
-
- - + +
+

Sophie Bluel Architecte d'intérieur

+ +
+
+
+
+ + +
+
+

Designer d'espace

+

Je raconte votre histoire, je valorise vos idées. Je vous accompagne de la conception à la livraison finale du chantier.

+

Chaque projet sera étudié en commun, de façon à mettre en valeur les volumes, les matières et les couleurs dans le respect de l’esprit des lieux et le choix adapté des matériaux. Le suivi du chantier sera assuré dans le souci du détail, le respect du planning et du budget.

+

En cas de besoin, une équipe pluridisciplinaire peut-être constituée : architecte DPLG, décorateur(trice)

+
+
+
+
+

Mes Projets

+ +
+ +
+
+
+

Contact

+

Vous avez un projet ? Discutons-en !

+
+ + + + + + + +
+
+
+ + + + + + diff --git a/FrontEnd/login.html b/FrontEnd/login.html new file mode 100644 index 000000000..677e33850 --- /dev/null +++ b/FrontEnd/login.html @@ -0,0 +1,57 @@ + + + + + Sophie Bluel - Architecte d'intérieur + + + + + + + + +
+
+

Sophie Bluel Architecte d'intérieur

+ +
+
+
+

Log In

+
+ + +
+
+ + + +
+ +
+ Mot de passe oublié +
+
+
+ + +
+ + + + + \ No newline at end of file diff --git a/FrontEnd/src/ApiDataProvider.js b/FrontEnd/src/ApiDataProvider.js new file mode 100644 index 000000000..1cd2cfc2e --- /dev/null +++ b/FrontEnd/src/ApiDataProvider.js @@ -0,0 +1,79 @@ +import CardBuilder from "./CardBuilder.js"; +import ModalBuilder from "./ModalBuilder.js"; + +export default class ApiDataProvider { + // méthode getProjects qui récupère tous les projets de l'Api + static getProjects() { + return fetch("http://localhost:5678/api/works") + .then((res) => res.json()) + .then((projects) => { + return projects; + }); + } + + // méthode GetProjectsByCatgerotyId qui récupère en filtrant les projets selon l'id + static getProjectsByCategoryId(categoryId) { + return ApiDataProvider.getProjects().then((projects) => { + return projects.filter((project) => { + return project.category.id == categoryId; + }); + }); + } + + // méthode getCategories qui récupère les différents filtres de l'Api + static getCategories() { + return fetch("http://localhost:5678/api/categories") + .then((res) => res.json()) + .then((categories) => { + let categoriesSet = new Set(); + categories.map((category) => { + categoriesSet.add(category); + }); + return categoriesSet; + }); + } + + // méthode DELETE afin de supprimer un projet + static deleteProjects(id) { + fetch("http://localhost:5678/api/works/" + id, { + method: "DELETE", + headers: { + accept: "*/*", + Authorization: `Bearer ${window.localStorage.getItem("token")}`, + }, + }).then((response) => { + if (response.ok) { + document.querySelector(".modal-contain-projects").innerHTML = ""; + return ApiDataProvider.getProjects().then((projects) => { + CardBuilder.displayProjects(projects); + ModalBuilder.displayModalProjects(projects); + }); + } else { + ModalBuilder.errorMessageModaleGallery(); + } + }); + } + + // méthode POST pour ajouter des travaux + static addNewProjects(data) { + fetch("http://localhost:5678/api/works", { + method: "POST", + headers: { + Accept: "application/json", + Authorization: `Bearer ${window.localStorage.getItem("token")}`, + }, + body: data, + }).then((response) => { + if (response.ok) { + document.querySelector(".modal-contain-projects").innerHTML = ""; + + ApiDataProvider.getProjects().then((projects) => { + CardBuilder.displayProjects(projects); + ModalBuilder.displayModalProjects(projects); + }); + } else { + ModalBuilder.errorMessageModaleGallery(); + } + }); + } +} diff --git a/FrontEnd/src/CardBuilder.js b/FrontEnd/src/CardBuilder.js new file mode 100644 index 000000000..fded743b7 --- /dev/null +++ b/FrontEnd/src/CardBuilder.js @@ -0,0 +1,36 @@ +export default class CardBuilder { + // afficher les projets + static displayProjects(projects) { + document.querySelector(".gallery").innerHTML = ""; + projects.map((project) => { + const figureEl = document.createElement("figure"); + const imageEl = document.createElement("img"); + const figcaptionEl = document.createElement("figcaption"); + imageEl.src = project.imageUrl; + imageEl.alt = project.title; + figcaptionEl.innerText = project.title; + figureEl.dataset.type = project.category.name; + figureEl.dataset.id = project.id; + figureEl.appendChild(imageEl); + figureEl.appendChild(figcaptionEl); + document.querySelector(".gallery").appendChild(figureEl); + }); + } + + // afficher les boutons du filtre + static displayCategories(categories) { + const buttonFilter = document.querySelector(".button-filter"); + const btnTous = document.createElement("button"); + btnTous.innerText = "Tous"; + btnTous.className = "categorie-button"; + btnTous.dataset.type = "Tous"; + buttonFilter?.appendChild(btnTous); + for (let category of categories) { + const btn = document.createElement("button"); + btn.innerText = category.name; + btn.className = "categorie-button"; + btn.dataset.type = category.id; + buttonFilter?.appendChild(btn); + } + } +} diff --git a/FrontEnd/src/EventListener.js b/FrontEnd/src/EventListener.js new file mode 100644 index 000000000..bbd47f84d --- /dev/null +++ b/FrontEnd/src/EventListener.js @@ -0,0 +1,211 @@ +import ApiDataProvider from "./ApiDataProvider.js"; +import CardBuilder from "./CardBuilder.js"; +import ModalBuilder from "./ModalBuilder.js"; + +export default class EvenListener { + static listen() { + this.listenClickOnButtonFilter(); + this.loginLogout(); + this.openModal(); + this.closeModal(); + this.removeProject(); + this.previewProject(); + this.saveProject(); + } + + // Fonction pour faire jouer le filtre + static listenClickOnButtonFilter() { + // si je click sur la div contenant les filtres + document + .querySelector(".button-filter") + .addEventListener("click", (event) => { + const isButtonFilter = + event.target.classList.contains("categorie-button"); + + // si je click ailleurs qu'un bouton du filtre, je stop + if (false === isButtonFilter) { + return false; + } + + //récupérer le dataset type + const categoryId = event.target.dataset["type"]; + + const promise = + categoryId == "Tous" + ? ApiDataProvider.getProjects() + : ApiDataProvider.getProjectsByCategoryId(categoryId); + + promise.then((projects) => { + CardBuilder.displayProjects(projects); + }); + }); + } + + //méthode pour se connecter ou se deconnecter + static loginLogout() { + document.getElementById("log").addEventListener("click", () => { + if (window.localStorage.getItem("token")) { + window.localStorage.removeItem("token"); + window.location.reload(); + } else { + window.location.href = "./login.html"; + } + }); + } + + // évenement au click pour ouvrir la modale + static openModal() { + // ouvrir la modale gallery avec click sur bouton "modifier" + document.getElementById("editBtn").addEventListener("click", () => { + modalContainer.classList.remove("modal-container"); + modalContainer.classList.add("modal-containter-active"); + document.querySelector(".modalGallery").classList.remove("modal-hidden"); + document.getElementById("modalPicture").classList.add("modal-hidden"); + }); + + // ouvrir la modale picture au click sur bouton "ajouter photo" + document.getElementById("addPicture").addEventListener("click", () => { + document.querySelector(".modalGallery").classList.add("modal-hidden"); + document.getElementById("modalPicture").classList.remove("modal-hidden"); + ModalBuilder.blankMessageErrorSubmit(); + document.getElementById("submitPicture").style.backgroundColor = + "#A7A7A7"; + document.getElementById("submitPicture").style.cursor = "default"; + }); + + // ouvrir la modale gallery au click sur la flèche retour + document + .querySelector(".return-modal-gallery") + .addEventListener("click", () => { + // remettre à blanc la modale "ajout photo" + ModalBuilder.blankModalPicture(); + //changer de modale + document + .querySelector(".modalGallery") + .classList.remove("modal-hidden"); + document.getElementById("modalPicture").classList.add("modal-hidden"); + }); + } + + // évènement au click pour fermer la modale + static closeModal() { + //cibler les éléments qui doivent fermer la modale + const closeModales = document.querySelectorAll(".closeModal"); + + closeModales.forEach((closure) => { + closure.addEventListener("click", () => { + modalContainer.classList.remove("modal-containter-active"); + modalContainer.classList.add("modal-container"); + }); + }); + } + + // // créer un évenement au "click" pour supprimer un projet + static removeProject() { + document + .querySelector("#modalWrapper") + .addEventListener("click", (event) => { + const isDeleteButton = event.target.classList.contains( + "modal-delete-project" + ); + if (isDeleteButton) { + const projectId = event.target.closest(".modal-figure-project") + .dataset["id"]; + + ApiDataProvider.deleteProjects(projectId); + } + }); + return false; + } + + static previewProject() { + // evenement pour prévisualiser et conserver la photo à ajouter + const imageInput = document.getElementById("imageInput"); + const imagePreview = document.getElementById("imagePreview"); + const btnAddProject = document.getElementById("buttonAddProject"); + + btnAddProject.addEventListener("click", (event) => { + event.preventDefault(); + imageInput.click(); + }); + + imageInput.addEventListener("change", () => { + const [file] = imageInput.files; + const reader = new FileReader(); + // console.log(file); + if (file) { + if (file.size > 4194304) { + alert( + "Votre photo dépasse les 4Mo autorisé, elle ne peut pas être ajouté à votre galerie" + ); + } + imagePreview.src = URL.createObjectURL(file); + imagePreview.alt = file.name; + imagePreview.classList.remove("hidden"); + imageInput.classList.add("hidden"); + btnAddProject.classList.add("hidden"); + document.querySelector(".iconePreview").classList.add("hidden"); + document.querySelector(".textPreview").classList.add("hidden"); + + reader.addEventListener( + "load", + () => { + // On convertit l'image en chaine de caractère + imagePreview.src = reader.result; + }, + false + ); + reader.readAsDataURL(file); + } + }); + } + + // evenement pour sauvegarder l'ajout du projet au submit + static saveProject() { + // changer le style du bouton "valider" si tous les champs sont renseignés + ModalBuilder.activeBtnSubmit(); + + const pictureForm = document.querySelector(".formSubmit"); + pictureForm.addEventListener("submit", (event) => { + event.preventDefault(); + // s'assurer aucun message d'erreur afficher sur la modale picture + ModalBuilder.blankMessageErrorSubmit(); + + const inputImage = document.getElementById("imageInput"); + const inputTitle = document.getElementById("title-picture"); + const inputCategory = document.getElementById("categorie-picture"); + + // verifier que tous les élements sont renseignés avant d'envoyer le formulaire + if (inputImage.value === "") { + document.getElementById("theImage").classList.remove("hidden"); + } + if (inputTitle.value === "") { + document.getElementById("theTitle").classList.remove("hidden"); + } + if (inputCategory.value === "") { + document.getElementById("theCategory").classList.remove("hidden"); + } + + // récupérer les données du formulaire et l'envoyer à l'api + if ( + inputImage.value !== "" && + inputTitle.value !== "" && + inputCategory.value !== "" + ) { + const formData = new FormData(); + formData.append("image", inputImage.files[0]); + formData.append("title", inputTitle.value); + formData.append("category", inputCategory.value); + + ApiDataProvider.addNewProjects(formData); + // remettre à blanc la modale "ajout photo" + ModalBuilder.blankModalPicture(); + + document + .querySelector(".modalGallery") + .classList.remove("modal-hidden"); + document.getElementById("modalPicture").classList.add("modal-hidden"); + } + }); + } +} diff --git a/FrontEnd/src/ModalBuilder.js b/FrontEnd/src/ModalBuilder.js new file mode 100644 index 000000000..ac174c292 --- /dev/null +++ b/FrontEnd/src/ModalBuilder.js @@ -0,0 +1,107 @@ +import ApiDataProvider from "./ApiDataProvider.js"; + +export default class ModalBuilder { + // afficher les projets dans la modale + static displayModalProjects(projects) { + projects.map((project) => { + const figureModal = document.createElement("figure"); + const imageModal = document.createElement("img"); + const arrowFigureModal = document.createElement("img"); + const deleteBtn = document.createElement("button"); + const deleteFigureModal = document.createElement("img"); + const buttonModal = document.createElement("button"); + imageModal.src = project.imageUrl; + imageModal.alt = project.title; + arrowFigureModal.src = "./assets/icons/move.svg"; + arrowFigureModal.alt = "icône flêche"; + deleteFigureModal.src = "./assets/icons/trash-can-regular.svg"; + deleteFigureModal.alt = "icône poubelle"; + buttonModal.innerText = "éditer"; + figureModal.dataset.id = project.id; + figureModal.dataset.type = project.category.name; + figureModal.className = "modal-figure-project"; + imageModal.className = "modal-image-project"; + arrowFigureModal.className = "modale-arrow-project"; + deleteBtn.className = "modal-delete-btn"; + deleteFigureModal.className = "modal-delete-project"; + buttonModal.className = "modal-button-project"; + deleteBtn.type = "button"; + figureModal.appendChild(imageModal); + figureModal.appendChild(buttonModal); + figureModal.appendChild(arrowFigureModal); + figureModal.appendChild(deleteBtn); + deleteBtn.appendChild(deleteFigureModal); + document + .querySelector(".modal-contain-projects") + .appendChild(figureModal); + }); + } + + // méthode pour ajouter les categories dans la modal ajoutPicture + static selectCategoryId() { + const selectCategorie = document.getElementById("categorie-picture"); + + const allCategories = ApiDataProvider.getCategories(); + + allCategories.then((categoryId) => { + for (let category of categoryId) { + const optionSelect = document.createElement("option"); + optionSelect.value = category.id; + optionSelect.innerText = category.name; + selectCategorie?.appendChild(optionSelect); + } + }); + } + + // méthode pour activer la couleur du bouton submit + static activeBtnSubmit() { + const inputImage = document.getElementById("imageInput"); + const inputTitle = document.getElementById("title-picture"); + const inputCategory = document.getElementById("categorie-picture"); + const allInputs = [inputImage, inputTitle, inputCategory]; + + allInputs.forEach((input) => { + input.addEventListener("input", () => { + const allInputsFilled = allInputs.every((input) => input.value !== ""); + if (allInputsFilled) { + document.getElementById("submitPicture").style.backgroundColor = + "#1D6154"; + document.getElementById("submitPicture").style.cursor = "pointer"; + } + }); + }); + } + + // méthode pour remttre à blanc la modale picture + static blankModalPicture() { + const pictureForm = document.querySelector(".formSubmit"); + pictureForm.reset(); + imagePreview.src = "#"; + imagePreview.alt = ""; + document.getElementById("buttonAddProject").classList.remove("hidden"); + document.querySelector(".iconePreview").classList.remove("hidden"); + document.querySelector(".textPreview").classList.remove("hidden"); + document.getElementById("imagePreview").classList.add("hidden"); + document.getElementById("submitPicture").style.cursor = "default"; + } + + // méthode pour lancer un message d'erreur si le projet n'a pas été ajouter + static errorMessageModaleGallery() { + const errorWorks = document.createElement("p"); + document.querySelector(".modalGallery").appendChild(errorWorks); + errorWorks.className = "errorMessage"; + errorWorks.innerHTML = + "Nous avons rencontré une erreur, merci de contacter l'administrateur"; + setTimeout(() => { + errorWorks.innerHTML = ""; + }, 7000); + } + + // méthode pour mettre à blanc les messages d'erreur au submit + static blankMessageErrorSubmit() { + const allMessageErrorSubmit = document.querySelectorAll(".errorSubmit"); + allMessageErrorSubmit.forEach((messageErrorSubmit) => { + messageErrorSubmit.classList.add("hidden"); + }); + } +} diff --git a/FrontEnd/src/UserLogin.js b/FrontEnd/src/UserLogin.js new file mode 100644 index 000000000..21035297f --- /dev/null +++ b/FrontEnd/src/UserLogin.js @@ -0,0 +1,16 @@ +export default class UserLogin { + // méthode pour changer la page d'accueil après la connexion de l'utilisation + static validToken() { + const ancre = document.getElementById("log"); + if (window.localStorage.getItem("token")) { + hiddenMode.classList.remove("hidden"); + hiddenMode.classList.add("mode"); + ancre.innerText = "logout"; + photoHidden.classList.remove("hidden"); + photoHidden.classList.add("photo-hidden"); + hiddenFilter.classList.add("edit"); + buttonFilterHidden.classList.remove("button-filter"); + buttonFilterHidden.classList.add("hidden"); + } + } +} diff --git a/FrontEnd/src/login.js b/FrontEnd/src/login.js new file mode 100644 index 000000000..11796c9ad --- /dev/null +++ b/FrontEnd/src/login.js @@ -0,0 +1,41 @@ +//fonction pour recupérer les données saisies à la validation du form + vérifier validité par l'api +function userLogin() { + document.querySelector("form").addEventListener("submit", (event) => { + event.preventDefault(); + + const user = { + email: event.target.querySelector("#email").value, + password: event.target.querySelector("#mdp").value, + }; + + postUserLogin(user); + }); +} +// requête post /// +async function postUserLogin(user) { + let tokenUser = window.localStorage.getItem("token"); + + if (tokenUser === null) { + await fetch("http://localhost:5678/api/users/login", { + method: "POST", + headers: { + "Content-Type": "application/json", + accept: "application/json", + }, + body: JSON.stringify(user), + }) + .then((res) => res.json()) + .then((login) => { + if (login.token) { + // enregistrer la réponse de l'API avec le local storage grâce à la fonction setItem + window.localStorage.setItem("token", login.token); + window.location.href = "index.html"; + } else { + // afficher un messge d'erreur + document.getElementById("errorLoging").classList.remove("hidden"); + } + }); + } +} + +userLogin(); diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 000000000..7d8b483da --- /dev/null +++ b/package-lock.json @@ -0,0 +1,6 @@ +{ + "name": "Portfolio-architecte-sophie-bluel", + "lockfileVersion": 2, + "requires": true, + "packages": {} +}