Basic structure for GUI

ChatApp/app/src/main/java/client/ClientLoading.java

@@ -2,18 +2,32 @@ package client;
 
 import javafx.animation.RotateTransition;
 import javafx.fxml.FXML;
+import javafx.fxml.FXMLLoader;
+import javafx.scene.Scene;
 import javafx.scene.shape.Arc;
+import javafx.stage.Stage;
 import javafx.util.Duration;
 
+import java.io.IOException;
+import static utilities.FxUtilities.centerStage;
+
 public class ClientLoading {
     @FXML
     private Arc spinnerArc;
 
-    public void initialize() {
+    public void initialize() throws IOException, InterruptedException {
         // Création de l'animation de rotation
         RotateTransition rotate = new RotateTransition(Duration.seconds(1), spinnerArc);
         rotate.setByAngle(360);
         rotate.setCycleCount(RotateTransition.INDEFINITE);
         rotate.play();
     }
+
+    public void login() throws IOException {
+        var loader = new FXMLLoader(getClass().getResource("/client/clientVue.fxml"));
+        loader.load();
+        Stage stage = (Stage) spinnerArc.getScene().getWindow();
+        stage.setScene(new Scene(loader.getRoot(), 800, 600));
+        centerStage(stage);
+    }
 }

ChatApp/app/src/main/resources/client/clientLoading.fxml

@@ -7,6 +7,6 @@
 <StackPane xmlns="http://javafx.com/javafx" xmlns:fx="http://javafx.com/fxml"
            fx:controller="client.ClientLoading" style="-fx-background-color: lightgrey;">
     <Arc fx:id="spinnerArc" centerX="50" centerY="50" radiusX="30" radiusY="30"
-         startAngle="30" length="330" fill="transparent" stroke="blue" strokeWidth="5"
+         startAngle="30" length="330" fill="transparent" stroke="blue" strokeWidth="5" onMouseClicked="#login"
     />
 </StackPane>

ChatApp/app/src/main/resources/client/clientVue.fxml

@@ -7,15 +7,39 @@
 <?import javafx.scene.layout.*?>
 
 <?import javafx.geometry.Insets?>
+<?import javafx.scene.image.ImageView?>
+<?import javafx.scene.image.Image?>
 <AnchorPane xmlns="http://javafx.com/javafx"
             xmlns:fx="http://javafx.com/fxml"
             fx:controller="client.ClientGuiController"
             prefHeight="400.0" prefWidth="600.0">
-    <HBox>
+    <VBox>
         <padding>
             <Insets bottom="20.0" left="20.0" right="20.0" top="20.0"/>
         </padding>
-
-
-    </HBox>
+        <!-- Logo -->
+        <HBox alignment="CENTER">
+            <ImageView fitHeight="50.0" fitWidth="50.0">
+                <Image url="@/liscord.png" />
+            </ImageView>
+            <Label text="Liscord" style="-fx-font-size: 24px; -fx-font-weight: bold; -fx-padding: 0 0 0 10px"/>
+        </HBox>
+        <!-- Client -->
+        <HBox>
+            <!-- Rooms -->
+            <ScrollPane>
+                <VBox fx:id="rooms" spacing="10.0">
+                    <Label text="Rooms" style="-fx-font-size: 18px;"/>
+                    <VBox fx:id="roomList" spacing="5.0"/>
+                </VBox>
+            </ScrollPane>
+            <!-- Chat -->
+            <ScrollPane>
+                <VBox fx:id="chat" spacing="10.0">
+                    <Label text="Chat" style="-fx-font-size: 18px;"/>
+                    <VBox fx:id="chatList" spacing="5.0"/>
+                </VBox>
+            </ScrollPane>
+        </HBox>
+    </VBox>
 </AnchorPane>