bug fixes; added choosing random opening, score+completed

README.md

@@ -9,8 +9,35 @@ app_file: app.py
 pinned: false
 license: cc0-1.0
 datasets:
-  - Lichess/chess-openings
-suggested_hardware: cpu-basic
+
+- Lichess/chess-openings
+  suggested_hardware: cpu-basic
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# Chess Openings
+
+This little app lets you practice ~3500 chess openings.
+
+This is just a toy app A(I) wrote for fun. Go to [Lichess](https://lichess.org/) or [Chess.com](https://chess.com) for serious chess practice.
+
+## Entering moves
+
+- Use standard algebraic notation (SAN)
+- Examples: e4, Nf3, O-O (castling), exd5 (pawn capture)
+- Specify the piece (except for pawns) + destination square
+- Use 'x' for captures, '+' for check, '#' for checkmate
+
+## Piece symbols
+
+- ♔ King (K)
+- ♕ Queen (Q)
+- ♖ Rook (R)
+- ♗ Bishop (B)
+- ♘ Knight (N)
+- ♙ Pawn (no letter)
+
+See full notation [here](<https://en.wikipedia.org/wiki/Algebraic_notation_(chess)>)
+
+## Dataset
+
+This app is using the [Lichess](https://lichess.org/) openings dataset via [HuggingFace](https://huggingface.co/datasets/Lichess/chess-openings)

app.py

@@ -1,4 +1,5 @@
 import io
+import random
 
 import chess
 import chess.pgn
@@ -8,6 +9,10 @@ from datasets import load_dataset
 
 st.set_page_config(page_title="Practice Chess Openings", page_icon="♖")
 
+# Load external CSS
+with open("style.css") as f:
+    st.markdown(f"<style>{f.read()}</style>", unsafe_allow_html=True)
+
 
 @st.cache_data
 def load_data():
@@ -29,15 +34,38 @@ if "board" not in st.session_state:
     st.session_state.board = chess.Board()
 if "moves" not in st.session_state:
     st.session_state.moves = []
+if "final_move_completed" not in st.session_state:
+    st.session_state.final_move_completed = False
+if "random_opening" not in st.session_state:
+    st.session_state.random_opening = None
+if "completed_openings" not in st.session_state:
+    st.session_state.completed_openings = set()
+if "score" not in st.session_state:
+    st.session_state.score = 0
 
 data = load_data()
-
 if data.empty:
     st.error("No data available. Failed to load from Hugging Face dataset.")
     st.stop()
 
+
+def update_score():
+    # Note: keeping it as a function to be able to try different scores
+    st.session_state.score += 1
+    #  score = 0
+    # for opening in st.session_state.completed_openings:
+    #     opening_data = data[data["name"] == opening].iloc[0]
+    #     moves_count = opening_data["pgn"].count(".")
+    #     score += moves_count
+
+    # return score
+
+
 # App layout
-st.title("Practice Chess Openings")
+st.markdown(
+    "<h1 style='text-align: center; font-size: 32px; margin-bottom: 10px; margin-top: -25px; padding-top: 0; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);'>Practice Chess Openings</h1>",
+    unsafe_allow_html=True,
+)
 
 with st.sidebar:
     st.header("Settings")
@@ -64,10 +92,47 @@ with st.sidebar:
         )
         st.stop()
 
+    # Random Opening button with custom styling
+    random_button = st.button(
+        "Random Opening",
+        key="random_opening_button",
+        use_container_width=True,
+        help="Select a random opening",
+        type="primary",  # This will give it a filled style
+    )
+
+    # Remove the previous CSS styling attempt
+    # The CSS is now loaded from the external file
+
+    if random_button:
+        available_openings = [
+            opening
+            for opening in filtered_data["name"].unique()
+            if opening not in st.session_state.completed_openings
+        ]
+        if available_openings:
+            st.session_state.random_opening = random.choice(available_openings)
+        else:
+            st.warning(
+                "You've completed all available openings! Resetting completed list."
+            )
+            st.session_state.completed_openings.clear()
+            st.session_state.random_opening = random.choice(
+                list(filtered_data["name"].unique())
+            )
+        st.rerun()
+
+    # Check if the random_opening is still in the filtered data
+    unique_openings = list(filtered_data["name"].unique())
+    if st.session_state.random_opening not in unique_openings:
+        st.session_state.random_opening = None
+
     opening = st.selectbox(
         label="Select an opening",
-        options=list(filtered_data["name"].unique()),
-        index=None,
+        options=unique_openings,
+        index=unique_openings.index(st.session_state.random_opening)
+        if st.session_state.random_opening
+        else 0,
         key="opening_selector",
         placeholder="Select an opening",
     )
@@ -77,16 +142,18 @@ with st.sidebar:
         st.session_state.move_index = 0
         st.session_state.user_move = ""
         st.session_state.board = chess.Board()
+        st.session_state.final_move_completed = False
+        if "success_message" in st.session_state:
+            del st.session_state.success_message
 
-        # Get PGN for the selected opening
+        # Get PGN for the selected opening and parse it
         selected_opening = filtered_data[filtered_data["name"] == opening].iloc[0]
         pgn = selected_opening["pgn"]
-
-        # Parse PGN
         game = chess.pgn.read_game(io.StringIO(pgn))
         st.session_state.moves = list(game.mainline_moves())
 
     with st.expander("Instructions"):
+        st.write("This app lets you practice ~3500 chess openings.")
         st.write("Entering moves:")
         st.write("Use standard algebraic notation (SAN)")
         st.write("Examples: e4, Nf3, O-O (castling), exd5 (pawn capture)")
@@ -108,9 +175,15 @@ with st.sidebar:
         st.write(
             "See full notation [here](https://en.wikipedia.org/wiki/Algebraic_notation_(chess))"
         )
+        st.write("---")
         st.write(
             "This app is using the [Lichess](https://lichess.org/) openings dataset via [HuggingFace](https://huggingface.co/datasets/Lichess/chess-openings)"
         )
+        st.write(
+            "This is just a toy app. Go to [Lichess](https://lichess.org/) \
+            or [Chess.com](https://chess.com) for serious chess practice \
+            (although I think this functionality isn't available there)"
+        )
 
 
 def update_board():
@@ -128,6 +201,9 @@ def update_next_move():
 def update_prev_move():
     if st.session_state.move_index > 0:
         st.session_state.move_index -= 1
+        st.session_state.final_move_completed = False
+        if "success_message" in st.session_state:
+            del st.session_state.success_message
         update_board()
 
 
@@ -136,31 +212,50 @@ col1, col2 = st.columns([3, 1])
 
 with col1:
     if st.session_state.current_opening:
-        st.subheader(f":blue[{st.session_state.current_opening}]")
+        st.markdown(
+            f"""
+            <div style='width: 360px; margin-bottom: 10px;'>
+                <h3 style='
+                    background: linear-gradient(90deg, #0077be, #00a86b);
+                    -webkit-background-clip: text;
+                    -webkit-text-fill-color: transparent;
+                    display: inline-block;
+                    font-weight: bold;
+                '>
+                    {st.session_state.current_opening}
+                </h3>
+            </div>
+            """,
+            unsafe_allow_html=True,
+        )
 
-        col_prev, col_next, right_col = st.columns([1, 1, 1])
+        col_prev, col_next, right_col = st.columns([5, 2, 2])
 
         with col_prev:
             st.button(
-                "⬅️ Previous",
+                "⬅️ &nbsp; Previous",
                 disabled=st.session_state.move_index == 0,
                 on_click=update_prev_move,
             )
         with col_next:
             st.button(
-                "➡️ Next",
-                disabled=st.session_state.move_index >= len(st.session_state.moves),
+                "Next &nbsp;&nbsp;&nbsp;➡️",
+                disabled=(st.session_state.move_index >= len(st.session_state.moves))
+                or (
+                    not hide_next_moves
+                    and st.session_state.move_index == len(st.session_state.moves)
+                ),
                 on_click=update_next_move,
             )
 
         board_container = st.empty()
-        board_container.image(chess.svg.board(board=st.session_state.board, size=450))
+        board_container.image(chess.svg.board(board=st.session_state.board, size=400))
 
         # User input for next move
         if hide_next_moves and st.session_state.move_index < len(
             st.session_state.moves
         ):
-            col_input, col_submit, col_right = st.columns([2, 1, 1])
+            col_input, col_submit, col_right = st.columns([3, 1, 1])
 
             def submit_move():
                 if st.session_state.user_move.strip() == "":
@@ -170,14 +265,23 @@ with col1:
                     user_chess_move = st.session_state.board.parse_san(user_move)
                     correct_move = st.session_state.moves[st.session_state.move_index]
                     if user_chess_move == correct_move:
-                        st.session_state.success_message = (
-                            "Correct move! Moving to the next one."
-                        )
+                        update_score()
                         st.session_state.move_index += 1
+                        if st.session_state.move_index == len(st.session_state.moves):
+                            st.session_state.success_message = "🎉 &nbsp; Well done!"
+                            st.session_state.final_move_completed = True
+                            st.session_state.completed_openings.add(
+                                st.session_state.current_opening
+                            )
+                        else:
+                            st.session_state.success_message = (
+                                "✅ Correct! Moving to the next one"
+                            )
+
                         st.session_state.user_move = ""
                         update_board()
                     else:
-                        st.session_state.error_message = "Incorrect move. Try again!"
+                        st.session_state.error_message = "😭 Incorrect move. Try again!"
                 except ValueError as e:
                     error_message = str(e).lower()
                     if (
@@ -185,9 +289,9 @@ with col1:
                         or "unexpected" in error_message
                         or "unterminated" in error_message
                     ):
-                        st.session_state.error_message = "Invalid move format. Please use standard SAN notation (e.g., e4 or Nf3)."
+                        st.session_state.error_message = "🚫 Invalid format. Please use standard SAN notation (e.g., e4 or Nf3)."
                     else:
-                        st.session_state.error_message = "Invalid move. This move is not allowed in the current position."
+                        st.session_state.error_message = "⛔ Invalid move. This move is not allowed in the current position."
 
             with col_input:
                 user_move = st.text_input(
@@ -203,7 +307,8 @@ with col1:
                     del st.session_state.error_message
                 elif "success_message" in st.session_state:
                     st.success(st.session_state.success_message)
-                    del st.session_state.success_message
+                    if not st.session_state.final_move_completed:
+                        del st.session_state.success_message
 
             with col_submit:
                 st.markdown("<br>", unsafe_allow_html=True)
@@ -211,12 +316,18 @@ with col1:
                     "Submit",
                     on_click=submit_move,
                 )
+
+        if st.session_state.final_move_completed:
+            col_success, col_empty = st.columns([1, 2])
+            with col_success:
+                st.success("🎉 &nbsp; Well done!")
+
     else:
         st.info("Please select an opening from the sidebar to begin.")
 
 with col2:
     if st.session_state.current_opening:
-        st.header("Moves", divider="green")
+        st.subheader("Moves", divider="green")
         move_text = ""
         current_node = chess.pgn.Game()
         for i, move in enumerate(st.session_state.moves):
@@ -234,3 +345,28 @@ with col2:
                 move_text += "\n"
             current_node = current_node.add_variation(move)
         st.markdown(move_text)
+
+with st.sidebar:
+    st.markdown("---")
+
+    # score = update_score()
+    st.metric(
+        label="Score",
+        value=st.session_state.score,
+        help="1 point per correct move",
+    )
+
+    col1, col2 = st.columns([3, 1])
+    with col1:
+        st.subheader("Completed Openings")
+    with col2:
+        if st.button("Reset", key="reset_completed", help="Reset completed openings"):
+            st.session_state.completed_openings.clear()
+            st.rerun()
+
+    with st.expander("View Completed Openings"):
+        if st.session_state.completed_openings:
+            for completed_opening in st.session_state.completed_openings:
+                st.markdown(f"- {completed_opening}")
+        else:
+            st.markdown("No openings completed yet.")

requirements.txt

@@ -1,4 +1,4 @@
   pandas>=2.2.3
   python-chess>=1.2.0
   datasets>=3.0.0
-  
+  streamlit>=1.38.0

style.css

@@ -0,0 +1,10 @@
+div[data-testid="element-container"]:has(button[kind="primary"]) button[kind="primary"] {
+    background-color: #9f1b4d;
+    color: white;
+    font-weight: bold;
+    border: none;
+}
+div[data-testid="element-container"]:has(button[kind="primary"]) button[kind="primary"]:hover {
+    background-color: #e83277;
+    color: white;
+}