Design in interface: changed colors and sizes

degeon_py/active_chat.py

@@ -3,7 +3,7 @@ from __future__ import annotations
 from dataclasses import dataclass
 import pygame
 
-from config import HEIGHT, WIDTH
+from config import HEIGHT, WIDTH, CHAT_SELECTOR_WIDTH
 import degeon_core as dc
 
 
@@ -17,7 +17,7 @@ class ActiveChat:
     """
     chat: dc.Chat
     height: int = HEIGHT
-    width: int = 3 * (WIDTH // 4)
+    width: int = WIDTH - CHAT_SELECTOR_WIDTH
 
     @classmethod
     def new(cls, chat: 'dc.Chat', **kwargs) -> ActiveChat:

degeon_py/chat_selector.py

@@ -5,7 +5,7 @@ from dataclasses import dataclass, field
 
 import pygame
 
-from config import WIDTH, HEIGHT, DARK_BLUE, WHITE, GREY, BLUE, font
+from config import CHAT_SELECTOR_WIDTH, HEIGHT, DARK_BLUE, WHITE, GREY, BLUE, font, CHAT_PREVIEW_HEIGHT, MEDIUM_BLUE
 
 
 @dataclass
@@ -23,27 +23,28 @@ class ChatSelector:
         chat_height (int): height of one chat
     """
     chats: typing.List['dc.Chat'] = field(default_factory=list)
-    active_chat: int = 0
+    active_chat: int = -1
     hovered_chat: typing.Optional[int] = None
-    width: int = WIDTH // 3
+    width: int = CHAT_SELECTOR_WIDTH
     height: int = HEIGHT
-    chat_height: int = HEIGHT // 4
+    chat_height: int = CHAT_PREVIEW_HEIGHT
 
     def render(self) -> pygame.Surface:
         """
         Creates a pygame surface and draws the list of chats on it
         :return: the surface with the chat selector
         """
-        surface: pygame.Surface = pygame.Surface((self.width, self.chat_height * len(self.chats)))
+        surface: pygame.Surface = pygame.Surface((self.width, self.height))
+        surface.fill(GREY)
         for i, chat in enumerate(self.chats):
             bg_color, text_color = DARK_BLUE, WHITE
             if i == self.hovered_chat:
-                bg_color = GREY
+                bg_color = MEDIUM_BLUE
             if i == self.active_chat:
                 bg_color = BLUE
             title_surface: pygame.Surface = font.render(chat.profile.name, True, text_color)
-            pygame.draw.rect(surface, bg_color, (0, i * self.chat_height + 1, self.width, self.chat_height - 2))
-            surface.blit(title_surface, (i * self.chat_height + 10))
+            pygame.draw.rect(surface, bg_color, (3, i * self.chat_height + 1, self.width - 6, self.chat_height - 2))
+            surface.blit(title_surface, (7, i * self.chat_height + 10))
         return surface
 
     def process_event(self, event: pygame.event.Event):

degeon_py/config.py

@@ -12,11 +12,14 @@ MAGENTA = 0xFF03B8
 CYAN = 0x00FFCC
 BLACK = 0x000
 WHITE = 0xFFFFFF
+MEDIUM_BLUE = 0x2f2f4e
 DARK_BLUE = 0x282e46
+DARKER_BLUE = 0x202033
 GREY = 0x383e4F
-COLORS = [RED, BLUE, YELLOW, GREEN, MAGENTA, CYAN]
 
-WIDTH = 900
-HEIGHT = 700
+WIDTH = 1000
+HEIGHT = 800
+CHAT_PREVIEW_HEIGHT = 80
+CHAT_SELECTOR_WIDTH = WIDTH // 3
 
 FPS = 30

degeon_py/degeon.py

@@ -6,7 +6,7 @@ import pygame
 
 from chat_selector import ChatSelector
 from active_chat import ActiveChat
-from config import FPS
+from config import FPS, DARKER_BLUE, font, WHITE, WIDTH, CHAT_SELECTOR_WIDTH, HEIGHT
 
 import degeon_core as dc
 
@@ -43,6 +43,12 @@ class Degeon:
         """
         chats_surface = self.chat_selector.render()
         screen.blit(chats_surface, (0, 0))
+        if self.active_chat is not None:
+            pass
+        else:
+            text_surface: pygame.Surface = font.render('<- Select chat in the menu', True, WHITE)
+            screen.blit(text_surface,
+                        (round(WIDTH / 2 + CHAT_SELECTOR_WIDTH / 2 - text_surface.get_width() / 2), HEIGHT // 2))
 
     def process_core_messages(self):
         """
@@ -57,8 +63,10 @@ class Degeon:
         # process events in core
         self.process_core_messages()
         self.chat_selector.chats = self.core.chats
-        if self.chat_selector.active_chat < len(self.chat_selector.chats):
+        if 0 <= self.chat_selector.active_chat < len(self.chat_selector.chats):
             self.active_chat = ActiveChat.new(self.chat_selector.chats[self.chat_selector.active_chat])
+        else:
+            self.active_chat = None
 
     def process_event(self, event: pygame.event.Event):
         """
@@ -72,11 +80,12 @@ class Degeon:
         Drawing everything and handling events
         """
         while True:
-            self.clock.tick(self.fps)
+            screen.fill(DARKER_BLUE)
             for event in pygame.event.get():
                 if event.type == pygame.QUIT:
                     return
                 self.process_event(event)
             self.tick()
             self.render(screen)
+            self.clock.tick(self.fps)
             pygame.display.update()