Merge remote-tracking branch 'origin/UI' into UI

app/src/main/java/org/toop/app/App.java

@@ -5,7 +5,6 @@ import org.toop.app.layer.layers.MainLayer;
 import org.toop.app.layer.layers.QuitLayer;
 import org.toop.framework.asset.ResourceManager;
 import org.toop.framework.asset.resources.CssAsset;
-import org.toop.framework.asset.resources.SettingsAsset;
 import org.toop.framework.audio.events.AudioEvents;
 import org.toop.framework.eventbus.EventFlow;
 import org.toop.local.AppContext;
@@ -24,7 +23,6 @@ public final class App extends Application {
 	private static Stack<Layer> stack;
     private static int height;
     private static int width;
-    private static SettingsAsset settingsAsset;
 
 	private static boolean isQuitting;
 

app/src/main/java/org/toop/app/GameType.java

@@ -1,21 +0,0 @@
-package org.toop.app;
-
-public enum GameType {
-	TICTACTOE, OTHELLO;
-
-	public static String toName(GameType type) {
-		return switch (type) {
-			case TICTACTOE -> "tic-tac-toe";
-			case OTHELLO -> "Othello";
-		};
-	}
-
-	public static GameType toType(String name) {
-		return switch (name) {
-			case "tic-tac-toe" -> TICTACTOE;
-			case "Reversi" -> OTHELLO;
-
-			default -> TICTACTOE;
-		};
-	}
-}

app/src/main/java/org/toop/app/Match.java

@@ -1,89 +0,0 @@
-package org.toop.app;
-
-import org.apache.logging.log4j.LogManager;
-import org.apache.logging.log4j.Logger;
-import org.toop.framework.asset.ResourceLoader;
-import org.toop.framework.eventbus.EventFlow;
-import org.toop.framework.networking.NetworkingClientManager;
-import org.toop.framework.networking.events.NetworkEvents;
-
-import static java.lang.Thread.sleep;
-
-
-public class Match {
-    private String player1,player2;
-    private boolean player1AI,player2AI;
-    private String ip;
-    private int port;
-    private boolean isLocal;
-    private GameType type;
-    private long clientId;
-    private static final Logger logger = LogManager.getLogger(Match.class);
-
-    public Match(String player1, String player2, boolean player1AI, boolean player2AI, GameType type) {
-        this.player1 = player1;
-        this.player2 = player2;
-        this.player1AI = player1AI;
-        this.player2AI = player2AI;
-        this.type = type;
-        this.isLocal = true;
-
-        startGameLoop();
-    }
-    public Match(String player1, boolean player1AI, String ip, int port, GameType type) {
-        this.player1 = player1;
-        this.player1AI = player1AI;
-        this.ip = ip;
-        this.port = port;
-        this.type = type;
-        this.isLocal = false;
-
-        new EventFlow()
-                .listen(this::handleStartClientResponse)
-                .listen(this::handleYourTurn);
-
-        startServerConnection();
-        //startGameLoop();
-    }
-    private void handleYourTurn(NetworkEvents.YourTurnResponse response) {
-        //System.out.println(response.toString());
-        //new EventFlow().addPostEvent(NetworkEvents.SendMove.class, clientId,(short)1).asyncPostEvent();
-
-        new EventFlow().addPostEvent(NetworkEvents.SendCommand.class, clientId,"MOVE 2").asyncPostEvent();
-    }
-
-    private void loginAndSubscribe(GameType type) {
-        if(clientId > 0){
-            new EventFlow().addPostEvent(NetworkEvents.SendLogin.class,clientId,player1).asyncPostEvent();
-            new EventFlow().addPostEvent(NetworkEvents.SendSubscribe.class,clientId,GameType.toName(type)).asyncPostEvent();
-            startGameLoop();
-        }
-        else {
-            logger.warn("Internal client ID is invalid. Failed to log in.");
-        }
-    }
-
-    void handleStartClientResponse(NetworkEvents.StartClientResponse response) {
-        this.clientId = response.clientId();
-        loginAndSubscribe(type);
-    }
-
-    private boolean startServerConnection() {
-        if(!isLocal){
-            if(ip == null || port <= 0){
-                logger.warn("IP address or port is invalid");
-                return false;
-            }
-            else{
-                new EventFlow().addPostEvent(NetworkEvents.StartClient.class,ip,port).asyncPostEvent();
-                return true;
-            }
-        }
-        return false;
-    }
-    private void startGameLoop() {
-        if(!isLocal){
-            //new EventFlow().addPostEvent(NetworkEvents.SendMove.class,clientId,2).asyncPostEvent();
-        }
-    }
-}

app/src/main/java/org/toop/app/events/AppEvents.java

@@ -1,8 +0,0 @@
-package org.toop.app.events;
-
-import org.toop.framework.eventbus.events.EventWithoutSnowflake;
-import org.toop.framework.eventbus.events.EventsBase;
-
-public class AppEvents extends EventsBase {
-	public record OnNodeClick() implements EventWithoutSnowflake {}
-}

app/src/main/java/org/toop/app/layer/Container.java

@@ -1,6 +1,5 @@
 package org.toop.app.layer;
 
-import org.toop.app.events.AppEvents;
 import org.toop.framework.audio.events.AudioEvents;
 import org.toop.framework.eventbus.EventFlow;
 
@@ -153,7 +152,6 @@ public abstract class Container {
 	public Separator addSeparator(String cssClass, boolean horizontal) {
 		final Separator element = new Separator(horizontal ? Orientation.HORIZONTAL : Orientation.VERTICAL);
 		element.getStyleClass().add(cssClass);
-		element.setMinSize(50, 50);
 
 		addNode(element);
 		return element;

app/src/main/java/org/toop/app/layer/layers/game/TicTacToeLayer.java

@@ -94,12 +94,6 @@ public final class TicTacToeLayer extends Layer {
 		}
 
 		final Container controlContainer = new VerticalContainer(5);
-
-		if (information.isPlayerHuman()[0] || information.isConnectionLocal() && information.isPlayerHuman()[1]) {
-			controlContainer.addButton(AppContext.getString("hint"), () -> {
-			});
-		}
-
 		controlContainer.addButton(AppContext.getString("back"), () -> {
 			App.activate(new MainLayer());
 		});

app/src/main/resources/assets/style/app.css

@@ -1,110 +1,244 @@
+/* ─────────────────────────────
+   Root Background
+───────────────────────────── */
 .background {
-	-fx-background-color: linear-gradient(to bottom right, #21a7b2, #8f32b9);
+	/* Layout */
+
+	/* Visual */
+	-fx-background-color: linear-gradient(to bottom right, #3f51b5, #2196f3);
+
+	/* Text */
+
+	/* Effects */
 }
 
-.stack_container, .vertical_container, .horizontal_container {
+/* ─────────────────────────────
-	-fx-padding: 10;
+   Containers
+───────────────────────────── */
+.stack_container,
+.vertical_container,
+.horizontal_container {
+	/* Layout */
+	-fx-padding: 12;
 	-fx-alignment: center;
 
-	-fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d;
+	/* Visual */
-    -fx-background-insets: 0, 2;
+	-fx-background-color: linear-gradient(to bottom right, #4a4e91, #3a3f76);
-    -fx-background-radius: 5;
+	-fx-background-radius: 8;
+
+	/* Text */
+
+	/* Effects */
+	-fx-effect: dropshadow(gaussian, #00000033, 12, 0.3, 0, 4);
 }
 
-.text, .button, .toggle {
+/* ─────────────────────────────
-	-fx-padding: 5 10 5 10;
+   Text Elements (Labels, Headings)
+───────────────────────────── */
+.text {
+	/* Layout */
+	-fx-padding: 4 8;
 
-	-fx-fill: white;
+	/* Visual */
-	-fx-text-fill: white;
 
-	-fx-font-family: "Segoe UI", sans-serif;
+	/* Text */
-	-fx-font-weight: bold;
+	-fx-font-family: "Arial";
-	-fx-font-size: 20px;
+	-fx-font-size: 16px;
+	-fx-fill: #ffffff;
 
-	-fx-background-color: transparent;
+	/* Effects */
+}
 
+/* ─────────────────────────────
+   Buttons and Toggles
+───────────────────────────── */
+.button,
+.toggle {
+	/* Layout */
+	-fx-padding: 8 16;
+
+	/* Visual */
+	-fx-background-color: #5c6bc0;
+	-fx-background-radius: 6;
 	-fx-border-color: transparent;
-}
 
-.button:hover, .toggle:hover {
+	/* Text */
+	-fx-text-fill: #ffffff;
+
+	/* Effects */
+	-fx-effect: dropshadow(gaussian, #00000033, 2, 0.1, 0, 1);
 	-fx-cursor: hand;
-
+	-fx-transition: all 0.2s ease-in-out;
-	-fx-scale-x: 1.1;
-	-fx-scale-y: 1.1;
-
-	-fx-effect: dropshadow(gaussian, #007fff, 10, 0.5, 0, 0);
 }
 
+.button:hover,
+.toggle:hover {
+	/* Layout */
+
+	/* Visual */
+	-fx-background-color: #7986cb;
+
+	/* Text */
+
+	/* Effects */
+	-fx-scale-x: 1.05;
+	-fx-scale-y: 1.05;
+	-fx-effect: dropshadow(gaussian, #90caf9, 8, 0.3, 0, 0);
+}
+
+/* ─────────────────────────────
+   Input Fields
+───────────────────────────── */
 .input {
-	-fx-padding: 10;
+	/* Layout */
+	-fx-padding: 8;
 
-	-fx-fill: white;
+	/* Visual */
-	-fx-text-fill: white;
+	-fx-background-color: #3f3f5a;
+	-fx-background-radius: 6;
+	-fx-border-color: #9fa8da;
+	-fx-border-radius: 6;
 
-	-fx-font-family: "Segoe UI", sans-serif;
+	/* Text */
-	-fx-font-weight: bold;
+	-fx-text-fill: #ffffff;
-	-fx-font-size: 20px;
 
-	-fx-background-color: transparent;
+	/* Effects */
-
+	-fx-cursor: text;
-	-fx-border-color: #7f7f7f;
 }
 
 .input:focused {
-	-fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d;
+	/* Layout */
-	-fx-background-insets: 0, 2;
-	-fx-background-radius: 8;
 
-	-fx-border-color: transparent;
+	/* Visual */
+	-fx-background-color: #5c6bc0;
+	-fx-border-color: #ffffff;
+	-fx-border-width: 2;
+
+	/* Text */
+
+	/* Effects */
 }
 
+/* ─────────────────────────────
+   Sliders
+───────────────────────────── */
 .slider {
+	/* Layout */
 	-fx-padding: 10;
 
+	/* Visual */
 	-fx-background-color: transparent;
+
+	/* Text */
+
+	/* Effects */
 }
 
 .slider .track {
-	-fx-background-color: linear-gradient(to right, #00ff00, #ff0000);
+	/* Layout */
+
+	/* Visual */
+	-fx-background-color: linear-gradient(to right, #76ff03, #ff5252);
 	-fx-background-radius: 2;
+	-fx-pref-height: 6;
+
+	/* Text */
+
+	/* Effects */
 }
 
 .slider .thumb {
-	-fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d;
+	/* Layout */
+
+	/* Visual */
+	-fx-background-color: #ffffff;
+	-fx-background-radius: 50%;
+
+	/* Text */
+
+	/* Effects */
+	-fx-effect: dropshadow(gaussian, #0000004d, 4, 0.2, 0, 1);
+	-fx-cursor: hand;
 }
 
+/* ─────────────────────────────
+   ChoiceBox
+───────────────────────────── */
 .choicebox {
+	/* Layout */
 	-fx-alignment: center;
 
-	-fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d;
+	/* Visual */
-	-fx-background-insets: 0, 2;
+	-fx-background-color: #5c6bc0;
-	-fx-background-radius: 8;
+	-fx-background-radius: 6;
-
 	-fx-border-color: transparent;
+
+	/* Text */
+
+	/* Effects */
+	-fx-cursor: hand;
 }
 
 .choicebox .label {
-	-fx-text-fill: white;
+	/* Layout */
-	-fx-alignment: center;
+	-fx-padding: 6 12;
-	-fx-padding: 5 10 5 10;
+
+	/* Visual */
+
+	/* Text */
+	-fx-text-fill: #ffffff;
+
+	/* Effects */
 }
 
 .choicebox .arrow {
-	-fx-background-color: transparent;
+	/* Layout */
+
+	/* Visual */
+	-fx-background-color: #ffffff;
+
+	/* Text */
+
+	/* Effects */
 }
 
 .choicebox .context-menu {
-	-fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d;
+	/* Layout */
-	-fx-background-insets: 0, 2;
+
-	-fx-background-radius: 5;
+	/* Visual */
+	-fx-background-color: #3f3f5a;
+	-fx-background-radius: 6;
+
+	/* Text */
+
+	/* Effects */
 }
 
 .choicebox .menu-item:hover {
+	/* Layout */
+
+	/* Visual */
+	-fx-background-color: #7986cb;
+
+	/* Text */
+
+	/* Effects */
 	-fx-cursor: hand;
-
-	-fx-background-color: #ffffff11;
 }
 
+/* ─────────────────────────────
+   Separator
+───────────────────────────── */
 .separator {
-	-fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d;
+	/* Layout */
+	-fx-padding: 8 0;
+	-fx-border-insets: 4 0 4 0;
+
+	/* Visual */
+	-fx-border-color: #ffffff55;
+	-fx-border-width: 0 0 1 0;
+
+	/* Text */
+
+	/* Effects */
 }