Ajout de l'insctiption + ajout de la pagination + améliations

DAL/gateways/CompteGateway.php

@@ -27,6 +27,15 @@ class CompteGateway
 			":mdp" => [$compteAInserer->getMotDePasse(), PDO::PARAM_STR]
 		]);
 	}
+	public function inscription(string $pseudo, string $mdp_H) : bool
+	{
+		$requette = "INSERT INTO _Compte(pseudonyme, dateCreation, motDePasse)
+			VALUES(:p, NOW(), :mdp)";
+		return $this->conn->executeQuery($requette, array(
+			":p" => [$pseudo, PDO::PARAM_STR],
+			":mdp" => [$mdp_H, PDO::PARAM_STR]
+		));
+	}
 
 	/*
 	 * Paramètre	: compteAEditer => Compte à éditer en base de données

DAL/gateways/ListeGateway.php

@@ -129,7 +129,7 @@ class ListeGateway
 	 * Retour	: Retourne un tableau de listes de taille maximale <nbTache> ordoné par nom de liste (ordre lexicographique)
 	 * Finalité	: Récuperer les todoLists en bases de données par ordre de lexicographique et les instancier
 	 */	
-	public function listeParNom(int $page, int $nbListes) : iterable
+	public function listeParNom(int $page, int $nbListes) : array
 	{
 		$gwTache = new TacheGateway($this->conn);
 		$lites = array();
@@ -158,6 +158,34 @@ class ListeGateway
 		return $listes;
 	}
 
+	public function getListeParID(int $id): TodoList
+	{
+		$gwTache = new TacheGateway($this->conn);
+		$requete = "SELECT * FROM _TodoList WHERE listeID = :id";
+		$isOK=$this->conn->executeQuery($requete, [
+			":id" => [$id, PDO::PARAM_INT]
+		]);
+		if(!$isOK)
+		{
+			throw new Exception("Erreur avec la récupération de la liste n°$id");
+		}
+
+		$liste = $this->conn->getResults();
+		if(sizeof($liste) == 0)
+		{
+			throw new Exception("Aucune liste n°$id");
+		}
+		$liste = $liste[0];
+		
+		return new TodoList(
+				$liste["listeID"],
+				$liste["nom"],
+				$liste["Createur"],
+				$liste["dateCreation"],
+				$gwTache->getTachesParIDListe($liste["listeID"], 1, 10)
+		);
+	}
+	
 	/*
 	 * Paramètres	: page 		=> Numéro de la page à afficher
 	 * 		  nbTache	=> Nombre de tâches à afficher par pages
@@ -208,4 +236,15 @@ class ListeGateway
 		$l->setTaches($gwTaches->getTachesParIDListe($l->getID(), $page, $nbTaches));
 		return $l;
 	}
+	public function getNbListesParCreateur(string $createur): int
+	{
+		$requette = "SELECT COUNT(*) FROM _TodoList WHERE Createur = :c";
+		if(!$this->conn->executeQuery($requette, array(":c"=>[$createur, PDO::PARAM_STR])))
+		{
+			throw new Exception("Problème lors de la récupération des listes");
+		}
+		return $this->conn->getResults()[0][0];
+
+	}
+	
 }

DAL/gateways/TacheGateway.php

@@ -21,29 +21,30 @@ class TacheGateway
 	 */
 	public function inserer(Tache $tacheAInserer) : bool
 	{
-		$requette = "INSERT INTO _Tache(NomTache, TacheFaite, Commentaire) VALUES(
-			:nom, :fait, :commentaire
+		$requette = "INSERT INTO _Tache(NomTache, TacheFaite, Commentaire, DateCreation, listeID) VALUES(
+			:nom, :fait, :commentaire, NOW(), :id
 			)";
 
 		return $this->conn->executeQuery($requette, [
 			':nom' => [$tacheAInserer->nom, PDO::PARAM_STR],
 			':fait'=> [$tacheAInserer->estFait, PDO::PARAM_BOOL],
 			':commentaire' => [$tacheAInserer->commentaire, PDO::PARAM_STR],
+			':id' => [$tacheAInserer->getListeID(), PDO::PARAM_INT]
 
 		]);
 	}
 
-	public function insererSimple(string $nom, string $comm, int $id) : bool
+	public function insererSimple(string $nom, string $comm, int $listeID) : bool
 	{
-		$requette = "INSERT INTO _Tache(NomTache, TacheFaite, Commentaire, listID) VALUES(
-			:nom, :fait, :commentaire, :id
+		$requette = "INSERT INTO _Tache(NomTache, TacheFaite, Commentaire, listID, DateCreation) VALUES(
+			:nom, :fait, :commentaire, :id, NOW()
 			)";
 
 		return $this->conn->executeQuery($requette, [
 			":nom" => [$nom, PDO::PARAM_STR],
 			":fait"=> [false, PDO::PARAM_BOOL],
 			":commentaire" => [$comm, PDO::PARAM_STR],
-			":id" => [$id, PDO::PARAM_INT]
+			":id" => [$listeID, PDO::PARAM_INT]
 
 		]);
 		
@@ -123,7 +124,7 @@ class TacheGateway
 	 */
 	public function getTachesParIDListe(int $l, int $page, int $nbTache) : iterable
 	{
-		$requete = "SELECT * FROM _Tache WHERE listID=:id ORDER BY NomTache LIMIT :p, :n";
+		$requete = "SELECT * FROM _Tache WHERE listID=:id ORDER BY DateCreation DESC LIMIT :p, :n";
 		if(!$this->conn->executeQuery($requete,[ 
 			":id" => [$l, PDO::PARAM_INT],
 			":p" => [($page-1)*$nbTache, PDO::PARAM_INT],
@@ -141,7 +142,9 @@ class TacheGateway
 				$tache["NomTache"],
 				$tache["TacheFaite"],
 				$tache["Commentaire"],
-				$tache["tacheID"]
+				$tache["tacheID"],
+				$tache["DateCreation"],
+				$tache["listID"]
 			);
 		}
 		return $taches;
@@ -160,4 +163,14 @@ class TacheGateway
 		}
 		return $this->conn->getResults()[0][0];
 	}
+	public function getNbTacheParListeID(int $listeID): int
+	{
+		$requette = "SELECT COUNT(*) FROM _Tache WHERE listID = :id";
+		if(!$this->conn->executeQuery($requette, array(":id"=>[$listeID, PDO::PARAM_INT])))
+		{
+			throw new Exception("Problème lors de la récupération des taches");
+		}
+		return $this->conn->getResults()[0][0];
+
+	}
 }

controleur/ControleurCommun.php

@@ -4,8 +4,6 @@ require_once("modeles/ModelConnecte.php");
 class ControleurCommun {
 		
 	function __construct() {
-		global $rep,$vues; // nécessaire pour utiliser variables globales
-		$dVueEreur = array ();
 		try{
 			$action=Validation::netoyerString(isset($_REQUEST['action']) ? $_REQUEST["action"] : "");
 			switch($action) {
@@ -14,29 +12,13 @@ class ControleurCommun {
 					$this->Reinit();
 					break;
 				case "connection":
-					if(!isset($_POST["pseudonyme"]) || !isset($_POST["motDePasse"]))
-					{
-						$erreurs[] = "Erreur lors de la transmission des informations de connections";
-						throw new Exception();
-					}
-
-					$login = Validation::netoyerString($_POST["pseudonyme"]);
-					$mdp = Validation::netoyerString($_POST["motDePasse"]);
-					
-					if(is_null($login) || is_null($mdp))
-					{
-						throw new ValueError("Le login ou le mot de passe contient des valeurs illégales");
-					}
-
-					$compte = $this->connection($_POST["pseudonyme"], $_POST["motDePasse"]);
-					if(!is_null($compte))
-					{
-						header("Location: ?action=seeLists");
-					}
-					else
-					{
-						header("Location: ?action=GloubiBoulga");
-					}
+					$this->connection();
+					break;
+				case "veuxSInscrire":
+					$this->veuxSInscrire();
+					break;
+				case "signin":
+					$this->signin();
 					break;
 				case "SeConnecter":
 				default:
@@ -46,7 +28,7 @@ class ControleurCommun {
 		}catch(PDOException $e)
 		{
 			//si erreur BD, pas le cas ici
-			$ereurs[] = "Erreur inattendue!!! ";
+			$erreurs[] = $e->getMessage();
 			require("vues/erreur.php");
 		}
 		catch (Exception $e2)
@@ -62,10 +44,84 @@ class ControleurCommun {
 		require("vues/connection.php");
 	}
 
-	function connection(string $login, string $mdp) : Compte
+	function connection()
+	{
+		if(!isset($_REQUEST["pseudonyme"]) || !isset($_REQUEST["motDePasse"]))
 		{
+			throw new Exception("Erreur lors de la transmission des informations de connections");
+		}
+
+		$login = Validation::netoyerString($_REQUEST["pseudonyme"]);
+		$mdp = Validation::netoyerString($_REQUEST["motDePasse"]);
+		
+		if(is_null($login) || is_null($mdp))
+		{
+			throw new ValueError("Le login ou le mot de passe contient des valeurs illégales");
+		}
 		$mdl = new ModelConnecte();
 		$compte = $mdl->connection($login, $mdp);
-		return $compte;
+		if(!is_null($compte))
+		{
+			require_once("controleur/ControleurConnecte.php");
+			$_REQUEST["action"] = "seeLists";
+			new ControleurConnecte();
+		}
+		else
+		{
+			throw new Exception("Erreur lors de la récupération du compte");
+		}
+	}
+	function veuxSInscrire()
+	{
+		require("vues/inscription.php");
+	}
+	function signin()
+	{
+		if(!isset($_REQUEST["name"]))
+		{
+			throw new Exception("Le pseudonyme doit être envoyer au serveur");
+		}
+		if(empty($_REQUEST["name"]))
+		{
+			throw new Exception("Le pseudonyme doit contenire des caractères");
+		}
+		if(strlen($_REQUEST["name"]) < 4)
+		{
+			throw new Exception("Le pseudonyme doit contenire au moins 5 caractères");
+		}
+		
+
+		if(!isset($_REQUEST["mdp1"]))
+		{
+			throw new Exception("Le mot de passe doit être envoyer au serveur");
+		}
+		if(empty($_REQUEST["mdp1"]))
+		{
+			throw new Exception("Le mot de passe doit contenire des caractères");
+		}
+		if(strlen($_REQUEST["mdp1"]) < 7)
+		{
+			throw new Exception("Le pseudonyme doit contenire au moins 8 caractères");
+		}
+		if($_REQUEST["mdp1"] != $_REQUEST["mdp2"])
+		{
+			throw new Exception("Le deux mots de passes ne coresspondent pas");
+		}
+
+		$pseudo = Validation::netoyerString($_REQUEST["name"]);
+
+		if(is_null($pseudo))
+		{
+			throw new Exception("Le pseudonyme contien des valeurs illégales");
+		}
+		$mdl = new ModelConnecte();
+		if(!$mdl->inscription($pseudo, $_REQUEST["mdp1"]))
+		{
+			throw new Exception("Erreur lors de l'enregistrement");
+		}
+		$_REQUEST["action"] = "connection";
+		$_REQUEST["pseudonyme"] = $pseudo;
+		$_REQUEST["motDePasse"] = $_REQUEST["mdp1"];
+		new ControleurCommun();
 	}
 }

controleur/ControleurConnecte.php

@@ -91,13 +91,13 @@ class ControleurConnecte {
 
 	function seeLists()
 	{
-		if(!isset($_GET["page"]) || empty($_GET["page"]))
+		if(!isset($_REQUEST["page"]) || empty($_REQUEST["page"]))
 		{
 			$page = 1;
 		}
 		else
 		{
-			$page = Validation::validerUnIntSuperieurZero($_GET["page"]) ? $_GET["page"] : 1;
+			$page = Validation::validerUnIntSupperieurZero($_REQUEST["page"]) ? $_REQUEST["page"] : 1;
 		}
 
 		if(!isset($_GET["nbElements"]) || empty($_GET["nbElements"]))
@@ -106,11 +106,12 @@ class ControleurConnecte {
 		}
 		else
 		{
-			$nbElements = Validation::validerUnIntSuperieurZero($_GET["nbElements"]) ? $_GET["nbElements"] : 10;
+			$nbElements = Validation::validerUnIntSupperieurZero($_GET["nbElements"]) ? $_GET["nbElements"] : 10;
 		}
 
 		$mdl = new ModelConnecte();
-		$todoLists = $mdl->getLists($_SESSION["login"], $page, $nbElements);
+		$todoLists = $mdl->getLists(Validation::netoyerString($_SESSION["login"]), $page, $nbElements);
+		$maxPage = $mdl->getMaxPageListes(Validation::netoyerString($_SESSION["login"]), $nbElements);
 		require("vues/accueil.php");
 	}
 
@@ -125,9 +126,28 @@ class ControleurConnecte {
 		{
 			throw new Exception("Valeur illégale de la liste requétée");
 		}
+		if(!isset($_REQUEST["page"]) || empty($_REQUEST["page"]))
+		{
+			$page = 1;
+		}
+		else
+		{
+			$page = Validation::validerUnIntSupperieurZero($_REQUEST["page"]) ? $_REQUEST["page"] : 1;
+		}
+
+		if(!isset($_GET["nbElements"]) || empty($_GET["nbElements"]))
+		{
+			$nbElements = 10;
+		}
+		else
+		{
+			$nbElements = Validation::validerUnIntSupperieurZero($_GET["nbElements"]) ? $_GET["nbElements"] : 10;
+		}
 		$mdl = new ModelConnecte();
-		$taches = $mdl->getTaches($_REQUEST["list"]);
+		$taches = $mdl->getTaches($_REQUEST["list"], $page, $nbElements);
 		$actualList = $_REQUEST["list"];
+		$nomListe = $mdl->getNomListe($actualList);
+		$maxPage = $mdl->getMaxPageTaches($actualList, $nbElements);
 		require("vues/editeurDeStatuts.php");
 	}
 

frontControler/FrontControler.php

@@ -11,7 +11,7 @@ class FrontControler
 			"addList", "setTacheFait", "editionTache", "déconéction", "seeLists", 
 			"seeList", "wantAddList", "wantAddTask", "addTask", "supprimerListe", 
 			"delTask", "logout", "veuxModifierListe", "modifyList", "veuxModifierTache"],
-		"Visiteur" => ["seConnceter", "connection"]
+		"Visiteur" => ["seConnceter", "connection", "veuxSInscrire", "signin"]
 	);
 
 	public function start()

metier/Tache.php

@@ -6,14 +6,18 @@ class Tache
 	private $fait;
 	private $commentaire;
 	private $tacheID;
+	private $datetime;
+	private $listeID;
 
 	// Constructeur
-	public function __construct(string $nom, bool $estFait=false, ?string $commentaire="", int $tacheID)
+	public function __construct(string $nom, bool $estFait=false, ?string $commentaire="", int $tacheID, string $datetime, int $listeID)
 	{	
 		$this->nom = $nom;
 		$this->fait = $estFait;
 		$this->commentaire = $commentaire;
 		$this->tacheID = $tacheID;
+		$this->datetime = $datetime;
+		$this->listeID = $listeID;
 	}
 
 
@@ -52,4 +56,12 @@ class Tache
 	{
 		return $this->tacheID;
 	}
+	public function getDateTime(): string
+	{
+		return $this->dateTime;
+	}
+	public function getListeID()
+	{
+		return $this->listeID;
+	}
 }

modeles/ModelConnecte.php

@@ -40,11 +40,11 @@ class ModelConnecte
 		return $gw->getListeParCreateur($page, $nbElements, $pseudo);
 	}
 
-	public function getTaches(int $liste)
+	public function getTaches(int $liste, $page, $nbElements)
 	{
 		global $dsn, $loginDB, $pswdDB;
 		$gw = new TacheGateway(new Connection($dsn, $loginDB, $pswdDB));
-		return $taches = $gw->getTachesParIDListe($liste, 1, 10);
+		return $taches = $gw->getTachesParIDListe($liste, $page, $nbElements);
 	}
 
 	public function setDoneTaches()
@@ -126,5 +126,32 @@ class ModelConnecte
 		$gw = new TacheGateway(new Connection($dsn, $loginDB, $pswdDB));
 		return $gw->modifierNomCommTache($idTache, $nom, $comm);
 	}
+	public function inscription(string $pseudo, string $mdp) : bool
+	{
+		global $dsn, $loginDB, $pswdDB;
+		$mdp_H = password_hash($mdp, PASSWORD_BCRYPT);
+		$gw = new CompteGateway(new Connection($dsn, $loginDB, $pswdDB));
+		return $gw->Inscription($pseudo, $mdp_H,);
 		
 	}
+	public function getNomListe(int $id): string
+	{
+		global $dsn, $loginDB, $pswdDB;
+		$gw = new ListeGateway(new Connection($dsn, $loginDB, $pswdDB));
+		return $gw->getListeParID($id)->getNom();
+	}
+	public function getMaxPageTaches(int $listeID, int $nbElements) : int
+	{
+		global $dsn, $loginDB, $pswdDB;
+		$gw = new TacheGateway(new Connection($dsn, $loginDB, $pswdDB));
+		$nbTotal = $gw->getNbTacheParListeID($listeID);
+		return ceil($nbTotal/$nbElements);
+	}
+	public function getMaxPageListes(string $createur, int $nbElements) : int
+	{
+		global $dsn, $loginDB, $pswdDB;
+		$gw = new ListeGateway(new Connection($dsn, $loginDB, $pswdDB));
+		$nbTotal = $gw->getNbListesParCreateur($createur);
+		return ceil($nbTotal/$nbElements);
+	}
+}

vues/accueil.php

@@ -25,13 +25,26 @@
 							<td><a href="?action=seeList&list=<?=$todolist->getID()?>"><?=$todolist->getNom()?></a></td>
 							<td><?=$todolist->getCreateur()?></td>
 							<td><?=$todolist->getDateCreation()?></td>
-							<td><a href="?action=supprimerListe&list=<?=$todolist->getID()?>">A remplacer par un image de poubelle (^u^)'</a></td>
-							<td><a href="?action=veuxModifierListe&list=<?=$todolist->getID()?>">A remplacer par un image de stylo (^u^")</a></td>
+							<td><a href="?action=supprimerListe&list=<?=$todolist->getID()?>"><img alt="Supprimer" src="ressources/imgs/trash.png"/></a></td>
+							<td><a href="?action=veuxModifierListe&list=<?=$todolist->getID()?>"><img alt="Modifier" src="ressources/imgs/pen.png"/></a></td>
 						</tr>
 					<?php endforeach;?>
 				<?php endif;?>
+				<tr>
+					<td><a href="?action=wantAddList">+</a></td>
+					<td></td>
+					<td></td>
+					<td></td>
+					<td></td>
+				</tr>
 			</tbody>
 		<table>
+		<?php if(isset($page) && isset($nbElements) && isset($maxPage)) :?>
+			<?php if($maxPage != 1) :?>
+				<a href="?action=seeLists&page=<?=$page==1 ?1:$page-1 ?>&nbElements=<?=$nbElements?>"><?=$page==1?1:"&larr;"?></a>
+				<a href="?action=seeLists&page=<?=$page==$maxPage ?$maxPage:$page+1 ?>&nbElements=<?=$nbElements?>"><?=$page==$maxPage?$maxPage:"&rarr;"?></a>
+			<?php endif;?>
+		<?php endif;?>
 	</main>
 	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
 

vues/connection.php

@@ -24,6 +24,7 @@
 					</tr>
 				</table>
 			</form>
+			<a href="?action=veuxSInscrire">S'inscrire</a>
 		</div>
 	</main>
 </body>

vues/editeurDeStatuts.php

@@ -13,6 +13,9 @@
 </header>
 
 <main>
+	<?php if(isset($nomListe)) : ?>
+		<h1><?=$nomListe?></h1>
+	<?php endif;?>
 	<form method="post" action="?action=setTacheFait">
 		<table>
 			<thead>
@@ -32,8 +35,8 @@
 							<td><input name="estFait[]" type="checkbox" value="<?=$tache->getID()?>" <?=$tache->estFait() ? "checked" : ""?>/></td>
 							<td><?=$tache->getNom()?></td>
 							<td><?=$tache->getCommentaire()?></td>
-							<td><a href="?action=delTask&task=<?=$tache->getID()?>&list=<?=$actualList?>">À remplacer par une image de poubelle (^u^)"</a></td>
-							<td><a href="?action=veuxModifierTache&task=<?=$tache->getID()?>&list=<?=$actualList?>">À remplacer par une image de stylo (^u^")</a></td>
+							<td><a href="?action=delTask&task=<?=$tache->getID()?>&list=<?=$actualList?>"><img alt="Supprimer" src="ressources/imgs/trash.png"/></a></td>
+							<td><a href="?action=veuxModifierTache&task=<?=$tache->getID()?>&list=<?=$actualList?>"><img alt="Modifier" src="ressources/imgs/pen.png"/></a></td>
 							<td><input name="exist[]" type="hidden" value="<?=$tache->getID()?>"?></td>
 						</tr>
 					<?php endforeach;?>
@@ -48,6 +51,14 @@
 		<input value="Décocher toutes les cases" type="reset"/>
 		<input value="Sauvegarder l'étât!" type="submit"/>
 	</form>
+	<?php if(isset($actualList) && isset($page) && isset($nbElements) && isset($maxPage)) :?>
+		<?php if($maxPage != 1) :?>
+			<a href="?action=seeList&list=<?=$actualList?>&page=<?=$page==1 ?1:$page-1 ?>&nbElements=<?=$nbElements?>"><?=$page==1?1:"&larr;"?></a>
+			<a href="?action=seeList&list=<?=$actualList?>&page=<?=$page==$maxPage ?$maxPage:$page+1 ?>&nbElements=<?=$nbElements?>"><?=$page==$maxPage?$maxPage:"&rarr;"?></a>
+		<?php endif;?>
+	<?php endif;?>
+		
+	
 </main>
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
 </body>

vues/erreur.php

@@ -1,6 +1,7 @@
 <head>
 	<meta charset="utf8"/>
 	<title>ERREUR :/</title>
+	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
 </head>
 <body>
 	<?php require("vues/header.php");?>
@@ -20,4 +21,5 @@
 			<?php endif;?>
 		</tbody>
 	</table>
+	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
 </body>

vues/inscription.php

@@ -0,0 +1,23 @@
+<head>
+	<meta charset="utf8"/>
+	<meta name="viewport" content="width=device-width, initial-scale=1" />	
+	<title>Inscription</title>
+	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
+</head>
+<body>
+	<?php require("header.php"); ?>
+	<main>
+		<form method="POST" action="?action=signin">
+			<label for="pseudonyme">Pseudonyme</label>
+			<input name="name" type="text" placeholder="exemple: Machaonix" id="pseudonyme"/><br>
+			<label for="mdp1">Entrez votre mot de passe</label>
+			<input name="mdp1" id="mdp1" type="password" placeholder="••••••••"/><br>
+			<label for="mdp2">Saisir à nouveau votre mot de passe</label>
+			<input name="mdp2" id="mdp2" type="password" placeholder="••••••••"/><br>
+			<input value="Éffacer tout" type="reset"/>
+			<input value="Creer le compte" type="submit"/>
+		</form>
+	</main>
+	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
+
+</body>