From cfde1f8d7fb8dbd72730c3c9c36061baf7b3b133 Mon Sep 17 00:00:00 2001 From: ramollia <@> Date: Mon, 6 Oct 2025 11:43:09 +0200 Subject: [PATCH] update: style --- app/src/main/java/org/toop/app/App.java | 2 - app/src/main/java/org/toop/app/GameType.java | 21 -- app/src/main/java/org/toop/app/Match.java | 89 ------- .../java/org/toop/app/events/AppEvents.java | 8 - .../java/org/toop/app/layer/Container.java | 2 - .../app/layer/layers/game/TicTacToeLayer.java | 6 - app/src/main/resources/assets/style/app.css | 234 ++++++++++++++---- 7 files changed, 184 insertions(+), 178 deletions(-) delete mode 100644 app/src/main/java/org/toop/app/GameType.java delete mode 100644 app/src/main/java/org/toop/app/Match.java delete mode 100644 app/src/main/java/org/toop/app/events/AppEvents.java diff --git a/app/src/main/java/org/toop/app/App.java b/app/src/main/java/org/toop/app/App.java index b54fa79..7faf034 100644 --- a/app/src/main/java/org/toop/app/App.java +++ b/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 stack; private static int height; private static int width; - private static SettingsAsset settingsAsset; private static boolean isQuitting; diff --git a/app/src/main/java/org/toop/app/GameType.java b/app/src/main/java/org/toop/app/GameType.java deleted file mode 100644 index 0218ece..0000000 --- a/app/src/main/java/org/toop/app/GameType.java +++ /dev/null @@ -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; - }; - } -} \ No newline at end of file diff --git a/app/src/main/java/org/toop/app/Match.java b/app/src/main/java/org/toop/app/Match.java deleted file mode 100644 index 1373e5a..0000000 --- a/app/src/main/java/org/toop/app/Match.java +++ /dev/null @@ -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(); - } - } -} diff --git a/app/src/main/java/org/toop/app/events/AppEvents.java b/app/src/main/java/org/toop/app/events/AppEvents.java deleted file mode 100644 index aa07457..0000000 --- a/app/src/main/java/org/toop/app/events/AppEvents.java +++ /dev/null @@ -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 {} -} \ No newline at end of file diff --git a/app/src/main/java/org/toop/app/layer/Container.java b/app/src/main/java/org/toop/app/layer/Container.java index 3b67be3..ceac80a 100644 --- a/app/src/main/java/org/toop/app/layer/Container.java +++ b/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; diff --git a/app/src/main/java/org/toop/app/layer/layers/game/TicTacToeLayer.java b/app/src/main/java/org/toop/app/layer/layers/game/TicTacToeLayer.java index 63ff1ed..1fe61f9 100644 --- a/app/src/main/java/org/toop/app/layer/layers/game/TicTacToeLayer.java +++ b/app/src/main/java/org/toop/app/layer/layers/game/TicTacToeLayer.java @@ -96,12 +96,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()); }); diff --git a/app/src/main/resources/assets/style/app.css b/app/src/main/resources/assets/style/app.css index 2ca80d3..ad615e1 100644 --- a/app/src/main/resources/assets/style/app.css +++ b/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; - -fx-background-insets: 0, 2; - -fx-background-radius: 5; + /* Visual */ + -fx-background-color: linear-gradient(to bottom right, #4a4e91, #3a3f76); + -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; - -fx-text-fill: white; + /* Visual */ - -fx-font-family: "Segoe UI", sans-serif; - -fx-font-weight: bold; - -fx-font-size: 20px; + /* Text */ + -fx-font-family: "Arial"; + -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-scale-x: 1.1; - -fx-scale-y: 1.1; - - -fx-effect: dropshadow(gaussian, #007fff, 10, 0.5, 0, 0); + -fx-transition: all 0.2s ease-in-out; } +.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; - -fx-text-fill: white; + /* Visual */ + -fx-background-color: #3f3f5a; + -fx-background-radius: 6; + -fx-border-color: #9fa8da; + -fx-border-radius: 6; - -fx-font-family: "Segoe UI", sans-serif; - -fx-font-weight: bold; - -fx-font-size: 20px; + /* Text */ + -fx-text-fill: #ffffff; - -fx-background-color: transparent; - - -fx-border-color: #7f7f7f; + /* Effects */ + -fx-cursor: text; } .input:focused { - -fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d; - -fx-background-insets: 0, 2; - -fx-background-radius: 8; + /* Layout */ - -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; - -fx-background-insets: 0, 2; - -fx-background-radius: 8; - + /* Visual */ + -fx-background-color: #5c6bc0; + -fx-background-radius: 6; -fx-border-color: transparent; + + /* Text */ + + /* Effects */ + -fx-cursor: hand; } .choicebox .label { - -fx-text-fill: white; - -fx-alignment: center; - -fx-padding: 5 10 5 10; + /* Layout */ + -fx-padding: 6 12; + + /* 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; - -fx-background-insets: 0, 2; - -fx-background-radius: 5; + /* Layout */ + + /* Visual */ + -fx-background-color: #3f3f5a; + -fx-background-radius: 6; + + /* Text */ + + /* Effects */ } .choicebox .menu-item:hover { - -fx-cursor: hand; + /* Layout */ - -fx-background-color: #ffffff11; + /* Visual */ + -fx-background-color: #7986cb; + + /* Text */ + + /* Effects */ + -fx-cursor: hand; } +/* ───────────────────────────── + 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 */ } \ No newline at end of file