Alpha UI update (#95)

* added localization options
//todo add all the strings

* broken push

* merge to UI

* broken push

* Alpha rebase complete, added asset loader for UI branch

* merge to UI

* UI now uses assetmanager

* added NL and EN for all strings currently in UI

* fix small merge error

---------

Co-authored-by: Ticho Hidding <tichohidding@gmail.com>
Co-authored-by: ramollia <@>

.idea/misc.xml

@@ -13,7 +13,7 @@
       </list>
     </option>
   </component>
-  <component name="ProjectRootManager" version="2" languageLevel="JDK_24" project-jdk-name="openjdk-25" project-jdk-type="JavaSDK">
+  <component name="ProjectRootManager" version="2" languageLevel="JDK_25" default="true" project-jdk-name="openjdk-25" project-jdk-type="JavaSDK">
     <output url="file://$PROJECT_DIR$/out" />
   </component>
 </project>

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

@@ -8,12 +8,19 @@ import javafx.application.Application;
 import javafx.scene.layout.StackPane;
 import javafx.scene.Scene;
 import javafx.stage.Stage;
+import org.toop.local.AppContext;
+
+import java.util.Locale;
+import java.util.ResourceBundle;
 
 public class App extends Application {
 	private static Stage stage;
 	private static Scene scene;
 	private static StackPane root;
 
+    private Locale currentLocale = AppContext.getLocale();
+    private ResourceBundle resourceBundle = ResourceBundle.getBundle("Localization", currentLocale);
+
 	public static void run(String[] args) {
 		launch(args);
 	}
@@ -23,7 +30,7 @@ public class App extends Application {
 		final StackPane root = new StackPane(new MainMenu().getPane());
 		final Scene scene = new Scene(root);
 
-		stage.setTitle("pism");
+		stage.setTitle(resourceBundle.getString("windowTitle"));
 		stage.setMinWidth(1080);
 		stage.setMinHeight(720);
 

app/src/main/java/org/toop/app/menu/CreditsMenu.java

@@ -1,6 +1,13 @@
 package org.toop.app.menu;
 
+import org.toop.local.AppContext;
+
+import java.util.Locale;
+import java.util.ResourceBundle;
+
 public final class CreditsMenu extends Menu {
+    private Locale currentLocale = AppContext.getLocale();
+    private ResourceBundle resourceBundle = ResourceBundle.getBundle("Localization", currentLocale);
     public CreditsMenu() {
 	}
 }

app/src/main/java/org/toop/app/menu/MainMenu.java

@@ -4,28 +4,46 @@ import javafx.geometry.Pos;
 import javafx.scene.control.Button;
 import javafx.scene.image.ImageView;
 import javafx.scene.layout.*;
+import org.toop.local.AppContext;
+
+import java.util.Locale;
+import java.util.ResourceBundle;
+import org.toop.framework.asset.AssetManager;
+import org.toop.framework.asset.resources.CssAsset;
+import org.toop.framework.asset.resources.ImageAsset;
 
 public final class MainMenu extends Menu {
+	private Locale currentLocale = AppContext.getLocale();
+    private ResourceBundle resourceBundle = ResourceBundle.getBundle("Localization", currentLocale);
+
     public MainMenu() {
-		final ImageView background = new ImageView();
+		final Button tictactoe = createButton(resourceBundle.getString("mainMenuSelectTicTacToe"), () -> {});
+		final Button reversi = createButton(resourceBundle.getString("mainMenuSelectReversi"), () -> {});
+		final Button sudoku = createButton(resourceBundle.getString("mainMenuSelectSudoku"), () -> {});
+		final Button battleship = createButton(resourceBundle.getString("mainMenuSelectBattleship"), () -> {});
+		final Button other = createButton(resourceBundle.getString("mainMenuSelectOther"), () -> {});
 
-		final Button tictactoe = createButton("Tic Tac Toe", () -> {});
+		final VBox gamesBox = new VBox(tictactoe, reversi, sudoku, battleship, other);
-		final Button reversi = createButton("Reversi", () -> {});
-		final Button sudoku = createButton("Sudoku", () -> {});
-		final Button battleship = createButton("Battleship", () -> {});
-		final Button other = createButton("Other", () -> {});
-
-		final VBox gamesBox = new VBox(tictactoe, reversi, sudoku, background, other);
 		gamesBox.setAlignment(Pos.TOP_CENTER);
 
-		final Button credits = createButton("Credits", () -> {});
+		final Button credits = createButton(resourceBundle.getString("mainMenuSelectCredits"), () -> {});
-		final Button options = createButton("Options", () -> {});
+		final Button options = createButton(resourceBundle.getString("mainMenuSelectOptions"), () -> {});
-		final Button quit = createButton("Quit", () -> {});
+		final Button quit = createButton(resourceBundle.getString("mainMenuSelectQuit"), () -> {});
 
-		final VBox creditsBox = new VBox(10, credits, options, quit);
+		final VBox creditsBox = new VBox(credits, options, quit);
 		creditsBox.setAlignment(Pos.BOTTOM_CENTER);
 
-		//pane = new StackPane(background, grid);
+		VBox grid = new VBox(20, gamesBox, creditsBox);
-		pane.getStylesheets().add(getClass().getResource("/style/main.css").toExternalForm());
+		grid.setAlignment(Pos.CENTER);
+
+		ImageAsset backgroundImage = (ImageAsset) AssetManager.getByName("background.jpg").getResource();
+		ImageView background = new ImageView(backgroundImage.getImage());
+		background.setPreserveRatio(false);
+		background.fitWidthProperty().bind(grid.widthProperty());
+		background.fitHeightProperty().bind(grid.heightProperty());
+
+		pane = new StackPane(background, grid);
+		CssAsset css = (CssAsset) AssetManager.getByName("main.css").getResource();
+		pane.getStylesheets().add(css.getUrl());
 	}
 }

app/src/main/java/org/toop/app/menu/Menu.java

@@ -6,10 +6,16 @@ import javafx.animation.FadeTransition;
 import javafx.scene.control.Button;
 import javafx.scene.layout.Pane;
 import javafx.util.Duration;
+import org.toop.local.AppContext;
+
+import java.util.Locale;
+import java.util.ResourceBundle;
 
 public abstract class Menu {
 	protected Pane pane;
 	public Pane getPane() { return pane; }
+    private Locale currentLocale = AppContext.getLocale();
+    private ResourceBundle resourceBundle = ResourceBundle.getBundle("Localization", currentLocale);
 
 	public void fadeBackgroundImage(String imagePath, float from, float to, float milliseconds) {
 		final FadeTransition fade = new FadeTransition(Duration.millis(milliseconds), App.getRoot());

app/src/main/java/org/toop/app/menu/OptionsMenu.java

@@ -1,6 +1,13 @@
 package org.toop.app.menu;
 
+import org.toop.local.AppContext;
+
+import java.util.Locale;
+import java.util.ResourceBundle;
+
 public final class OptionsMenu extends Menu {
+    private Locale currentLocale = AppContext.getLocale();
+    private ResourceBundle resourceBundle = ResourceBundle.getBundle("Localization", currentLocale);
     public OptionsMenu() {
 	}
 }

app/src/main/java/org/toop/app/menu/QuitMenu.java

@@ -8,23 +8,31 @@ import javafx.scene.layout.StackPane;
 import javafx.scene.layout.VBox;
 import javafx.scene.text.Text;
 import org.toop.app.App;
+import org.toop.framework.asset.AssetManager;
+import org.toop.framework.asset.resources.CssAsset;
+import org.toop.local.AppContext;
+
+import java.util.Locale;
+import java.util.ResourceBundle;
 
 public final class QuitMenu extends Menu {
+    private Locale currentLocale = AppContext.getLocale();
+    private ResourceBundle resourceBundle = ResourceBundle.getBundle("Localization", currentLocale);
     public QuitMenu() {
 		final Region background = new Region();
 		background.getStyleClass().add("quit-background");
 		background.setPrefSize(Double.MAX_VALUE, Double.MAX_VALUE);
 
-		final Text sure = new Text("Are you sure?");
+		final Text sure = new Text(resourceBundle.getString("quitMenuTextSure"));
 		sure.getStyleClass().add("quit-text");
 
-		final Button yes = new Button("Yes");
+		final Button yes = new Button(resourceBundle.getString("quitMenuButtonYes"));
 		yes.getStyleClass().add("quit-button");
 		yes.setOnAction(_ -> {
 			App.quit();
 		});
 
-		final Button no = new Button("No");
+		final Button no = new Button(resourceBundle.getString("quitMenuButtonNo"));
 		no.getStyleClass().add("quit-button");
 		no.setOnAction(_ -> {
 			App.pop();
@@ -43,6 +51,7 @@ public final class QuitMenu extends Menu {
 		StackPane.setAlignment(box, Pos.CENTER);
 
 		pane = modalContainer;
-		pane.getStylesheets().add(getClass().getResource("/style/quit.css").toExternalForm());
+		CssAsset css = (CssAsset) AssetManager.getByName("quit.css").getResource();
+		pane.getStylesheets().add(css.getUrl());
 	}
 }

app/src/main/java/org/toop/local/AppContext.java

@@ -0,0 +1,14 @@
+package org.toop.local;
+
+import java.util.Locale;
+
+public class AppContext {
+    private static Locale currentLocale = Locale.getDefault();
+
+    public static void setCurrentLocale(Locale locale) {
+        currentLocale = locale;
+    }
+    public static Locale getLocale() {
+        return currentLocale;
+    }
+}

app/src/main/resources/Localization.properties

@@ -0,0 +1,17 @@
+# Window title
+windowTitle=ISY Games Selector
+
+# Main Menu buttons
+mainMenuSelectTicTacToe=Tic Tac Toe
+mainMenuSelectReversi=Reversi
+mainMenuSelectSudoku=Sudoku
+mainMenuSelectBattleship=Battleship
+mainMenuSelectOther=Other
+mainMenuSelectCredits=Credits
+mainMenuSelectOptions=Options
+mainMenuSelectQuit=Quit
+
+# Quit Menu text and buttons
+quitMenuTextSure=Are you sure?
+quitMenuButtonYes=Yes
+quitMenuButtonNo=No

app/src/main/resources/Localization_nl.properties

@@ -0,0 +1,17 @@
+# Window title
+windowTitle=ISY Spellen Kiezer
+
+# Main Menu buttons
+mainMenuSelectTicTacToe=Boter Kaas En Eieren
+mainMenuSelectReversi=Reversi
+mainMenuSelectSudoku=Sudoku
+mainMenuSelectBattleship=Zeeslag
+mainMenuSelectOther=Anders
+mainMenuSelectCredits=Credits
+mainMenuSelectOptions=Opties
+mainMenuSelectQuit=Afsluiten
+
+# Quit Menu text and buttons
+quitMenuTextSure=Weet je het zeker?
+quitMenuButtonYes=Ja
+quitMenuButtonNo=Nee

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

@@ -0,0 +1,33 @@
+.main-button {
+	-fx-background-color: transparent;
+	-fx-background-image: url("card-default.jpg"); /* fallback image */
+	-fx-background-size: cover;
+	-fx-background-position: center;
+	-fx-pref-width: 250px;
+	-fx-pref-height: 180px;
+	-fx-border-radius: 15;
+	-fx-background-radius: 15;
+	-fx-effect: dropshadow(gaussian, rgba(0,0,0,0.3), 15, 0.4, 0, 4);
+	-fx-cursor: hand;
+	-fx-padding: 0;
+}
+
+.card-label {
+	-fx-background-color: rgba(0, 0, 0, 0.5);
+	-fx-font-size: 20px;
+	-fx-font-weight: bold;
+	-fx-text-fill: white;
+	-fx-padding: 10px;
+	-fx-alignment: top-center;
+	-fx-background-radius: 15 15 0 0;
+	-fx-opacity: 0;
+	-fx-transition: all 0.3s ease;
+}
+
+.main-button:hover {
+	-fx-effect: dropshadow(gaussian, #00ffff, 15, 0.5, 0, 0);
+}
+
+.main-button:hover .card-label {
+	-fx-opacity: 1;
+}

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

@@ -0,0 +1,33 @@
+.quit-background {
+	-fx-background-color: rgba(0, 0, 0, 0.6);
+}
+
+.quit-box {
+	-fx-background-color: rgba(30, 30, 30, 0.95);
+	-fx-background-radius: 15;
+	-fx-padding: 30;
+	-fx-effect: dropshadow(gaussian, black, 20, 0.6, 0, 4);
+}
+
+.quit-text {
+	-fx-fill: white;
+	-fx-font-size: 28px;
+	-fx-font-weight: 600;
+	-fx-font-family: "Segoe UI", sans-serif;
+}
+
+.quit-button {
+	-fx-font-size: 16px;
+	-fx-text-fill: white;
+	-fx-background-color: transparent;
+	-fx-border-color: white;
+	-fx-border-radius: 5;
+	-fx-padding: 8 20;
+	-fx-cursor: hand;
+}
+
+.quit-button:hover {
+	-fx-text-fill: #00ffff;
+	-fx-border-color: #00ffff;
+	-fx-effect: dropshadow(gaussian, #00ffff, 8, 0.5, 0, 0);
+}

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

@@ -0,0 +1,20 @@
+.root {
+	-fx-background-color: #2d2d2d;
+
+	-fx-font-size: 28px;
+	-fx-font-weight: 600;
+	-fx-font-family: "Segoe UI", sans-serif;
+}
+
+.button {
+	-fx-background-color: transparent;
+	-fx-text-fill: white;
+	-fx-border-color: transparent;
+	-fx-padding: 10 20;
+	-fx-cursor: hand;
+	-fx-effect: null;
+}
+
+.button:hover {
+	-fx-effect: dropshadow(gaussian, #00ffff, 10, 0.3, 0, 0);
+}

framework/src/main/java/org/toop/framework/asset/resources/CssAsset.java

@@ -0,0 +1,17 @@
+package org.toop.framework.asset.resources;
+
+import java.io.File;
+
+@FileExtension({"css"})
+public class CssAsset extends BaseResource {
+    private final String url;
+
+    public CssAsset(File file) {
+        super(file);
+        this.url = file.toURI().toString();
+    }
+
+    public String getUrl() {
+        return url;
+    }
+}