import os import json import gradio as gr import numpy as np from google.oauth2.service_account import Credentials from google.cloud import bigquery from theme import Seafoam seafoam = Seafoam() SCOPES = ["https://www.googleapis.com/auth/bigquery"] SERVICE_ACCOUNT_INFO = os.getenv("GBQ_TOKEN") service_account_info_dict = json.loads(SERVICE_ACCOUNT_INFO) creds = Credentials.from_service_account_info( service_account_info_dict, scopes=SCOPES ) client = bigquery.Client(credentials=creds, project=service_account_info_dict['project_id']) with open('achievement.html', 'r', encoding='utf-8') as file: html = file.read() html = "
" + html css=""" #user_avatar { background-color: transparent !important; border-radius: 50% !important; box-shadow: 0 10px 15px rgba(0,0,0,0.1); border-color: #fff !important; } #user_avatar > div > img { } #user_avatar_description h1{ font-size: 2.5rem; text-align: center; } #pet_avatar_description h1{ font-size: 2rem; text-align: center; } #badge_avatar_description h1{ font-size: 2rem; text-align: center; } #adventure_description h1{ font-size: 2rem; text-align: center; } #achievement_log { margin: 2.5rem auto 0 auto; } #pet_gallery .grid-wrap button { margin: .5vh; background: transparent !important; border-color: transparent !important; height: 150px !important; width: 6vh !important; border-radius: 20px; box-shadow: 0 0 10px rgba(0,0,0,0.3); } #pet_gallery .grid-container { grid-template-columns: repeat(30, minmax(6vh, 1fr)); } #badge_gallery .grid-wrap button { margin: .5vh; height: 150px !important; width: 10vh !important; background: transparent !important; border-color: transparent !important; border-radius: 20px; box-shadow: 0 0 10px rgba(0,0,0,0.3); backdrop-filter: blur(10px); } ::-webkit-scrollbar { width: 5px; height: 10px; } [data-testid="block-label"] { opacity: 0; } [aria-label="Share"] { opacity: 0; } """ # start of gradio interface with gr.Blocks(theme=seafoam, css=css) as demo: with gr.Row(): with gr.Column(scale=1,): pet_gallery = gr.Gallery(['partner1.png', 'partner2.png', 'partner3.png', 'partner4.png'] * 2, label="夥伴", preview=False, elem_id='pet_gallery', columns=30, height=200) pet_description = gr.Markdown('# 夥伴', elem_id='pet_avatar_description') badge_gallery = gr.Gallery(['badge.png', 'badge2.png', 'badge3.png', 'badge4.png'] * 2, label="徽章", preview=False, elem_id='badge_gallery', columns=30, height=200) badge_description = gr.Markdown('# 徽章', elem_id='badge_avatar_description') with gr.Column(scale=1): avatar = gr.Gallery(['avatar.png', 'avatar2.png'], preview=True, elem_id='user_avatar') avatar_description = gr.Markdown('# 光束守護者', elem_id='user_avatar_description') with gr.Column(scale=1): description = gr.Markdown('# 冒險階段', elem_id='adventure_description') with open('progress_bar.html', 'r', encoding='utf-8') as file: progress_bar_html = file.read() progress_bar_html = "
" + progress_bar_html progress_bar = gr.HTML(progress_bar_html,) with open('stage_desc.html', 'r', encoding='utf-8') as file: stage_desc_html = file.read() stage_desc_html = "
" + stage_desc_html stage_desc = gr.HTML(stage_desc_html,) with gr.Row(): f = gr.HTML(html, label="Achievement Log", elem_id="achievement_log") with gr.Row(): i = gr.Textbox(elem_id="test1") o = gr.Textbox() b = gr.Button(elem_id="test2") df = gr.DataFrame() def run_query(user_id): QUERY = ( "SELECT created_at, points, user_role, joined, developer FROM `datastore_backup.UserData`" f"WHERE user_id = '{user_id}'" ) print(f'Start query, user_id: {user_id}, {QUERY}') query_job = client.query(QUERY) print('Running query') query_result = query_job.result() print('Query complete') df = query_result.to_dataframe() print('Convert to dataframe') # Select a subset of columns df = df[["created_at", "points", "user_role", "joined", "developer"]] # Convert numeric columns to standard numpy types print('Convert to numpy') df = df.astype({"points": np.int64}) return df b.click(run_query, i, df,) if __name__ == "__main__": demo.launch()