diff --git a/app/src/main/java/org/toop/app/App.java b/app/src/main/java/org/toop/app/App.java index 26e93d3..d0116cb 100644 --- a/app/src/main/java/org/toop/app/App.java +++ b/app/src/main/java/org/toop/app/App.java @@ -1,5 +1,6 @@ package org.toop.app; +import org.toop.app.canvas.GameCanvas; import org.toop.app.layer.Layer; import org.toop.app.layer.layers.MainLayer; import org.toop.app.layer.layers.QuitLayer; @@ -73,6 +74,10 @@ public final class App extends Application { isQuitting = false; } + public static void pushCanvas(GameCanvas canvas) { + root.getChildren().addLast(canvas.getCanvas()); + } + public static void popAll() { final int childrenCount = root.getChildren().size(); 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 f5bb387..7d53475 100644 --- a/app/src/main/java/org/toop/app/layer/Container.java +++ b/app/src/main/java/org/toop/app/layer/Container.java @@ -6,8 +6,8 @@ import org.toop.framework.eventbus.GlobalEventBus; import javafx.beans.property.BooleanProperty; import javafx.beans.property.SimpleBooleanProperty; import javafx.scene.Node; -import javafx.scene.control.Button; import javafx.scene.control.Label; +import javafx.scene.control.TextField; import javafx.scene.layout.Region; import javafx.scene.text.Text; import javafx.scene.text.TextFlow; @@ -20,43 +20,40 @@ public abstract class Container { public abstract void addNode(Node node); public abstract void addContainer(Container container, boolean fill); - public Text addText(String cssClass, String x, boolean wrap) { + public void addText(String cssClass, String x, boolean wrap) { final Text element = new Text(x); element.getStyleClass().add(cssClass); if (wrap) { addNode(new TextFlow(element)); } else { addNode(element); } - - return element; } - public Text addText(String x, boolean wrap) { - return addText("text", x, wrap); + public void addText(String x, boolean wrap) { + addText("text", x, wrap); } - public Button addButton(String cssClass, String x, Runnable runnable) { - final Button element = new Button(x); + public void addButton(String cssClass, String x, Runnable runnable) { + final Label element = new Label(x); element.getStyleClass().add(cssClass); element.setOnMouseEntered(_ -> { GlobalEventBus.post(new AppEvents.OnNodeHover()); }); - element.setOnAction(_ -> { + element.setOnMouseClicked(_ -> { GlobalEventBus.post(new AppEvents.OnNodeClick()); runnable.run(); }); addNode(element); - return element; } - public Button addButton(String x, Runnable runnable) { - return addButton("button", x, runnable); + public void addButton(String x, Runnable runnable) { + addButton("button", x, runnable); } - public Label addToggle(String cssClass, String x1, String x2, boolean toggled, Consumer consumer) { + public void addToggle(String cssClass, String x1, String x2, boolean toggled, Consumer consumer) { final Label element = new Label(toggled? x2 : x1); element.getStyleClass().add(cssClass); @@ -80,10 +77,28 @@ public abstract class Container { }); addNode(element); - return element; } - public Label addToggle(String x1, String x2, boolean toggled, Consumer consumer) { - return addToggle("toggle", x1, x2, toggled, consumer); + public void addToggle(String x1, String x2, boolean toggled, Consumer consumer) { + addToggle("toggle", x1, x2, toggled, consumer); + } + + public void addInput(String cssClass, String input, Consumer consumer) { + final TextField element = new TextField(input); + element.getStyleClass().add(cssClass); + + element.setOnMouseEntered(_ -> { + GlobalEventBus.post(new AppEvents.OnNodeHover()); + }); + + element.textProperty().addListener((_, _, newValue) -> { + consumer.accept(newValue); + }); + + addNode(element); + } + + public void addInput(String input, Consumer consumer) { + addInput("input", input, consumer); } } \ No newline at end of file diff --git a/app/src/main/java/org/toop/app/layer/Layer.java b/app/src/main/java/org/toop/app/layer/Layer.java index 3175f25..a33ea92 100644 --- a/app/src/main/java/org/toop/app/layer/Layer.java +++ b/app/src/main/java/org/toop/app/layer/Layer.java @@ -1,6 +1,7 @@ package org.toop.app.layer; import org.toop.app.App; +import org.toop.app.canvas.GameCanvas; import org.toop.framework.asset.ResourceManager; import org.toop.framework.asset.resources.CssAsset; @@ -48,6 +49,26 @@ public abstract class Layer { layer.getChildren().addLast(container.getContainer()); } + protected void addCanvas(GameCanvas canvas, Pos position, int xOffset, int yOffset, int widthPercent, int heightPercent) { + StackPane.setAlignment(canvas.getCanvas(), position); + + final double widthUnit = App.getWidth() / 100.0; + final double heightUnit = App.getHeight() / 100.0; + + if (widthPercent > 0) { + canvas.getCanvas().setWidth(widthPercent * widthUnit); + } else { canvas.getCanvas().setWidth(Region.USE_PREF_SIZE); } + + if (heightPercent > 0) { + canvas.getCanvas().setHeight(heightPercent * heightUnit); + } else { canvas.getCanvas().setHeight(Region.USE_PREF_SIZE); } + + canvas.getCanvas().setTranslateX(xOffset * widthUnit); + canvas.getCanvas().setTranslateY(yOffset * heightUnit); + + layer.getChildren().addLast(canvas.getCanvas()); + } + protected void pop() { if (layer.getChildren().size() <= 1) { return; diff --git a/app/src/main/java/org/toop/app/layer/layers/GameLayer.java b/app/src/main/java/org/toop/app/layer/layers/GameLayer.java new file mode 100644 index 0000000..3d2e645 --- /dev/null +++ b/app/src/main/java/org/toop/app/layer/layers/GameLayer.java @@ -0,0 +1,26 @@ +package org.toop.app.layer.layers; + +import javafx.geometry.Pos; +import org.toop.app.App; +import org.toop.app.canvas.TicTacToeCanvas; +import org.toop.app.layer.Container; +import org.toop.app.layer.Layer; +import org.toop.app.layer.containers.VerticalContainer; + +public class GameLayer extends Layer { + public GameLayer() { + super("game.css"); + reload(); + } + + @Override + public void reload() { + App.popAll(); + + final Container controlContainer = new VerticalContainer(5); + controlContainer.addButton("Back", () -> { App.activate(new MainLayer()); }); + + addCanvas(new TicTacToeCanvas(), Pos.CENTER, 0, 0, 100, 100); + addContainer(controlContainer, Pos.BOTTOM_LEFT, 2, -2, 0, 0); + } +} \ No newline at end of file diff --git a/app/src/main/java/org/toop/app/layer/layers/MultiplayerLayer.java b/app/src/main/java/org/toop/app/layer/layers/MultiplayerLayer.java index 4d39cf8..10a6210 100644 --- a/app/src/main/java/org/toop/app/layer/layers/MultiplayerLayer.java +++ b/app/src/main/java/org/toop/app/layer/layers/MultiplayerLayer.java @@ -2,6 +2,7 @@ package org.toop.app.layer.layers; import org.toop.app.App; import org.toop.app.GameType; +import org.toop.app.canvas.TicTacToeCanvas; import org.toop.app.layer.Container; import org.toop.app.layer.Layer; import org.toop.app.layer.containers.HorizontalContainer; @@ -41,6 +42,12 @@ public class MultiplayerLayer extends Layer { final Container player2Container = new VerticalContainer("player_container", 5); playersContainer.addContainer(player2Container, true); + if (isConnectionLocal) { + mainContainer.addButton("Start", () -> {}); + } else { + mainContainer.addButton("Connnect", () -> { App.activate(new GameLayer()); }); + } + player1Container.addToggle("Human", "Computer", !isPlayer1Human, (computer) -> { isPlayer1Human = !computer; reload(); @@ -68,8 +75,11 @@ public class MultiplayerLayer extends Layer { player2Container.addToggle("Easy", "Hard", false, (hard) -> {}); } } else { - player2Container.addText("enter server ip here: ...", true); - player2Container.addText("enter server port here: ...", true); + player2Container.addText("Server IP", true); + player2Container.addInput("", (input) -> {}); + + player2Container.addText("Server Port", true); + player2Container.addInput("", (input) -> {}); } final Container controlContainer = new VerticalContainer(5); diff --git a/app/src/main/resources/assets/style/app.css b/app/src/main/resources/assets/style/app.css index 49420b4..6bafc5b 100644 --- a/app/src/main/resources/assets/style/app.css +++ b/app/src/main/resources/assets/style/app.css @@ -3,37 +3,43 @@ } .vertical_container, .horizontal_container { - -fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d; - -fx-background-insets: 0, 2; - -fx-background-radius: 8; - -fx-padding: 10; + -fx-padding: 10; -fx-alignment: center; -fx-text-alignment: center; + + -fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d; + -fx-background-insets: 0, 2; + -fx-background-radius: 5; } -.text { +.text, .button, .toggle, .input { + -fx-padding: 10; + -fx-fill: white; + -fx-text-fill: white; -fx-font-family: "Segoe UI", sans-serif; -fx-font-weight: bold; - -fx-font-size: 24px; -} - -.button, .toggle { - -fx-padding: 10; + -fx-font-size: 20px; -fx-background-color: transparent; -fx-border-color: transparent; - - -fx-transition: all 0.3s ease-in-out; } .button:hover, .toggle:hover { -fx-cursor: hand; - -fx-scale-x: 1.1; - -fx-scale-y: 1.1; + -fx-scale-x: 1.1; + -fx-scale-y: 1.1; - -fx-effect: dropshadow(gaussian, #007fff, 10, 0.5, 0, 0); + -fx-effect: dropshadow(gaussian, #007fff, 10, 0.5, 0, 0); +} + +.input:focused { + -fx-border-color: transparent; + + -fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d; + -fx-background-insets: 0, 2; + -fx-background-radius: 8; } \ No newline at end of file diff --git a/app/src/main/resources/assets/style/game.css b/app/src/main/resources/assets/style/game.css new file mode 100644 index 0000000..e69de29