Merge pull request #136 from jonathantjendana/branch-ui

Redesigned UI

src/main/java/seedu/moneygowhere/ui/GraphPanel.java

@@ -0,0 +1,59 @@
+package seedu.moneygowhere.ui;
+
+import java.util.LinkedHashMap;
+import java.util.Map;
+
+import javafx.fxml.FXML;
+import javafx.scene.chart.CategoryAxis;
+import javafx.scene.chart.LineChart;
+import javafx.scene.chart.NumberAxis;
+import javafx.scene.chart.XYChart;
+import javafx.scene.control.Tooltip;
+import javafx.scene.layout.Region;
+import javafx.scene.layout.StackPane;
+
+/**
+ * Tab containing the spending graph.
+ */
+public class GraphPanel extends UiPart<Region> {
+    private static final String FXML = "PlaceholderPanel.fxml";
+
+    @FXML
+    private StackPane panePlaceholder;
+
+    public GraphPanel(LinkedHashMap<String, Double> graphData) {
+        super(FXML);
+        CategoryAxis xAxis = new CategoryAxis();
+        xAxis.setLabel("Date");
+        NumberAxis yAxis = new NumberAxis();
+        yAxis.setLabel("Amount spent ($)");
+        LineChart<String, Number> spendingChart = new LineChart<>(xAxis, yAxis);
+
+        spendingChart.setTitle("Graph");
+
+        XYChart.Series<String, Number> series = new XYChart.Series<>();
+        series.setName("Spending");
+        for (Map.Entry<String, Double> i : graphData.entrySet()) {
+            XYChart.Data<String, Number> dataToAdd = new XYChart.Data<>(i.getKey().toString(),
+                    Math.round(i.getValue()));
+            series.getData().add(dataToAdd);
+        }
+        spendingChart.getData().add(series);
+
+        for (XYChart.Series<String, Number> s : spendingChart.getData()) {
+            for (XYChart.Data<String, Number> d : s.getData()) {
+                Tooltip.install(d.getNode(), new Tooltip(
+                        "Date: \t" + d.getXValue() + "\n"
+                                + "Spending: \t$" + d.getYValue() + ".00"));
+
+                //Adding class on hover
+                d.getNode().setOnMouseEntered(event -> d.getNode().getStyleClass().add("onHover"));
+
+                //Removing class on exit
+                d.getNode().setOnMouseExited(event -> d.getNode().getStyleClass().remove("onHover"));
+            }
+        }
+        panePlaceholder.getChildren().add(spendingChart);
+    }
+
+}

src/main/java/seedu/moneygowhere/ui/MainWindow.java

@@ -10,7 +10,6 @@
 import javafx.scene.control.TextInputControl;
 import javafx.scene.input.KeyCombination;
 import javafx.scene.input.KeyEvent;
-import javafx.scene.layout.AnchorPane;
 import javafx.scene.layout.StackPane;
 import javafx.stage.Stage;
 import seedu.moneygowhere.commons.core.GuiSettings;
@@ -38,6 +37,9 @@ public class MainWindow extends UiPart<Stage> {
     private SpendingListPanel spendingListPanel;
     private ResultDisplay resultDisplay;
 
+    private GraphPanel graphPanel;
+    private StatsPanel statsPanel;
+
     @FXML
     private StackPane commandBoxPlaceholder;
 
@@ -54,21 +56,12 @@ public class MainWindow extends UiPart<Stage> {
     private StackPane statusbarPlaceholder;
 
     @FXML
-    private AnchorPane graphPane;
 
-    @FXML
-    private AnchorPane statsPane;
+    private TabPane tabPanePlaceholder;
 
-    @FXML
-    private TabPane tabPane;
-
-    @FXML
     private Tab graphTab;
-
-    @FXML
     private Tab statsTab;
 
-
     public MainWindow(Stage primaryStage, Logic logic) {
         super(FXML, primaryStage);
 
@@ -137,12 +130,15 @@ void fillInnerParts() {
         CommandBox commandBox = new CommandBox(this::executeCommand, this::getPrevCommand, this::getNextCommand);
         commandBoxPlaceholder.getChildren().add(commandBox.getRoot());
 
-        GraphChart graphChart = new GraphChart(logic.getGraphData());
-        graphPane.getChildren().add(graphChart.getRoot());
+        graphTab = new Tab("Graph");
+        graphPanel = new GraphPanel(logic.getGraphData());
+        graphTab.setContent(graphPanel.getRoot());
 
-        StatsChart statsChart = new StatsChart(logic.getStatsData());
-        statsPane.getChildren().add(statsChart.getRoot());
+        statsTab = new Tab("Statistics");
+        statsPanel = new StatsPanel(logic.getStatsData());
+        statsTab.setContent(statsPanel.getRoot());
 
+        tabPanePlaceholder.getTabs().addAll(graphTab, statsTab);
 
     }
 
@@ -201,17 +197,16 @@ private CommandResult executeCommand(String commandText) throws CommandException
             if (commandResult.isExit()) {
                 handleExit();
             }
-
             if (commandResult.isShowGraph()) {
-                GraphChart graphChart = new GraphChart(logic.getGraphData());
-                graphPane.getChildren().add(graphChart.getRoot());
-                tabPane.getSelectionModel().select(graphTab);
+                graphPanel = new GraphPanel(logic.getGraphData());
+                graphTab.setContent(graphPanel.getRoot());
+                tabPanePlaceholder.getSelectionModel().select(graphTab);
             }
 
             if (commandResult.isShowStats()) {
-                StatsChart statsChart = new StatsChart(logic.getStatsData());
-                statsPane.getChildren().add(statsChart.getRoot());
-                tabPane.getSelectionModel().select(statsTab);
+                statsPanel = new StatsPanel(logic.getStatsData());
+                statsTab.setContent(statsPanel.getRoot());
+                tabPanePlaceholder.getSelectionModel().select(graphTab);
             }
 
             return commandResult;
@@ -238,5 +233,4 @@ private String getPrevCommand() {
     private String getNextCommand() {
         return logic.getNextCommand();
     }
-
 }

src/main/java/seedu/moneygowhere/ui/ResultDisplay.java

@@ -18,6 +18,7 @@ public class ResultDisplay extends UiPart<Region> {
 
     public ResultDisplay() {
         super(FXML);
+        resultDisplay.setText("Welcome to MoneyGoWhere!");
     }
 
     public void setFeedbackToUser(String feedbackToUser) {

src/main/java/seedu/moneygowhere/ui/StatsPanel.java

@@ -0,0 +1,42 @@
+package seedu.moneygowhere.ui;
+
+import java.util.LinkedHashMap;
+import java.util.Map;
+
+import javafx.collections.FXCollections;
+import javafx.collections.ObservableList;
+import javafx.fxml.FXML;
+import javafx.scene.chart.PieChart;
+import javafx.scene.layout.Region;
+import javafx.scene.layout.StackPane;
+
+/**
+ * Tab containing the spending graph.
+ */
+public class StatsPanel extends UiPart<Region> {
+    private static final String FXML = "PlaceholderPanel.fxml";
+
+    @FXML
+    private StackPane panePlaceholder;
+
+    public StatsPanel(LinkedHashMap<String, Double> statsData) {
+        super(FXML);
+
+        ObservableList<PieChart.Data> pieChartData = FXCollections.observableArrayList();
+
+        for (Map.Entry<String, Double> i : statsData.entrySet()) {
+            pieChartData.add(new PieChart.Data(i.getKey() + String.format(" ($%.2f)", i.getValue()),
+                    Math.round(i.getValue())));
+        }
+        PieChart pieChart = new PieChart(pieChartData);
+        if (pieChartData.size() == 0) {
+            pieChart.setTitle("No data to show");
+        } else {
+            pieChart.setTitle("Statistics");
+        }
+        pieChart.setLegendVisible(false);
+
+        panePlaceholder.getChildren().add(pieChart);
+    }
+
+}