feat: created organization page

src/main/java/edu/group5/app/control/BrowseCardController.java

@@ -6,4 +6,9 @@ public class BrowseCardController {
   public BrowseCardController(MainController mainController) {
     this.controller = mainController;
   }
+
+  public void handleCardClick() {
+    System.out.println("Browse Card Clicked");
+    controller.showOrganizationPage();
+  }
 }

src/main/java/edu/group5/app/control/MainController.java

@@ -8,13 +8,15 @@ public class MainController {
   private final HomePageController homePageController;
   private final BrowsePageController browsePageController;
   private final BrowseCardController browseCardController;
+  private final OrganizationPageController organizationPageController;
 
   public MainController() {
     this.view = new MainView();
     this.headerController = new HeaderController(this);
     this.homePageController = new HomePageController(this);
     this.browsePageController = new BrowsePageController(this);
     this.browseCardController = new BrowseCardController(this);
+    this.organizationPageController = new OrganizationPageController(this);
   }
 
   public MainView getMainView() {
@@ -33,5 +35,13 @@ public void showBrowsePage() {
     view.showBrowsePage(browsePageController, browseCardController, headerController);
   }
 
+  public void showOrganizationPage() {
+    view.showOrganizationPage(organizationPageController, headerController);
+  }
+
+  public void showDonationPage() {
+//    view.showDonationPage();
+  }
+
   public void showAboutUsPage() {}
 }

src/main/java/edu/group5/app/control/OrganizationPageController.java

@@ -0,0 +1,13 @@
+package edu.group5.app.control;
+
+public class OrganizationPageController {
+  private final MainController controller;
+
+  public OrganizationPageController(MainController controller) {
+    this.controller = controller;
+  }
+
+  public void handleDonateClick() {
+    controller.showDonationPage();
+  }
+}

src/main/java/edu/group5/app/view/MainView.java

@@ -1,11 +1,9 @@
 package edu.group5.app.view;
 
-import edu.group5.app.control.BrowseCardController;
-import edu.group5.app.control.BrowsePageController;
-import edu.group5.app.control.HeaderController;
-import edu.group5.app.control.HomePageController;
+import edu.group5.app.control.*;
 import edu.group5.app.view.browsepage.BrowsePageView;
 import edu.group5.app.view.homepage.HomePageView;
+import edu.group5.app.view.organizationpage.OrganizationPageView;
 import javafx.scene.Scene;
 import javafx.scene.layout.BorderPane;
 
@@ -34,5 +32,9 @@ public void showBrowsePage(BrowsePageController browsePageController, BrowseCard
     root.setCenter(new BrowsePageView(getScene(), browsePageController, browseCardController, headerController));
   }
 
+  public void showOrganizationPage(OrganizationPageController organizationController, HeaderController headerController) {
+    root.setCenter(new OrganizationPageView(organizationController, headerController));
+  }
+
   public void showAboutUsPage() {}
 }

src/main/java/edu/group5/app/view/browsepage/BrowseCard.java

@@ -22,6 +22,10 @@ public BrowseCard(BrowseCardController browseCardController, String img, String
         checkMarkContainer()
     );
 
+    setOnMouseClicked(e -> {
+      controller.handleCardClick();
+    });
+
     setSpacing(20);
     setFillWidth(true);
     setAlignment(Pos.CENTER);

src/main/java/edu/group5/app/view/browsepage/BrowsePageView.java

@@ -4,6 +4,7 @@
 import edu.group5.app.control.BrowsePageController;
 import edu.group5.app.control.HeaderController;
 import edu.group5.app.view.Header;
+import javafx.geometry.Pos;
 import javafx.scene.Scene;
 import javafx.scene.control.ScrollPane;
 import javafx.scene.control.TextField;
@@ -48,17 +49,18 @@ private HBox createSearchSection() {
 
   private GridPane createOrganizationSection() {
     GridPane grid = new GridPane();
+    grid.setId("card-grid");
     grid.setHgap(10);
     grid.setVgap(10);
+    grid.setMaxWidth(Double.MAX_VALUE - 50);
 
     int column = 0;
     int row = 0;
     for (int i = 0; i < 16; i++) {
       BrowseCard card = new BrowseCard(orgController, "/browsepage/images/children_of_shambala.png", "Shambala Foundation");
 
-      card.setMaxWidth(Double.MAX_VALUE);
-      GridPane.setHgrow(card, Priority.ALWAYS);
       GridPane.setFillWidth(card, true);
+      grid.setAlignment(Pos.CENTER);
       grid.add(card, column, row);
 
       column++;

src/main/java/edu/group5/app/view/organizationpage/OrganizationPageView.java

@@ -0,0 +1,94 @@
+package edu.group5.app.view.organizationpage;
+
+import edu.group5.app.control.HeaderController;
+import edu.group5.app.control.OrganizationPageController;
+import edu.group5.app.view.Header;
+import javafx.geometry.Pos;
+import javafx.scene.control.Button;
+import javafx.scene.control.Label;
+import javafx.scene.control.ScrollPane;
+import javafx.scene.image.Image;
+import javafx.scene.image.ImageView;
+import javafx.scene.layout.BorderPane;
+import javafx.scene.layout.HBox;
+import javafx.scene.layout.StackPane;
+import javafx.scene.layout.VBox;
+import javafx.scene.text.Text;
+
+public class OrganizationPageView extends BorderPane {
+  private final OrganizationPageController controller;
+
+  public OrganizationPageView(OrganizationPageController controller, HeaderController headerController) {
+    this.controller = controller;
+    getStylesheets().add(getClass().getResource("/organizationpage/organizationpage.css").toExternalForm());
+    Header headerView = new Header(headerController);
+    setTop(headerView);
+    setCenter(createBody());
+  }
+
+  private ScrollPane createBody() {
+    ScrollPane body = new ScrollPane();
+    body.setFitToWidth(true);
+    body.setFitToHeight(true)
+    ;
+    VBox vBox = new VBox();
+    vBox.setId("main-container");
+
+    vBox.getChildren().addAll(
+        createOrgSection()
+    );
+    body.setContent(vBox);
+    return body;
+  }
+
+  private HBox createOrgSection() {
+    HBox orgSection = new HBox();
+    orgSection.setId("org-section");
+    orgSection.setAlignment(Pos.CENTER);
+    orgSection.setSpacing(40);
+
+    orgSection.getChildren().addAll(createImageContainer(), createOrgInfoSection());
+    return orgSection;
+  }
+
+  private StackPane createImageContainer() {
+    StackPane imageContainer = new StackPane();
+    imageContainer.setId("imageContainer");
+    imageContainer.setPrefHeight(120);
+    imageContainer.setPrefWidth(120);
+    imageContainer.setMaxWidth(Double.MAX_VALUE);
+
+    ImageView logo = new ImageView(
+        new Image(getClass().getResource("/browsepage/images/children_of_shambala.png").toExternalForm())
+    );
+
+    logo.setId("logo");
+    logo.setSmooth(true);
+    logo.setPreserveRatio(true);
+
+    imageContainer.getChildren().add(logo);
+    return imageContainer;
+  }
+
+  private VBox createOrgInfoSection() {
+    VBox orgInfoSection = new VBox();
+    orgInfoSection.setSpacing(50);
+
+    VBox orgNameAndDescription = new VBox();
+
+    Label orgName = new Label("Shambala Foundation");
+    orgName.setId("orgName");
+
+    Text description = new Text("Descriptive text");
+    description.setId("description");
+
+    orgNameAndDescription.getChildren().addAll(orgName, description);
+
+    Button donateBtn = new Button("Donate");
+    donateBtn.setId("donate-button");
+    donateBtn.setOnAction(e -> controller.handleDonateClick());
+
+    orgInfoSection.getChildren().addAll(orgNameAndDescription, donateBtn);
+    return orgInfoSection;
+  }
+}

src/main/resources/browsepage/browse_org.css

@@ -8,8 +8,13 @@
     -fx-background-radius: 1em;
 }
 
+#mainContainer:hover {
+    -fx-cursor: hand;
+}
+
 #imageContainer {}
 
+
 #logo {}
 
 #orgName {

src/main/resources/browsepage/browsepage.css

@@ -1,3 +1,6 @@
 #body {
     -fx-padding: 20px;
+}
+
+#card-grid {
 }

src/main/resources/organizationpage/organizationpage.css

@@ -0,0 +1,31 @@
+#main-container {
+    -fx-padding: 50px
+}
+
+#logo {
+    -fx-min-height: 50%;
+}
+
+#orgName {
+    -fx-font-weight: bold;
+    -fx-font-size: 20pt;
+}
+
+#description {
+    -fx-font-size: 10pt;
+}
+
+#donate-button {
+    -fx-pref-height: 55px;
+    -fx-background-color: #e03030;
+    -fx-text-fill: white;
+    -fx-font-size: 22px;
+    -fx-font-weight: bold;
+    -fx-background-radius: 8;
+    -fx-cursor: hand;
+    -fx-padding: 0 40 0 40;
+}
+
+#donate-button:hover {
+    -fx-background-color: #c02020;
+}