Introducing an entry box {Pros only} ---- Part 2

Question

Hello everyone. A couple of days ago I already posted this: https://www.sololearn.com/Discuss/2859225/why-does-this-code-freeze-pros-only-introducing-an-entry-box-part-2

As you can see, now I need to introduce an entry box to this code.

import pygame
import random

pygame.init()

clock = pygame.time.Clock()
surface = pygame.display.set_mode((600, 400))
pygame.display.set_caption("Projecte MatZanfe")
font = pygame.font.SysFont('comicsans', 50)
base_font = pygame.font.Font(None, 32)
user_text = ''
color_active = pygame.Color('lightskyblue3')
running = True
def start_the_game():
x = random.randint(0, 10)
y = random.randint(0, 10)
is_correct = False
return x, y

def display_the_game(x, y):
# Variables
points = 0

z = x + y
surface.fill((255, 70, 90))
text = font.render(str(x) + "+" + str(y), True, (255, 255, 255))
input_rect = pygame.Rect(200, 200, 180, 50)

pygame.draw.rect(surface, color_active, input_rect)
text_surface = base_font.render(user_text, True, (255, 255, 255))
surface.blit(text_surface, input_rect)
surface.blit(text, (260, 120))
input_rect.w = max(100, text_surface.get_width() + 10)

x, y = start_the_game()
while running:
clock.tick(60)
for event in pygame.event.get():
if event.type == pygame.QUIT:
running = False
display_the_game(x, y)
pygame.display.update()
pygame.quit()

Answer 1

[UPDATED]
The code from the Entry Box is in a file named InputBox (that's why I import it like that) Here is the final code (I used the code from the first part as the main body).

import pygame
import random
from InputBox import InputBox

pygame.init()

clock = pygame.time.Clock()
surface = pygame.display.set_mode((600, 400))
pygame.display.set_caption("Projecte MatZanfe")
font = pygame.font.SysFont('comicsans', 50)
base_font = pygame.font.Font(None, 32)
user_text = ''
color_active = pygame.Color('lightskyblue3')
running = True

def start_the_game():
x = random.randint(0, 10)
y = random.randint(0, 10)
is_correct = False
return x, y

def display_the_game(x, y):
# Variables
points = 0

z = x + y
surface.fill((255, 70, 90))
text = font.render(str(x) + "+" + str(y), True, (255, 255, 255))

text_surface = base_font.render(user_text, True, (255, 255, 255))
surface.blit(text, (260, 120))
input_box.draw(surface)

x, y = start_the_game()
input_box = InputBox(190, 250, 200, 32)

while running:
clock.tick(60)
for event in pygame.event.get():
if event.type == pygame.QUIT:
running = False
else:
result = input_box.handle_event(event)
if result != None:
if int(result) == x + y:
# still have to add something
pass
else:
# still have to add something
pass

display_the_game(x, y) # By the way you can take all of the code in this function and move to the main loop, looks cleaner to me
pygame.display.update()

pygame.quit()

Answer 2

Part 1 of the ENTRY BOX (I divided this because it's too long for SoloLearn)

import pygame

pygame.init()
surface = pygame.display.set_mode((600, 400))
COLOR_INACTIVE = pygame.Color('lightskyblue3')
COLOR_ACTIVE = pygame.Color('dodgerblue2')
FONT = pygame.font.SysFont('comicsans', 32)
base_font = pygame.font.Font(None, 32)
color_active = pygame.Color('lightskyblue3')
user_text = ''

class InputBox:

def __init__(self, x, y, w, h, text=''):
self.rect = pygame.Rect(x, y, w, h)
self.color = COLOR_INACTIVE
self.text = text
self.txt_surface = FONT.render(text, True, self.color)
self.active = False

def handle_event(self, event):
if event.type == pygame.MOUSEBUTTONDOWN:
# If the user clicked on the input_box rect.
if self.rect.collidepoint(event.pos):
# Toggle the active variable.
self.active = not self.active
else:
self.active = False
# Change the current color of the input box.
self.color = COLOR_ACTIVE if self.active else COLOR_INACTIVE
if event.type == pygame.KEYDOWN:
if self.active:
if event.key == pygame.K_RETURN:
print(self.text)
self.text = ''
elif event.key == pygame.K_BACKSPACE:
self.text = self.text[:-1]
else:
self.text += event.unicode
# Re-render the text.
self.txt_surface = FONT.render(self.text, True, self.color)

def update(self):
# Resize the box if the text is too long.
width = max(200, self.txt_surface.get_width()+10)
self.rect.w = width

def draw(self, screen):
# Blit the text.
screen.blit(self.txt_surface, (self.rect.x+5, self.rect.y+5))
# Blit the rect.
pygame.draw.rect(screen, self.color, self.rect, 2)

Answer 3

Part 2 of the ENTRY BOX

def main():
clock = pygame.time.Clock()
input_box2 = InputBox(190, 250, 200, 32)
input_boxes = [input_box2]
done = False

while not done:
for event in pygame.event.get():
if event.type == pygame.QUIT:
done = True
for box in input_boxes:
box.handle_event(event)

for box in input_boxes:
box.update()

surface.fill((255, 70, 90))
for box in input_boxes:
box.draw(surface)

pygame.display.flip()
clock.tick(30)

if __name__ == '__main__':
main()
pygame.quit()