#!/usr/bin/env python
# coding: utf-8

"""Exercise 3: Text & a Welcome Screen

Welcome screens, UI concepts would be essential in making games.
This exercise would help you to somewhat onboard: rendering text and switching between two states
(a "title screen" and a "game screen") using a simple state variable.

Reading text is also core to your game designs, this is the same technique
you will use to display NPC dialogue, shopping lists, quiz questions, etc.

Your task:
    (1) STATE "title":
    - Dark background
    - Large title text: "My Game" (centred horizontally, ~1/3 from top)
    - Smaller subtitle: "Press SPACE to start"  (centred, ~half-way down)
    - Pressing SPACE switches state to "playing"
    (2) STATE "playing":
    - White background
    - Message: "Game is running!"  (centered)
    - Smaller note: "Press R to restart"  (centered, a bit lower)
    - Pressing R switches state back to "title"
Both states: pressing ESCAPE or closing the window quits.

Reference for fonts: https://www.pygame.org/docs/ref/font.html
        pygame.font.Font(None, size)  --> None uses the default built-in font
        font.render(text, antialias, colour)  --> returns a Surface
        screen.blit(surface, (x, y))  --> draws the surface onto the screen
"""

import pygame

pygame.init()

WIDTH, HEIGHT = 500, 400
screen = pygame.display.set_mode((WIDTH, HEIGHT))
pygame.display.set_caption("Exercise 3: Text & Screens")

# COLOR Constants
BLACK = (0, 0, 0)
WHITE = (255, 255, 255)
DARK_GREY = (30, 30, 30)
LIGHT_GREY = (180, 180, 180)
CYAN = (0, 200, 200)

# FONTS set up
# TODO 1: Create two font objects using `pygame.font.Font(None, size)`
#   `font_large` with size 64
#   `font_small` with size 30
# HINT: pygame.font.Font(None, 64)
font_large = None # replace with your solution
font_small = None # replace with your solution

def draw_text_centred(surface, font, text, colour, y):
    # HELPER: renders `text` and blits it centred horizontally at height `y`
    rendered = font.render(text, True, colour)
    text_rect = rendered.get_rect(center=(WIDTH // 2, y))
    surface.blit(rendered, text_rect)

state = "title"   # this would help you starts on the title screen
clock = pygame.time.Clock()
running = True

while running:
    clock.tick(60)
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            running = False
        if event.type == pygame.KEYDOWN:
            if event.key == pygame.K_ESCAPE:
                running = False
            # TODO 2: If state is "title" and SPACE is pressed, switch state to "playing".

            # TODO 3: If state is "playing" and R is pressed, switch state back to "title".
            # HINT: event.key == pygame.K_r

    # DRAWING code
    if state == "title":
        # TODO 4: Fill the screen with DARK_GREY.

        # TODO 5: Use draw_text_centred() to draw:
        #   - "My Game" in CYAN, font_large, y = HEIGHT // 3
        #   - "Press SPACE to start" in LIGHT_GREY, font_small, y = HEIGHT // 2
        pass   # remove this line once you add your drawing code, this is a placeholder ^^

    elif state == "playing":
        # TODO 6: Fill the screen with WHITE.

        # TODO 7: Use draw_text_centred() to draw:
        #   - "Game is running!" in BLACK, font_large, y = HEIGHT // 3
        #   - "Press R to restart" in DARK_GREY, font_small, y = HEIGHT // 2
        pass   # remove this line once you add your drawing code, this is a placeholder ^^

    pygame.display.flip()
pygame.quit()
