Dynamically style dialog boxes

src/main/java/bhaymax/controller/DialogBox.java

@@ -18,7 +18,6 @@
  * Controller for DialogBox
  */
 public class DialogBox extends HBox {
-    public static final String REPLY_LABEL_CLASS_NAME = "reply-label";
     @FXML
     private Label dialog;
     @FXML
@@ -36,27 +35,31 @@ private DialogBox(String text, Image img) {
         }
 
         this.dialog.setText(text);
+        this.dialog.getStyleClass().add(DialogBoxStyleClass.USER.getCssClassName());
         this.displayPicture.setImage(img);
     }
 
     /**
      * Flips the dialog box such that the ImageView is on the left and text is on the right
      */
-    private void flip() {
+    private void flip(DialogBoxStyleClass dialogBoxStyleClass) {
         ObservableList<Node> nodes = FXCollections.observableArrayList(this.getChildren());
         FXCollections.reverse(nodes);
         this.getChildren().setAll(nodes);
+        // this.dialog.getStyleClass().clear();
+        this.dialog.getStyleClass().add(dialogBoxStyleClass.getCssClassName());
         this.setAlignment(Pos.TOP_LEFT);
-        dialog.getStyleClass().add(DialogBox.REPLY_LABEL_CLASS_NAME);
     }
 
-    public static DialogBox getUserDialog(String text, Image img) {
+    public static DialogBox getUserDialogBox(String text, Image img) {
         return new DialogBox(text, img);
     }
 
-    public static DialogBox getChatbotDialog(String text, Image img) {
+    public static DialogBox getChatbotDialogBox(String text, Image img, DialogBoxStyleClass dialogBoxStyleClass) {
         DialogBox db = new DialogBox(text, img);
-        db.flip();
+        // db.getStyleClass().clear();
+        // db.getStyleClass().add(dialogBoxStyleClass.getCssClassName());
+        db.flip(dialogBoxStyleClass);
         return db;
     }
 }

src/main/java/bhaymax/controller/DialogBoxStyleClass.java

@@ -0,0 +1,23 @@
+package bhaymax.controller;
+
+import java.util.HashMap;
+
+/**
+ * Provides enumeration values for class names available to style a dialog box
+ */
+public enum DialogBoxStyleClass {
+    USER("label-user"),
+    CHATBOT_NORMAL("label-chatbot-normal"),
+    CHATBOT_SAD("label-chatbot-sad"),
+    CHATBOT_ANNOYED("label-chatbot-annoyed");
+
+    private final String cssClassName;
+
+    DialogBoxStyleClass(String cssClassName) {
+        this.cssClassName = cssClassName;
+    }
+
+    public String getCssClassName() {
+        return this.cssClassName;
+    }
+}

src/main/java/bhaymax/controller/MainWindow.java

@@ -177,27 +177,27 @@ public void disableInputs() {
     }
 
     private DialogBox getUserDialog(String input) {
-        return DialogBox.getUserDialog(input, this.userImage);
+        return DialogBox.getUserDialogBox(input, this.userImage);
     }
 
     private DialogBox getNormalChatbotDialog(String input) {
-        return DialogBox.getChatbotDialog(input, this.chatbotNormalImage);
+        return DialogBox.getChatbotDialogBox(input, this.chatbotNormalImage, DialogBoxStyleClass.CHATBOT_NORMAL);
     }
 
     private DialogBox getAnnoyedChatbotDialog(String input) {
-        return DialogBox.getChatbotDialog(input, this.chatbotAnnoyedImage);
+        return DialogBox.getChatbotDialogBox(input, this.chatbotAnnoyedImage, DialogBoxStyleClass.CHATBOT_ANNOYED);
     }
 
     private DialogBox getExcitedChatbotDialog(String input) {
-        return DialogBox.getChatbotDialog(input, this.chatbotExcitedImage);
+        return DialogBox.getChatbotDialogBox(input, this.chatbotExcitedImage, DialogBoxStyleClass.CHATBOT_NORMAL);
     }
 
     private DialogBox getHappyChatbotDialog(String input) {
-        return DialogBox.getChatbotDialog(input, this.chatbotHappyImage);
+        return DialogBox.getChatbotDialogBox(input, this.chatbotHappyImage, DialogBoxStyleClass.CHATBOT_NORMAL);
     }
 
     private DialogBox getSadChatbotDialog(String input) {
-        return DialogBox.getChatbotDialog(input, this.chatbotSadImage);
+        return DialogBox.getChatbotDialogBox(input, this.chatbotSadImage, DialogBoxStyleClass.CHATBOT_SAD);
     }
 
     /**

src/main/resources/css/dialog-box.css

@@ -1,18 +1,43 @@
 .label {
+    -fx-font: 20px "Arial";
+    -fx-border-width: 2px;
+    -fx-padding: 10px;
     -fx-background-color: white;
     -fx-border-color: #e4182e;
-    -fx-font: 16px "Arial";
-    -fx-border-width: 2px;
     -fx-background-radius: 1em 1em 0 1em;
     -fx-border-radius: 1em 1em 0 1em;
-    -fx-padding: 6px;
     -fx-border-insets: 0px 7px 0px 7px;
     -fx-background-insets: 0px 7px 0px 7px;
 }
 
-.reply-label {
+.label-user {
+    -fx-background-color: #3c4157;
+    -fx-text-fill: white;
+    -fx-border-color: #e4182e;
+}
+
+.label-chatbot-normal {
     -fx-background-radius: 1em 1em 1em 0;
     -fx-border-radius: 1em 1em 1em 0;
+    -fx-background-color: white;
+    -fx-text-fill: black;
+    -fx-border-color: #e4182e;
+}
+
+.label-chatbot-annoyed {
+    -fx-background-radius: 1em 1em 1em 0;
+    -fx-border-radius: 1em 1em 1em 0;
+    -fx-background-color: #ffd700;
+    -fx-text-fill: black;
+    -fx-border-color: #e4182e;
+}
+
+.label-chatbot-sad {
+    -fx-background-radius: 1em 1em 1em 0;
+    -fx-border-radius: 1em 1em 1em 0;
+    -fx-background-color: #e4182e;
+    -fx-text-fill: white;
+    -fx-border-color: #e4182e;
 }
 
 #displayPicture {

src/main/resources/css/main.css

@@ -13,7 +13,7 @@
 .button {
     -fx-background-color: rgb(192, 32, 49);
     -fx-text-fill: white;
-    -fx-font: italic bold 16px "Arial";
+    -fx-font: italic bold 20px "Arial";
 }
 
 .button:hover {
@@ -33,8 +33,6 @@
     -fx-background-color: transparent;
 }
 
-
-
 .scroll-bar {
     -fx-font-size: 10px;  /* Change width of scroll bar. */
     -fx-background-color: main-color;