app.py

import gspread
import random
import os
import unicodedata
import gradio as gr
import keyfiledict
from oauth2client.service_account import ServiceAccountCredentials
from dotenv import load_dotenv

load_dotenv()

import json


def getData():
    gc = gspread.service_account_from_dict(keyfiledict.create_keyfile_dict())
    spreadsheet = gc.open_by_key(os.environ['OPEN_BY_KEY'])

    data = spreadsheet.worksheet('main').get_all_values()
    data = [[unicodedata.normalize('NFKC', row[0]).strip()] + row[1:] for row in data][1:] # normalize chars and remove header row
    return data

##### game #####

## globals
data = getData()
possibleAnswers = [unicodedata.normalize('NFKC', filename.rsplit('.', 1)[0]).strip() for filename in os.listdir('./assets')]
answer = ""
minPairGroup = []
score = 0

## setters
def setRandAnswer():
    global answer
    global possibleAnswers
    answer = random.choice(possibleAnswers)

def setMinPairGroup():
    global answer
    global minPairGroup
    global data
    answerRowIndex = next((i for i, sublist in enumerate(data) if sublist and sublist[0] == answer), -1)
    minPairGroup = [sublist[0] for sublist in data if sublist[1] == data[answerRowIndex][1]]

def updateScore(radio):
    global score
    if radio == answer:
        score += 5
    else:
        score += 0

## gradio

def nextQuestion(image, radio, scorebox):
    global answer
    global minPairGroup
    global score

    setRandAnswer()
    setMinPairGroup()
    
    image = gr.Image(f'./assets/{answer}.jpeg', label=answer, show_label= False)
    radio = gr.Radio(choices=minPairGroup, label='Which word is pictured?')
    scorebox = gr.Markdown(f"# Score: {score}")
    output_column = gr.Column(visible=False)
    input_column = gr.Column(visible=True)
   

    return image, radio, scorebox, output_column, input_column

# submit button function. updates everything.
def onSubmit(radio, scorebox):
    global answer
    global score

    updateScore(radio)
    input_column = gr.Column(visible=False)
    output_column = gr.Column(visible=True)
    results = f"{minPairGroup} {answer} is correct. Good job!" if radio==answer else f"{minPairGroup} Incorrect. The correct answer was {answer}."
    scorebox = gr.Markdown(f"# Score: {score}")
    
    return scorebox, output_column, results, input_column

# the interface
with gr.Blocks() as demo:
    setRandAnswer()
    setMinPairGroup()

    with gr.Column():
        scorebox = gr.Markdown(f"# Score: {score}")
        image = gr.Image(f'./assets/{answer}.jpeg', label=answer, show_label= False)

    with gr.Column(visible=True) as input_column:
        radio = gr.Radio(choices=minPairGroup, label='Which word is pictured?', interactive=True)
        submitButton = gr.Button("Submit")

    with gr.Column(visible=False) as output_column:
        results = gr.Textbox(label="Correct Answer") 
        nextButton = gr.Button("Next")
        nextButton.click(nextQuestion, inputs= [image, radio, scorebox], outputs=[image, radio, scorebox, output_column, input_column])
    
       
    submitButton.click(onSubmit, inputs= [radio, scorebox], outputs=[scorebox, output_column, results, input_column])
    
demo.launch()