serveur socket

WEB/View/src/CSS/Admin2.css

@@ -16,17 +16,42 @@ body {
   background-color: #111219;
 }
 
-
 li {
   display: inline;
   width: 225px;
 }
 
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: Equinox;
+}
+
+h6{
+  color: #898989;
+  font-weight: bolder;
+}
+
 .current {
   background: rgb(146, 254, 157);
-  background: -moz-linear-gradient(    50deg,    rgba(146, 254, 157, 1) 0%,    rgba(0, 201, 255, 1) 100%  );
+  background: -moz-linear-gradient(
-  background: -webkit-linear-gradient(    50deg,    rgba(146, 254, 157, 1) 0%,    rgba(0, 201, 255, 1) 100%  );
+    50deg,
-  background: linear-gradient(    50deg,    rgba(146, 254, 157, 1) 0%,    rgba(0, 201, 255, 1) 100%  );
+    rgba(146, 254, 157, 1) 0%,
+    rgba(0, 201, 255, 1) 100%
+  );
+  background: -webkit-linear-gradient(
+    50deg,
+    rgba(146, 254, 157, 1) 0%,
+    rgba(0, 201, 255, 1) 100%
+  );
+  background: linear-gradient(
+    50deg,
+    rgba(146, 254, 157, 1) 0%,
+    rgba(0, 201, 255, 1) 100%
+  );
   box-shadow: 0px 0px 50px -5px rgba(0, 201, 255, 0.3);
   border-radius: 4px;
   -webkit-border-radius: 4px;
@@ -50,4 +75,48 @@ li {
   color: white;
 }
 
+.dashboard-card {
+  background: rgb(0, 0, 0);
+  background: -moz-linear-gradient(
+    315deg,
+    rgba(0, 0, 0, 0.4192051820728291) 0%,
+    rgba(0, 0, 0, 1) 30%
+  );
+  background: -webkit-linear-gradient(
+    315deg,
+    rgba(0, 0, 0, 0.4192051820728291) 0%,
+    rgba(0, 0, 0, 1) 30%
+  );
+  background: linear-gradient(
+    315deg,
+    rgba(0, 0, 0, 0.4192051820728291) 0%,
+    rgba(0, 0, 0, 1) 30%
+  );
+  border-radius: 15px;
+  -webkit-border-radius: 15px;
+  -moz-border-radius: 15px;
+  -ms-border-radius: 15px;
+  -o-border-radius: 15px;
 
+  height: 90%;
+  overflow-y: scroll;
+}
+
+.dashboard-card-reversed{
+  background: rgb(0, 0, 0);
+  background: -moz-linear-gradient(
+    45deg,
+    rgba(0, 0, 0, 0.4192051820728291) 0%,
+    rgba(0, 0, 0, 1) 30%
+  );
+  background: -webkit-linear-gradient(
+    45deg,
+    rgba(0, 0, 0, 0.4192051820728291) 0%,
+    rgba(0, 0, 0, 1) 30%
+  );
+  background: linear-gradient(
+    45deg,
+    rgba(0, 0, 0, 0.4192051820728291) 0%,
+    rgba(0, 0, 0, 1) 30%
+  );
+}

WEB/View/src/pages/Admin/Admin.html

@@ -34,18 +34,18 @@
         element.parentElement.classList.add("current");
         element.classList.remove("nav-button");
         element.classList.add("currentText");
-        
       }
     </script>
 
 
-    <div class=" container ml-0">
+    <div class="d-flex ml-0">
+
 
 
       <!-- Menu -->
       <div
-        class="col-3 d-flex align-items-start user-select-none"
+        class="col-3 user-select-none"
-        style="border-right: 1px solid #323232; height: 100vh; margin:0"
+        style="border-right: 1px solid #323232; height: 100vh; margin:0; width: 18%;"
       >
         <nav class="navbar justify-content-center">
 
@@ -55,7 +55,7 @@
             class="row px-3 pt-4 pb-5 m-0 text-center"
             style="width: fit-content"
           >
-            <h3 style="font-family: Equinox">Scripted</h3>
+            <h2 style="font-family: Equinox">Scripted</h2>
           </div>
           <!-- End Title -->
 
@@ -106,28 +106,56 @@
           </ul>
         </nav>
       </div>
+
       <!-- End Menu -->
 
       <!-- ANCHOR Main part -->
+      <div class="container-fluid mx-5" style="height: 100vh;">
+        <!-- Gestion énigmes -->
+          <div class="row m-5 d-flex justify-content-around" style="height: 45%; background-color:white;">
+
+            <!-- Enigme Solo -->
+            <div class="col-4 m-4 dashboard-card">
+
+              <!-- Title + Extends  -->
+              <div class="row my-4 d-flex justify-content-center">
+                <div class="col-2"></div>
+                <div class="col text-center">
+                  <h4>Énigmes Solo</h4>
+                </div>
+                <div class="col-2">
+                  <svg fill="currentColor" height="20px" width="20px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512" xml:space="preserve"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_iconCarrier"> <g> <g> <g> <path d="M511.894,19.228c-0.031-0.316-0.09-0.622-0.135-0.933c-0.054-0.377-0.098-0.755-0.172-1.13 c-0.071-0.358-0.169-0.705-0.258-1.056c-0.081-0.323-0.152-0.648-0.249-0.968c-0.104-0.345-0.234-0.678-0.355-1.015 c-0.115-0.319-0.22-0.641-0.35-0.956c-0.13-0.315-0.284-0.616-0.428-0.923c-0.153-0.324-0.297-0.651-0.467-0.969 c-0.158-0.294-0.337-0.574-0.508-0.86c-0.186-0.311-0.362-0.626-0.565-0.93c-0.211-0.316-0.447-0.613-0.674-0.917 c-0.19-0.253-0.366-0.513-0.568-0.76c-0.443-0.539-0.909-1.058-1.402-1.551c-0.004-0.004-0.007-0.008-0.011-0.012 c-0.004-0.004-0.008-0.006-0.011-0.01c-0.494-0.493-1.012-0.96-1.552-1.403c-0.247-0.203-0.507-0.379-0.761-0.569 c-0.303-0.227-0.6-0.462-0.916-0.673c-0.304-0.203-0.619-0.379-0.931-0.565c-0.286-0.171-0.565-0.35-0.859-0.508 c-0.318-0.17-0.644-0.314-0.969-0.467c-0.307-0.145-0.609-0.298-0.923-0.429c-0.315-0.13-0.637-0.236-0.957-0.35 c-0.337-0.121-0.669-0.25-1.013-0.354c-0.32-0.097-0.646-0.168-0.969-0.249c-0.351-0.089-0.698-0.187-1.055-0.258 c-0.375-0.074-0.753-0.119-1.13-0.173c-0.311-0.044-0.617-0.104-0.933-0.135C492.072,0.037,491.37,0,490.667,0H341.333 C329.551,0,320,9.551,320,21.333c0,11.782,9.551,21.333,21.333,21.333h97.83L283.582,198.248c-8.331,8.331-8.331,21.839,0,30.17 s21.839,8.331,30.17,0L469.333,72.837v97.83c0,11.782,9.551,21.333,21.333,21.333S512,182.449,512,170.667V21.335 C512,20.631,511.963,19.928,511.894,19.228z"></path> <path d="M198.248,283.582L42.667,439.163v-97.83c0-11.782-9.551-21.333-21.333-21.333C9.551,320,0,329.551,0,341.333v149.333 c0,0.703,0.037,1.405,0.106,2.105c0.031,0.315,0.09,0.621,0.135,0.933c0.054,0.377,0.098,0.756,0.173,1.13 c0.071,0.358,0.169,0.704,0.258,1.055c0.081,0.324,0.152,0.649,0.249,0.969c0.104,0.344,0.233,0.677,0.354,1.013 c0.115,0.32,0.22,0.642,0.35,0.957c0.13,0.315,0.284,0.616,0.429,0.923c0.153,0.324,0.297,0.651,0.467,0.969 c0.158,0.294,0.337,0.573,0.508,0.859c0.186,0.311,0.362,0.627,0.565,0.931c0.211,0.316,0.446,0.612,0.673,0.916 c0.19,0.254,0.366,0.514,0.569,0.761c0.443,0.54,0.91,1.059,1.403,1.552c0.004,0.004,0.006,0.008,0.01,0.011 c0.004,0.004,0.008,0.007,0.012,0.011c0.493,0.492,1.012,0.959,1.551,1.402c0.247,0.203,0.507,0.379,0.76,0.568 c0.304,0.227,0.601,0.463,0.917,0.674c0.303,0.203,0.618,0.379,0.93,0.565c0.286,0.171,0.565,0.35,0.86,0.508 c0.318,0.17,0.645,0.314,0.969,0.467c0.307,0.145,0.609,0.298,0.923,0.428c0.315,0.13,0.636,0.235,0.956,0.35 c0.337,0.121,0.67,0.25,1.015,0.355c0.32,0.097,0.645,0.168,0.968,0.249c0.351,0.089,0.698,0.187,1.056,0.258 c0.375,0.074,0.753,0.118,1.13,0.172c0.311,0.044,0.618,0.104,0.933,0.135c0.7,0.069,1.402,0.106,2.104,0.106 c0,0,0.001,0,0.001,0h149.333c11.782,0,21.333-9.551,21.333-21.333s-9.551-21.333-21.333-21.333h-97.83l155.582-155.582 c8.331-8.331,8.331-21.839,0-30.17S206.58,275.251,198.248,283.582z"></path> </g> </g> </g> </g></svg>
+                </div>
+              </div>
+              <!-- End Title + Extends-->
 
-      <!-- <div class="col" style="width: 500px; height:500px; background-color:white">
+              <!-- Start Content -->
               <div class="row">
-          <div class="col-6" style="width: 500px; height:500px; background-color:white">
+                <div class="col-4 px-4">
+                  <h6 class="text-left">Ordre</h6>
+                </div>
+                <div class="col px-4">
+                  <h6 class="">Nom Énigme</h6>
+                </div>
+              </div>
+               Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem aspernatur molestiae iusto repudiandae delectus saepe tenetur cumque fugit odio cupiditate ducimus, numquam rem labore, excepturi magni minima. Tenetur, ut voluptas.
+               Lorem, ipsum dolor sit amet consectetur adipisicing elit. Earum atque ipsam placeat numquam sint fugit aspernatur fugiat laborum. Architecto quibusdam odit expedita dolores dolore eum provident ab tempore animi cumque?
+               Lorem, ipsum dolor sit amet consectetur adipisicing elit. Impedit, magnam? Voluptatem delectus nulla et at iste voluptatibus officiis quasi. Eaque excepturi, pariatur dolor debitis repellat nostrum odio laudantium nam accusantium.
 
             </div>
     
-          <div class="col-6">
+            <div class="col-4 m-4 dashboard-card dashboard-card-reversed">
 
             </div>
           </div>
     
-        <div class="row">
+          <div class="row m-5 p-5" style="height:390px; background-color:white;">
+            <div class="row p-0">
 
             </div>
-      </div> -->
+          </div>
-
+        </div>
-      
+      </div>
-      
     </div>
   </body>
 </html>

WEB/server.php

@@ -40,8 +40,16 @@ while(true) {
   // Accepter les connections entrantes s'il y en a à cet instant t ou bloque le while tant qu'il n'y en a pas
   $client = socket_accept($socket) or die("N'a pas pu accepter les connections entrantes\n");
 
+  //3 tableau de sockets, le premier contient les sockets à lire, le deuxième contient les sockets à écrire et le troisième contient les sockets avec des erreurs
+  $read = array($client);
+  $write = NULL;
+  $except = NULL;
+
+  
+    
+  
   // Ajoute la connection à un tableau de connection des joueurs en attente
-  $socketsFromQueue[]=$spawn;
+  $socketsFromQueue[]=$client;
 
   // si le nombre de joueur par partie nécessaire est égal au nombre de connection encore dans la file d'attente 
   // alors envoie à l'utilisateur de lancer la partie et ajoute l'ensemble de connection à un tableau de groupe de sockets avec comme paire clés valeurs
@@ -52,22 +60,57 @@ while(true) {
     if(count($socketsFromQueue)==$playerNumberPerGame)
     {
       $response="launchGame";
-      foreach($socketsFromQueue as $sock)
+      $arraySocketGroup[$partie_gateway->findPartieInQueue()]=$socketsFromQueue;
-      {
-        socket_write($sock,$response,strlen($response)) or die("N'a pas pu écrire à la socket\n");
-      }
-      $idPartie=$partie_gateway->findPartieInQueue();
-      $arraySocketGroup[$idPartie]= $socketsFromQueue;
       $socketsFromQueue=array();
     }
-    else{
+    else
-      $response="refreshQueue";
-      foreach($socketsFromQueue as $sock)
     {
-        socket_write($sock,$response,strlen($response)) or die("N'a pas pu écrire à la socket\n");
+      $response="refreshQueue";
     }
+    foreach($socketsFromQueue as $socket)
+    {
+      socket_write($socket,$response,strlen($response)) or die("N'a pas pu écrire sur la socket");
     }
   }
   //Lire le message provenant de la socket du client
-  $input = socket_read($spawn,1024) or die("N'a pas pu lire de requête");
+  $input = socket_read($client,1024) or die("N'a pas pu lire de requête");
+}
+
+
+
+
+
+// si il y a des sockets à lire
+if(strcmp($request,"quitQueue")==0)
+{
+  // supprime le socket de la liste des sockets en attente
+  $socketsFromQueue=array_diff($socketsFromQueue, array($client));
+  $response="refresh";
+  // envoie à tous les utilisateurs en attente de rafraichir la page
+  foreach($socketsFromQueue as $socket)
+  {
+    socket_write($socket, $response, strlen($response)) or die("N'a pas pu envoyer la réponse au client\n");
+  }
+}
+else if(strcmp($request,"quitGame")==0)
+{
+  // supprime le socket de la liste des sockets en attente
+  $socketsFromQueue=array_diff($socketsFromQueue, array($client));
+  $response="refresh";
+  // envoie à tous les utilisateurs en attente de rafraichir la page
+  foreach($socketsFromQueue as $socket)
+  {
+    socket_write($socket, $response, strlen($response)) or die("N'a pas pu envoyer la réponse au client\n");
+  }
+}
+else if(strcmp($request,"connectQueue")==0)
+{
+  // Ajoute la connection à un tableau de connection des joueurs en attente
+  $socketsFromQueue[]=$client;
+  $response="refresh";
+  // envoie à tous les utilisateurs en attente de rafraichir la page
+  foreach($socketsFromQueue as $socket)
+  {
+    socket_write($socket, $response, strlen($response)) or die("N'a pas pu envoyer la réponse au client\n");
+  }
 }