From 98ab901a5111c3e895a8f6c97d36d0503864fdad Mon Sep 17 00:00:00 2001
From: top19 <top19@aber.ac.uk>
Date: Wed, 29 Apr 2020 17:41:57 +0100
Subject: [PATCH] Integrated flashcard with menu

---
 .../group20/javafx/FlashcardController.java   |  18 +-
 .../uk/ac/aber/cs22120/group20/flashcard.fxml | 201 +++++++++++++++---
 2 files changed, 179 insertions(+), 40 deletions(-)

diff --git a/src/Welsh Vocabulary Tutor/src/main/java/uk/ac/aber/cs22120/group20/javafx/FlashcardController.java b/src/Welsh Vocabulary Tutor/src/main/java/uk/ac/aber/cs22120/group20/javafx/FlashcardController.java
index 90ed52d..f5dc1dc 100644
--- a/src/Welsh Vocabulary Tutor/src/main/java/uk/ac/aber/cs22120/group20/javafx/FlashcardController.java	
+++ b/src/Welsh Vocabulary Tutor/src/main/java/uk/ac/aber/cs22120/group20/javafx/FlashcardController.java	
@@ -5,6 +5,7 @@ import javafx.fxml.FXML;
 import javafx.scene.Node;
 import javafx.scene.image.Image;
 import javafx.scene.image.ImageView;
+import javafx.scene.paint.Color;
 import javafx.scene.shape.Rectangle;
 import javafx.scene.text.Text;
 import javafx.scene.transform.Rotate;
@@ -30,7 +31,7 @@ import java.io.IOException;
  * @see SharedCodeController
  */
 
-public class FlashcardController {
+public class FlashcardController extends SharedCodeController {
 
    // /////////////////// //
    // Instance Variables. //
@@ -49,9 +50,9 @@ public class FlashcardController {
    private Text testWord;
 
    @FXML
-   private ImageView left_arrow;
+   private ImageView leftArrow;
    @FXML
-   private ImageView right_arrow;
+   private ImageView rightArrow;
 
    // //////// //
    // Methods. //
@@ -63,14 +64,21 @@ public class FlashcardController {
     */
    @FXML
    private void initialize() {
+      // Call method from SharedCodeController to setup the menu screen.
+      setup();
+      currentPageIcon.setImage(new Image("file:src/main/resources/assets/icons/white_icons/50px/flashcard-50.png"));
+      currentPageText.setText("Flashcard");
+      flashcardIcon.setImage(new Image("file:src/main/resources/assets/icons/black_icons/50px/flashcard-50.png"));
+      flashcardsText.setFill(Color.BLACK);
+
       testWord.setText(Application.practiseList.getFirst().getWelsh());
       wordType.setText("Welsh");
 
       updateCounter();
       card = flashcard;
 
-      left_arrow.setImage(new Image(getClass().getResourceAsStream("/assets/icons/black_icons/50px/left-50.png")));
-      right_arrow.setImage(new Image(getClass().getResourceAsStream("/assets/icons/black_icons/50px/right-50.png")));
+      leftArrow.setImage(new Image(getClass().getResourceAsStream("/assets/icons/black_icons/50px/left-50.png")));
+      rightArrow.setImage(new Image(getClass().getResourceAsStream("/assets/icons/black_icons/50px/right-50.png")));
    }
 
    /**
diff --git a/src/Welsh Vocabulary Tutor/src/main/resources/uk/ac/aber/cs22120/group20/flashcard.fxml b/src/Welsh Vocabulary Tutor/src/main/resources/uk/ac/aber/cs22120/group20/flashcard.fxml
index 69fa448..f70bb77 100644
--- a/src/Welsh Vocabulary Tutor/src/main/resources/uk/ac/aber/cs22120/group20/flashcard.fxml	
+++ b/src/Welsh Vocabulary Tutor/src/main/resources/uk/ac/aber/cs22120/group20/flashcard.fxml	
@@ -1,45 +1,176 @@
-<?xml version="1.0" encoding="UTF-8"?>
 
-<?import javafx.geometry.Insets?>
-<?import javafx.scene.control.Button?>
-<?import javafx.scene.image.ImageView?>
-<?import javafx.scene.layout.HBox?>
-<?import javafx.scene.layout.StackPane?>
-<?import javafx.scene.layout.VBox?>
+<?import javafx.geometry.*?>
+<?import javafx.scene.layout.*?>
+<?import javafx.scene.text.*?>
+
 <?import javafx.scene.shape.Rectangle?>
-<?import javafx.scene.text.Font?>
-<?import javafx.scene.text.Text?>
+<?import javafx.scene.image.ImageView?>
 
-<VBox alignment="center" spacing="10" stylesheets="@styles.css" xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1" fx:controller="uk.ac.aber.cs22120.group20.javafx.FlashcardController">
-    <padding>
-        <Insets bottom="10" left="25" right="25" top="25" />
-    </padding>
-    <children>
-        <StackPane onMouseClicked="#handleFlashcardClick">
-            <children>
-                <Rectangle fx:id="flashcard" arcHeight="80" arcWidth="80" fill="white" height="360" stroke="black" width="550" />
-                <Text fx:id="testWord" textAlignment="CENTER">
+<?import javafx.scene.control.Button?>
+<BorderPane xmlns="http://javafx.com/javafx"
+            xmlns:fx="http://javafx.com/fxml"
+            fx:controller="uk.ac.aber.cs22120.group20.javafx.FlashcardController"
+            fx:id="container"
+            minWidth="450"
+            minHeight="550"
+
+>
+
+
+    <left>
+
+        <StackPane fx:id="outerBar">
+            <Rectangle fx:id="sideBar" fill="dimgray" height="${outerBar.height}" width="50"></Rectangle>
+
+            <VBox spacing="300">
+
+                <VBox alignment="TOP_CENTER" maxHeight="${outerBar.height}">
+                    <StackPane onMouseClicked="#dictionaryIconClick">
+                        <Rectangle fill="dimgray" height="60" width="${sideBar.width}"></Rectangle>
+                        <HBox alignment="CENTER_RIGHT">
+                            <Text fx:id="dictionaryText" fill="white">
+                                <font>
+                                    <Font name="System Bold" size="25"></Font>
+                                </font>
+                            </Text>
+                            <ImageView fx:id="dictionaryIcon"></ImageView>
+                        </HBox>
+                    </StackPane>
+
+                    <StackPane onMouseClicked="#practiceListIconClick">
+                        <Rectangle fill="dimgray" height="60" width="${sideBar.width}"></Rectangle>
+                        <HBox alignment="CENTER_RIGHT">
+                            <Text fx:id="practiceListTest" fill="white">
+                                <font>
+                                    <Font name="System Bold" size="25"></Font>
+                                </font>
+                            </Text>
+                            <ImageView fx:id="practiceListIcon"></ImageView>
+                        </HBox>
+                    </StackPane>
+
+                    <StackPane onMouseClicked="#flashcardIconClick">
+                        <Rectangle fill="white" height="60" width="${sideBar.width}"></Rectangle>
+                        <HBox alignment="CENTER_RIGHT">
+                            <Text fx:id="flashcardsText" fill="white">
+                                <font>
+                                    <Font name="System Bold" size="25"></Font>
+                                </font>
+                            </Text>
+                            <ImageView fx:id="flashcardIcon"></ImageView>
+                        </HBox>
+                    </StackPane>
+
+                    <StackPane onMouseClicked="#studyIconClick">
+                        <Rectangle fill="dimgray" height="60" width="${sideBar.width}"></Rectangle>
+                        <HBox alignment="CENTER_RIGHT">
+                            <Text fx:id="studyText" fill="white">
+                                <font>
+                                    <Font name="System Bold" size="25"></Font>
+                                </font>
+                            </Text>
+                            <ImageView fx:id="studyIcon"></ImageView>
+                        </HBox>
+                    </StackPane>
+
+
+                </VBox>
+
+
+                <StackPane alignment="BOTTOM_CENTER" onMouseClicked="#addWordIconClick">
+                    <Rectangle fill="dimgray" height="60" width="${sideBar.width}"></Rectangle>
+
+                    <HBox alignment="CENTER_RIGHT">
+                        <Text fx:id="addDefinitionText" fill="white">
+                            <font>
+                                <Font name="System Bold" size="25"></Font>
+                            </font>
+                        </Text>
+                        <ImageView fx:id="addDefinitionIcon"></ImageView>
+                    </HBox>
+
+                </StackPane>
+            </VBox>
+        </StackPane>
+
+
+    </left>
+
+    <top>
+        <StackPane fx:id="topBar">
+            <Rectangle fx:id="parentRectangle" fill="dimgray" width="${topBar.width}" height="50"></Rectangle>
+            <HBox alignment="CENTER_LEFT"  prefWidth="${topBar.width}" spacing="7">
+                <StackPane onMouseClicked="#expandMenuClick">
+                    <Rectangle fill="dimgray" width="55" height="50"></Rectangle>
+                    <ImageView fx:id="expandMenuIcon"></ImageView>
+                </StackPane>
+
+                <ImageView fx:id="currentPageIcon"></ImageView>
+
+                <Text fx:id="currentPageText" fill="white">
                     <font>
-                        <Font size="55" />
+                        <Font name="System Bold" size="25"></Font>
                     </font>
                 </Text>
+            </HBox>
 
-                <VBox alignment="BOTTOM_CENTER">
-                    <Text fx:id="wordType" fill="dimgray">
-                        <font>
-                            <Font size="20" />
-                        </font>
-                    </Text>
-                </VBox>
-            </children>
         </StackPane>
-        <HBox alignment="BASELINE_CENTER" spacing="190">
+    </top>
+
+    <center>
+
+        <VBox alignment="CENTER" spacing="10"   minHeight="500" prefHeight="512" prefWidth="432" >
+            <padding>
+                <Insets top="25" right="25" bottom="10" left="25"/>
+            </padding>
             <children>
-                <ImageView fx:id="left_arrow" onMouseClicked="#handlePreviousCard" visible="true" />
-                <Text fx:id="counter"><font> <Font size="20" /></font></Text>
-                <ImageView fx:id="right_arrow" onMouseClicked="#handleNextCard" />
+                <StackPane  alignment="CENTER" onMouseClicked="#handleFlashcardClick" VBox.vgrow="NEVER" minWidth="350">
+                    <children>
+                        <Rectangle fx:id="flashcard" width="550" height="360" fill="white" arcHeight="80" arcWidth="80"
+                                   stroke="black"/>
+                        <Text textAlignment="CENTER" fx:id="testWord">
+                            <font>
+                                <Font size="55"/>
+                            </font>
+                        </Text>
+
+                        <VBox alignment="BOTTOM_CENTER">
+                            <Text fx:id="wordType" fill="dimgray">
+                                <font>
+                                    <Font size="20"></Font>
+                                </font>
+                            </Text>
+                        </VBox>
+                    </children>
+                </StackPane>
+                <HBox spacing="190" alignment="BASELINE_CENTER">
+                    <children>
+                        <ImageView fx:id="leftArrow" onMouseClicked="#handlePreviousCard"></ImageView>
+                        <Text fx:id="counter"><font> <Font size = "20"></Font></font></Text>
+                        <ImageView fx:id="rightArrow" onMouseClicked="#handleNextCard"></ImageView>
+                    </children>
+                </HBox>
             </children>
-        </HBox>
-      <Button mnemonicParsing="false" onAction="#switchToAddWord" text="Add Word Screen" />
-    </children>
-</VBox>
+            <Button mnemonicParsing="false" onAction="#switchToAddWord" text="Add Word Screen" />
+
+        </VBox>
+
+    </center>
+</BorderPane>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+