Resolve "Update leaderboard screen to use scene2d"

frontend/core/src/com/game/tankwars/controller/LeaderboardController.java

@@ -3,17 +3,49 @@ package com.game.tankwars.controller;
 import com.badlogic.gdx.Gdx;
 import com.badlogic.gdx.Net;
 import com.badlogic.gdx.net.HttpRequestBuilder;
+import com.badlogic.gdx.scenes.scene2d.InputEvent;
+import com.badlogic.gdx.scenes.scene2d.InputListener;
+import com.badlogic.gdx.scenes.scene2d.ui.Button;
 import com.badlogic.gdx.utils.Array;
 import com.badlogic.gdx.utils.Json;
 import com.game.tankwars.Callback;
 import com.game.tankwars.ConfigReader;
 import com.game.tankwars.ReceiverHandler;
+import com.game.tankwars.TankWarsGame;
 import com.game.tankwars.model.User;
+import com.game.tankwars.view.LeaderboardScreen;
+import com.game.tankwars.view.MainMenuScreen;
 
 public class LeaderboardController {
+
+    private final TankWarsGame tankWarsGame;
+    private final Button backButton;
+    private final LeaderboardScreen screen;
     Array<User> leaderboardUsers;
     private int retries = 0;
 
+    public LeaderboardController(final TankWarsGame tankWarsGame, Button backButton, LeaderboardScreen screen) {
+        this.tankWarsGame = tankWarsGame;
+        this.backButton = backButton;
+        this.screen = screen;
+
+        setEventListeners();
+        fetchLeaderboard();
+    }
+
+    private void setEventListeners() {
+        /*
+         * Transition back to main menu
+         */
+        backButton.addListener(new InputListener() {
+            @Override
+            public boolean touchDown(InputEvent event, float x, float y, int pointer, int button) {
+                tankWarsGame.setScreen(new MainMenuScreen(tankWarsGame));
+                return true;
+            }
+        });
+    }
+
     public void fetchLeaderboard() {
         // Create a new instance of the Callback interface to handle the response
         Callback callback = new Callback() {
@@ -32,9 +64,9 @@ public class LeaderboardController {
                 retries += 1;
             }
         };
+
         // Define the URL for the HTTP request
         String url = ConfigReader.getProperty("backend.url") + "/highscores";
-
         // Create a new HttpRequest using the HttpRequestBuilder class
         Net.HttpRequest httpRequest = new HttpRequestBuilder()
                 .newRequest()

frontend/core/src/com/game/tankwars/view/LeaderboardScreen.java

@@ -2,80 +2,139 @@ package com.game.tankwars.view;
 
 import com.badlogic.gdx.Gdx;
 import com.badlogic.gdx.Screen;
-import com.badlogic.gdx.graphics.Color;
-import com.badlogic.gdx.graphics.OrthographicCamera;
-import com.badlogic.gdx.graphics.g2d.BitmapFont;
 import com.badlogic.gdx.graphics.g2d.SpriteBatch;
+import com.badlogic.gdx.scenes.scene2d.Group;
+import com.badlogic.gdx.scenes.scene2d.Stage;
+import com.badlogic.gdx.scenes.scene2d.ui.Button;
+import com.badlogic.gdx.scenes.scene2d.ui.Image;
+import com.badlogic.gdx.scenes.scene2d.ui.Label;
+import com.badlogic.gdx.scenes.scene2d.ui.ScrollPane;
+import com.badlogic.gdx.scenes.scene2d.ui.Skin;
 import com.badlogic.gdx.scenes.scene2d.ui.Table;
+import com.badlogic.gdx.scenes.scene2d.utils.Drawable;
+import com.badlogic.gdx.utils.Align;
 import com.badlogic.gdx.utils.Array;
 import com.badlogic.gdx.utils.ScreenUtils;
+import com.badlogic.gdx.utils.viewport.ExtendViewport;
+import com.game.tankwars.ResourceManager;
 import com.game.tankwars.TankWarsGame;
 import com.game.tankwars.controller.LeaderboardController;
 import com.game.tankwars.model.User;
 
-import java.awt.Label;
-
 public class LeaderboardScreen implements Screen {
 
-    final TankWarsGame tankWarsGame;
-    OrthographicCamera camera;
-    SpriteBatch batch;
-    private BitmapFont font;
-
-    //LibGDX have tables or something, should be investigated
-    Table table;
+    private final TankWarsGame tankWarsGame;
+    private Stage stage;
 
-    private Array<User> leaderboardUsers;
+    private Skin skin;
+    private Table boardTable;
     LeaderboardController leaderboardController;
 
 
 
     public LeaderboardScreen (final TankWarsGame tankWarsGame) {
         this.tankWarsGame = tankWarsGame;
-        camera = new OrthographicCamera();
-        batch = new SpriteBatch();
-        font = new BitmapFont();
-        font.getData().setScale(3f);
-        font.setColor(Color.BLACK);
-
-        leaderboardController = new LeaderboardController();
     }
 
     @Override
-    public void render(float delta) {
-        ScreenUtils.clear(255, 255, 255, 1);
-        int height = Gdx.graphics.getHeight() - 75;
-        batch.begin();
-        leaderboardUsers = leaderboardController.getLeaderboard();
+    public void show() {
+        stage = new Stage(new ExtendViewport(tankWarsGame.getViewportWidth(),
+                tankWarsGame.getViewportHeight()), new SpriteBatch());
+        Gdx.input.setInputProcessor(stage);
+
+        skin = ResourceManager.getInstance().loadAndGetMenuAssets();
+
+        Image background = new Image(skin.getDrawable("camo-background-portrait-blurred"));
+        Image logo = new Image(skin.getDrawable("logo"));
+        Drawable headerBox = skin.getDrawable("dark-menu-header");
+        Drawable boardBackground = skin.getDrawable("transparent-white-box");
+
+        Label leaderboardLabel = new Label("Leaderboard", skin.get("header", Label.LabelStyle.class));
+        Label userLabel = new Label("User", skin.get("header", Label.LabelStyle.class));
+        Label pointsLabel = new Label("Wins", skin.get("header", Label.LabelStyle.class));
+
+        Button backButton = new Button(skin.get("default", Button.ButtonStyle.class));
+
+        //--- Layout
+        float logoWidth = stage.getWidth() / 4f;
+        float headerPadding = backButton.getWidth() + 16;
+
+        Table headerTable = new Table();
+        headerTable.background(headerBox);
+        headerTable.add(backButton).padLeft(headerPadding - backButton.getWidth());
+        headerTable.add(logo).width(logoWidth).
+                height(logo.getHeight() / logo.getWidth() * logoWidth).expandX().padRight(headerPadding);
+        headerTable.add(leaderboardLabel).expandX().padRight(headerPadding);
+
+        boardTable = new Table();
+        boardTable.background(boardBackground);
+        boardTable.align(Align.top);
+        boardTable.row().expandX().padTop(4);
+        boardTable.add(userLabel);
+        boardTable.add(pointsLabel);
+        ScrollPane boardScrollPane = new ScrollPane(boardTable);
+
+        Table rootTable = new Table();
+        rootTable.setFillParent(true);
+        rootTable.add(headerTable).fillX().height(2 * stage.getHeight() / 7f).top();
+        rootTable.row().expand();
+        rootTable.add(boardScrollPane).width(2 * stage.getWidth() / 3f).fillY().padTop(16);
+
+        Group group = new Group();
+        group.setSize(stage.getWidth(), stage.getHeight());
+        background.setSize(stage.getWidth(), background.getHeight() / background.getWidth() * stage.getWidth());
+        background.setPosition(0, stage.getHeight() / 2f - background.getHeight() / 2f);
+        group.addActor(background);
+        group.addActor(rootTable);
+
+        stage.addActor(group);
+
+        leaderboardController = new LeaderboardController(tankWarsGame, backButton, this);
+    }
 
-        if (leaderboardUsers == null) {
-            font.draw(batch, "No connection", 50, height);
-        }
-        else if (leaderboardUsers.size > 0) {
-            for (User user : leaderboardUsers) {
-                font.draw(batch, user.username, (Gdx.graphics.getWidth() >> 1) - 300, height);
-                font.draw(batch, user.wins + "", (Gdx.graphics.getWidth() >> 1), height);
-                height = height - 75;
+    /**
+     * Adds users to leaderboard with username and number of wins.
+     * Displays "No connection" or "No users" in case there is no connection
+     * to the server or the array is empty.
+     *
+     * @param users Array of users to be included in the leaderboard
+     */
+    public void setLeaderBoard(Array<User> users) {
+        if (users == null) {
+            boardTable.row().expand().colspan(2);
+            Label noConnection = new Label("No connection", skin.get("default", Label.LabelStyle.class));
+            boardTable.add(noConnection);
+        } else if (users.size == 0) {
+            boardTable.row().expand().colspan(2);
+            Label noUsers = new Label("No users", skin.get("default", Label.LabelStyle.class));
+            boardTable.add(noUsers);
+        } else {
+            for (User user : users) {
+                boardTable.row().expandX();
+                Label username = new Label(user.username,  skin.get("default", Label.LabelStyle.class));
+                boardTable.add(username);
+                Label points = new Label(String.valueOf(user.wins),  skin.get("default", Label.LabelStyle.class));
+                boardTable.add(points);
             }
         }
-        else {
-            font.draw(batch, "No users", 50, height);
-        }
-        batch.end();
     }
 
     @Override
-    public void dispose() {
+    public void render(float delta) {
+        ScreenUtils.clear(0, 0, 0, 1);
 
+        stage.act(delta);
+        stage.draw();
     }
 
     @Override
-    public void show() {
-
+    public void dispose() {
+        stage.dispose();
     }
+
     @Override
     public void resize(int width, int height) {
-
+        stage.getViewport().update(width, height);
     }
 
     @Override
@@ -90,7 +149,7 @@ public class LeaderboardScreen implements Screen {
 
     @Override
     public void hide() {
-
+        dispose();
     }
 
 }