feat: add player achievement render function

app.py

@@ -3,7 +3,12 @@ import json
 import gradio as gr
 
 from theme import Seafoam
-from utils.utils import get_content, get_player_partners, get_player_badges
+from utils.utils import (
+    get_content,
+    get_player_partners,
+    get_player_badges,
+    get_player_achievement_logs_html,
+)
 
 seafoam = Seafoam()
 
@@ -86,7 +91,7 @@ with gr.Blocks(theme=seafoam, css=get_content("css/style.css")) as demo:
     with gr.Row():
         html = (
             "<div style='max-width:100%; max-height:360px; overflow:auto'>"
-            + get_content("htmls/achievement.html")
+            + get_content("htmls/achievement_blank.html")
         )
         f = gr.HTML(html, label="Achievement Log", elem_id="achievement_log")
 
@@ -97,9 +102,12 @@ with gr.Blocks(theme=seafoam, css=get_content("css/style.css")) as demo:
         )
         player_info_query_btn = gr.Button("Query")
 
+    # actions when player login
     player_info_query_btn.click(get_player_info, player_backend_id, player_info).then(
         get_player_partners, player_info, pet_gallery
-    ).then(get_player_badges, player_info, badge_gallery)
+    ).then(get_player_badges, player_info, badge_gallery).then(
+        get_player_achievement_logs_html, player_info, f
+    )
 
 if __name__ == "__main__":
     demo.launch()

data.json

@@ -0,0 +1 @@
+{"http://id.junyiacademy.org/d6317d299321450191dd5da599a48b3d": {"player_backend_user_id": "http://id.junyiacademy.org/d6317d299321450191dd5da599a48b3d", "player_nickname": "PopcornParty", "player_group": 1, "partners": ["partner3"], "badges": ["badge3", "badge2"], "rewards_status": "{\"star_score_settler\": {\"is_completed\": false, \"is_issued\": false, \"reward_type\": \"badge\"}}", "achievement_logs": ["\u4f60\u5728\u548c\u795e\u79d8\u7684\u7570\u6b21\u5143\u751f\u7269\u4ea4\u6d41\u5f8c\uff0c\u9583\u73fe\u51fa\u4e86 5 \u6b21\u7684\u660e\u609f\u3002", "\u4f60\u5728\u548c\u795e\u79d8\u7684\u7570\u6b21\u5143\u751f\u7269\u4ea4\u6d41\u5f8c\uff0c\u9583\u73fe\u51fa\u4e86 5 \u6b21\u7684\u660e\u609f\u3002", "\u4f60\u5728\u548c\u795e\u79d8\u7684\u7570\u6b21\u5143\u751f\u7269\u4ea4\u6d41\u5f8c\uff0c\u9583\u73fe\u51fa\u4e86 99 \u6b21\u7684\u660e\u609f\u3002"], "total_active_days": 5, "total_gained_scores": 5, "total_finished_contents": 5, "created_at_date": "2023-11-05", "updated_at_date": "2023-11-05"}, "http://eduopenid.junyiacademy.org/unique/e2b8dfd9312643fcab6ef8ea9d3d8437": {"player_backend_user_id": "http://eduopenid.junyiacademy.org/unique/e2b8dfd9312643fcab6ef8ea9d3d8437", "player_nickname": "PopcornParty", "player_group": 2, "partners": ["partner_5"], "badges": [], "rewards_status": "{\"star_score_settler\": {\"is_completed\": false, \"is_issued\": false, \"reward_type\": \"badge\"}}", "achievement_logs": ["\u7d93\u904e\u4e86\u6578\u5929\u7684\u8271\u96e3\u65c5\u884c\uff0c\u4f60\u5728\u9edd\u9ed1\u661f\u7403\u4e0a\u627e\u5230\u4e86\u4e00\u500b\u795e\u79d8\u7684\u5730\u5e95\u5bf6\u85cf\u3002"], "total_active_days": 5, "total_gained_scores": 5, "total_finished_contents": 5, "created_at_date": "2023-11-05", "updated_at_date": "2023-11-05"}, "http://eduopenid.junyiacademy.org/unique/dd1ff37f8445428f8dc42b72a8d0075e": {"player_backend_user_id": "http://eduopenid.junyiacademy.org/unique/dd1ff37f8445428f8dc42b72a8d0075e", "player_nickname": "PopcornParty", "player_group": 3, "partners": ["partner_7"], "badges": [], "rewards_status": "{\"star_score_settler\": {\"is_completed\": false, \"is_issued\": false, \"reward_type\": \"badge\"}}", "achievement_logs": ["\u5728\u63a2\u7d22\u7570\u6b21\u5143\u7a7a\u9593\u7684\u904e\u7a0b\u4e2d\uff0c\u4f60\u9047\u5230\u4e86\u5f37\u5927\u7684\u661f\u969b\u602a\u7378\uff0c\u4f46\u4f60\u5011\u6191\u85c9\u8457\u8010\u529b\u548c\u667a\u6167\u6210\u529f\u64ca\u9000\u4e86\u602a\u7378\u3002"], "total_active_days": 5, "total_gained_scores": 5, "total_finished_contents": 5, "created_at_date": "2023-11-05", "updated_at_date": "2023-11-05"}, "http://id.junyiacademy.org/2abc9b4504274516978782b2e0d2bfdf": {"player_backend_user_id": "http://id.junyiacademy.org/2abc9b4504274516978782b2e0d2bfdf", "player_nickname": "PopcornParty", "player_group": 0, "partners": ["partner_1"], "badges": [], "rewards_status": "{\"star_score_settler\": {\"is_completed\": false, \"is_issued\": false, \"reward_type\": \"badge\"}}", "achievement_logs": ["\u4f60\u4ee5 5 \u5929\u7684\u6642\u9593\uff0c\u5728\u67d0\u661f\u7403\u6210\u529f\u627e\u5230\u63a7\u5236\u661f\u8266\u7684\u91d1\u9470\u5319\u3002"], "total_active_days": 5, "total_gained_scores": 5, "total_finished_contents": 5, "created_at_date": "2023-11-05", "updated_at_date": "2023-11-05"}, "http://jasmineid.junyiacademy.org/unique/8c7d995bfd8e4065885aef257bda478e": {"player_backend_user_id": "http://jasmineid.junyiacademy.org/unique/8c7d995bfd8e4065885aef257bda478e", "player_nickname": "PopcornParty", "player_group": 1, "partners": ["partner_3"], "badges": [], "rewards_status": "{\"star_score_settler\": {\"is_completed\": false, \"is_issued\": false, \"reward_type\": \"badge\"}}", "achievement_logs": ["\u7d93\u904e\u4e00\u6bb5\u6642\u9593\u7684\u52aa\u529b\uff0c\u4f60\u5728\u661f\u969b\u8ff7\u5bae\u4e2d\u627e\u5230\u4e86\u4e45\u9060\u7684\u795e\u8aed\u3002"], "total_active_days": 5, "total_gained_scores": 5, "total_finished_contents": 5, "created_at_date": "2023-11-05", "updated_at_date": "2023-11-05"}}

utils/utils.py

@@ -20,3 +20,17 @@ def get_player_partners(player_info: gr.State) -> List[str]:
 
 def get_player_badges(player_info: gr.State) -> List[str]:
     return [f"{MEDIA_PATH}{badge}{MEDIA_FILE_TYPE}" for badge in player_info["badges"]]
+
+
+def get_player_achievement_logs(player_info: gr.State) -> List[str]:
+    log_template = """<div class="achievement"><p>{player_log}</p></div>"""
+    return [
+        log_template.format(player_log=player_log)
+        for player_log in player_info["achievement_logs"]
+    ]
+
+
+def get_player_achievement_logs_html(player_info: gr.State) -> str:
+    achievement_logs = "".join(get_player_achievement_logs(player_info))
+    template_content = get_content("htmls/achievement_template.html")
+    return template_content.replace("{logs}", achievement_logs)