setup of pages, still need to do the positions of home page and conne…

…ct up the algorithms, next commit should hopefully be algorithms, also need to add a border/box around the connection status

App/pages/facial_expression_page.py

@@ -0,0 +1,28 @@
+from PyQt5.QtWidgets import QWidget, QVBoxLayout, QLabel, QHBoxLayout, QFrame
+from PyQt5.QtGui import QPixmap
+
+class FacialExpressionRecognitionPage(QWidget):
+    def __init__(self):
+        super().__init__()
+        self.setWindowTitle("Facial Expression Recognition")
+        self.setGeometry(100, 100, 800, 600)
+
+        main_layout = QHBoxLayout()
+
+        self.stream_frame = QFrame()
+        self.stream_frame.setStyleSheet("background-color: black;")
+        self.stream_frame.setFixedSize(400, 600)
+
+        emoji_layout = QVBoxLayout()
+        self.emoji_label = QLabel("Expression:")
+        self.face_emoji = QLabel()
+        emoji_layout.addWidget(self.emoji_label)
+        emoji_layout.addWidget(self.face_emoji)
+
+        main_layout.addWidget(self.stream_frame)
+        main_layout.addLayout(emoji_layout)
+
+        self.setLayout(main_layout)
+
+    def update_emojis(self, emoji_path):
+        self.face_emoji.setPixmap(QPixmap(emoji_path))

App/pages/general_page.py

@@ -0,0 +1,42 @@
+from PyQt5.QtWidgets import QWidget, QVBoxLayout, QLabel, QHBoxLayout, QFrame
+from PyQt5.QtCore import Qt
+
+
+class GeneralDemoPage(QWidget):
+    def __init__(self, title: str, description: str):
+        super().__init__()
+        self.setWindowTitle(title)
+
+        # Main layout (horizontal layout for video and right panel)
+        main_layout = QHBoxLayout(self)
+
+        # Video Stream Section (Left)
+        self.video_frame = QFrame()
+        self.video_frame.setStyleSheet("background-color: black;")
+        self.video_frame.setMinimumSize(400, 300)  # Minimum size for the video area
+        main_layout.addWidget(self.video_frame, stretch=3)
+
+        # Right Panel (Output and Description)
+        right_panel = QVBoxLayout()
+
+        # Output Section (Top of Right Panel)
+        self.output_label = QLabel("Output Here")
+        self.output_label.setStyleSheet(
+            "background-color: lightgray; font-size: 16px; padding: 10px;"
+        )
+        self.output_label.setAlignment(Qt.AlignCenter)
+        self.output_label.setFixedHeight(150)  # Optional: Adjust height as needed
+        right_panel.addWidget(self.output_label, stretch=1)
+
+        # Description Section (Bottom of Right Panel)
+        self.description_label = QLabel(description)
+        self.description_label.setStyleSheet("font-size: 18px; color: gray;")
+        self.description_label.setAlignment(Qt.AlignLeft | Qt.AlignTop)
+        self.description_label.setWordWrap(True)
+        right_panel.addWidget(self.description_label, stretch=2)
+
+        # Add the right panel to the main layout
+        main_layout.addLayout(right_panel, stretch=2)
+
+        # Set the main layout
+        self.setLayout(main_layout)

App/pages/home_page.py

@@ -11,37 +11,45 @@
 from PyQt5.QtSvg import QSvgRenderer
 from PyQt5.QtGui import QPixmap, QPainter, QColor, QFont
 from PyQt5.QtCore import Qt, QTimer
+from .hand_gesture_page import HandGestureRecognitionPage
+from .facial_expression_page import FacialExpressionRecognitionPage
+from .general_page import GeneralDemoPage
 
 
 class HomePage(QWidget):
     def __init__(self):
         super().__init__()
         self.setWindowTitle("SensorFusion: Home")
-        self.setGeometry(100, 100, 800, 600)
         self.load_styles()
 
         # Main layout
         main_layout = QGridLayout()
+
         self.setLayout(main_layout)
 
         # SVG Renderer for the logo
         self.svg_renderer = QSvgRenderer("../Datasets/UGLogo.svg")
 
         # Logo in the top-left corner
         self.logo_label = QLabel(self)
+        self.logo_label.setStyleSheet("background-color: blue;")
         main_layout.addWidget(self.logo_label, 0, 0, 1, 1, alignment=Qt.AlignTop | Qt.AlignLeft)
 
         # Title and introduction below the logo
         intro_container = QWidget()
+        intro_container.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Expanding)
+        intro_container.setObjectName("intro_container")  # Add object name for styling
+        intro_container.setStyleSheet("background-color: green;")
         intro_layout = QVBoxLayout()
         title_label = QLabel("Welcome to SensorFusion", self)
         title_label.setObjectName("title")  # For styling via QSS
         intro_label = QLabel("Explore multi-sensor demos with cutting-edge technology!", self)
+        intro_label.setObjectName("intro_label")  # Add object name for styling
         intro_label.setWordWrap(True)  # Allow wrapping of long text
         intro_container.setLayout(intro_layout)
         intro_layout.addWidget(title_label)
         intro_layout.addWidget(intro_label)
-        main_layout.addWidget(intro_container, 1, 0, 1, 1, alignment=Qt.AlignLeft)
+        main_layout.addWidget(intro_container, 1, 0, 1, 1, alignment=Qt.AlignTop | Qt.AlignLeft)
 
         # Demo buttons on the right side
         self.button_container = QWidget()
@@ -59,6 +67,7 @@ def __init__(self):
 
         for text, handler in demo_buttons:
             button = QPushButton(text, self)
+            button.setObjectName("button")  # Add object name for styling
             button.clicked.connect(handler)
             button.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Expanding)
             self.button_layout.addWidget(button)
@@ -140,11 +149,7 @@ def is_device_connected(self, device_name):
         devices = wmi.ExecQuery(query)
 
         # If the query returns any matching device, it means the device is connected
-        if devices:
-            for device in devices:
-                if device.DeviceID:
-                    return True
-        return False
+        return any(device.DeviceID for device in devices)
 
     def render_logo(self, width, height):
         """Render the SVG logo to a QPixmap of specified dimensions."""
@@ -180,16 +185,20 @@ def resizeEvent(self, event):
 
     # Handlers for demo buttons
     def open_hand_gesture_page(self):
-        print("Hand Gesture Recognition demo selected.")
+        self.hand_gesture_page=HandGestureRecognitionPage()
+        self.hand_gesture_page.show()
 
     def open_facial_expression_page(self):
-        print("Facial Expression Recognition demo selected.")
+        self.facial_expression_page=FacialExpressionRecognitionPage()
+        self.facial_expression_page.show()
 
     def open_object_detection_page(self):
-        print("Object Detection demo selected.")
+        self.object_detection_page=GeneralDemoPage("Object Detection","dummy description")
+        self.object_detection_page.show()
 
     def open_colour_detection_page(self):
-        print("Colour Detection demo selected.")
+        self.colour_detection_page=GeneralDemoPage("Colour Detection","dummy description")
+        self.colour_detection_page.show()
 
     def open_lidar_page(self):
         print("LiDAR demo selected.")

App/styles/base.qss

@@ -1,12 +1,22 @@
-QLabel {
+#title {
+    margin-top:10px;
+    margin-bottom:5px;
     font-size: 24px;
     font-weight: bold;
+    color: #333333;
+    spacing:0px;
 }
-QPushButton {
-    background-color: #4CAF50;
-    color: white;
-    padding: 10px 20px;
-    border: none;
-    border-radius: 5px;
-    font-size: 16px;
+#intro_label {
+    margin-left: 20px;
+    spacing:0px;
 }
+
+#intro_container {
+    margin-top: 0px;
+    spacing:0px;
+}
+
+#button {
+    font-size:16px;
+    color: gray;
+}