import streamlit as st
import google.generativeai as genai
import os
import json
import base64
from dotenv import load_dotenv
from streamlit_local_storage import LocalStorage
import re
import streamlit.components.v1 as components
import math # Needed for trigonometry in dynamic visuals
# --- PAGE CONFIGURATION ---
st.set_page_config(
page_title="Math Jegna - Your AI Math Tutor",
page_icon="๐ง ",
layout="wide"
)
# Create an instance of the LocalStorage class
localS = LocalStorage()
# --- HELPER FUNCTIONS ---
def format_chat_for_download(chat_history):
"""Formats the chat history into a human-readable string for download."""
# (Code remains the same)
formatted_text = f"# Math Mentor Chat\n\n"
for message in chat_history:
role = "You" if message["role"] == "user" else "Math Mentor"
formatted_text += f"**{role}:**\n{message['content']}\n\n---\n\n"
return formatted_text
def convert_role_for_gemini(role):
"""Convert Streamlit chat roles to Gemini API roles"""
# (Code remains the same)
if role == "assistant":
return "model"
return role
def should_generate_visual(user_prompt, ai_response):
"""Determine if a visual aid would be helpful based on the content"""
# (Code remains the same)
k12_visual_keywords = [
'add', 'subtract', 'multiply', 'times', 'divide', 'divided by', 'counting', 'numbers',
'fraction', 'half', 'quarter', 'third', 'parts', 'whole',
'shape', 'triangle', 'circle', 'square', 'rectangle',
'money', 'coins', 'dollars', 'cents', 'change',
'time', 'clock', 'hours', 'minutes', 'o\'clock',
'measurement', 'length', 'height', 'weight',
'place value', 'tens', 'ones', 'hundreds',
'pattern', 'sequence', 'skip counting',
'greater than', 'less than', 'equal', 'compare',
'number line', 'array', 'grid', 'area model'
]
combined_text = (user_prompt + " " + ai_response).lower()
return any(keyword in combined_text for keyword in k12_visual_keywords) or any(op in user_prompt for op in ['*', '/'])
def create_visual_manipulative(user_prompt, ai_response):
"""-- SMART VISUAL ROUTER (UPGRADED) --"""
try:
user_lower = user_prompt.lower().replace(' ', '')
# Priority 1: Division
div_match = re.search(r'(\d+)dividedby(\d+)', user_lower) or re.search(r'(\d+)/(\d+)', user_lower)
if div_match and "fraction" not in user_lower:
dividend, divisor = int(div_match.group(1)), int(div_match.group(2))
if dividend <= 50 and divisor > 0:
return create_division_groups_visual(dividend, divisor)
# Priority 2: Multiplication (UPGRADED LOGIC)
mult_match = re.search(r'(\d+)(?:x|times|\*)(\d+)', user_lower)
if mult_match:
num1, num2 = int(mult_match.group(1)), int(mult_match.group(2))
# NEW: Use multi-model visual for basic facts
if num1 <= 10 and num2 <= 10:
return create_multi_model_multiplication_visual(num1, num2)
# Use fixed area model for larger numbers
elif 10 < num1 < 100 and 10 < num2 < 100:
return create_multiplication_area_model(num1, num2)
# Other priorities remain the same...
time_match = re.search(r'(\d{1,2}):(\d{2})', user_lower) or re.search(r'(\d{1,2})o\'clock', user_lower)
if time_match:
groups = time_match.groups()
hour = int(groups[0])
minute = int(groups[1]) if len(groups) > 1 and groups[1] else 0
if 1 <= hour <= 12 and 0 <= minute <= 59: return create_clock_visual(hour, minute)
fraction_match = re.search(r'(\d+)/(\d+)', user_lower)
if fraction_match:
num, den = int(fraction_match.group(1)), int(fraction_match.group(2))
if 0 < num <= den and den <= 16: return create_dynamic_fraction_circle(num, den)
if any(word in user_lower for word in ['add', 'plus', '+', 'subtract', 'minus', 'takeaway', '-']):
numbers = re.findall(r'\d+', user_prompt)
if len(numbers) >= 2:
num1, num2 = int(numbers[0]), int(numbers[1])
operation = 'add' if any(w in user_lower for w in ['add', 'plus', '+']) else 'subtract'
if num1 <= 20 and num2 <= 20: return create_counting_blocks(num1, num2, operation)
if 'numberline' in user_lower:
numbers = [int(n) for n in re.findall(r'\d+', user_prompt)]
if numbers: return create_number_line(min(numbers) - 2, max(numbers) + 2, numbers, "Your Numbers on the Line")
if 'placevalue' in user_lower:
numbers = re.findall(r'\d+', user_prompt)
if numbers and int(numbers[0]) <= 999: return create_place_value_blocks(int(numbers[0]))
# Fallbacks remain the same
if any(word in user_lower for word in ['fraction', 'part']): return create_dynamic_fraction_circle(1, 2)
if any(word in user_lower for word in ['shape']): return create_shape_explorer()
if any(word in user_lower for word in ['money', 'coin']): return create_money_counter()
if any(word in user_lower for word in ['time', 'clock']): return create_clock_visual(10, 10)
return None
except Exception as e:
st.error(f"Could not create visual: {e}")
return None
# --- VISUAL TOOLBOX FUNCTIONS ---
def create_multi_model_multiplication_visual(rows, cols):
"""(BRAND NEW) Creates a rich, multi-model view for basic multiplication facts."""
# 1. Equal Groups visual
groups_html = ""
for r in range(rows):
dots = "".join([f'' for _ in range(cols)])
groups_html += f'
{dots}
'
# 2. Array visual (SVG)
cell_size, gap = 20, 4
svg_width = cols * (cell_size + gap)
svg_height = rows * (cell_size + gap)
array_dots = "".join([f'' for r in range(rows) for c in range(cols)])
array_svg = f''
# 3. Repeated Addition
addition_str = " + ".join([str(cols) for _ in range(rows)])
# 4. Number Line (SVG)
line_end = rows * cols + 2
line_width = 400
padding = 20
scale = (line_width - 2 * padding) / line_end
ticks = "".join([f'{i}' for i in range(0, line_end, 2)])
jumps_html = ""
for i in range(rows):
start_x, end_x = padding + (i * cols * scale), padding + ((i + 1) * cols * scale)
jumps_html += f''
number_line_svg = f''
html = f"""
Four Ways to See {rows} ร {cols} = {rows*cols}
Use an Array
{array_svg}
Use Equal Groups
{groups_html}
Use Repeated Addition
{addition_str}
Use a Number Line
{number_line_svg}
"""
return html
def create_multiplication_area_model(num1, num2):
"""(FIXED & Dynamic) Creates a correctly formatted area model for 2-digit multiplication."""
n1_tens, n1_ones = num1 // 10, num1 % 10
n2_tens, n2_ones = num2 // 10, num2 % 10
p1, p2, p3, p4 = n1_tens*10 * n2_tens*10, n1_tens*10 * n2_ones, n1_ones * n2_tens*10, n1_ones * n2_ones
total = p1 + p2 + p3 + p4
html = f"""
"""
return html
# --- [All other visual functions and app code remain the same] ---
# Note: For brevity, only the changed and new functions are shown in full detail.
# The rest of the functions (division, counting, fractions, etc.) are included below.
def create_division_groups_visual(dividend, divisor):
"""(Dynamic) Creates a visual for division by grouping."""
if divisor == 0: return ""
quotient = dividend // divisor
groups_html = ""
dot_colors = ["#FF6B6B", "#4ECDC4", "#FFD93D", "#95E1D3", "#A0C4FF", "#FDBF6F"]
for i in range(divisor):
dots_in_group = "".join([f'' for _ in range(quotient)])
groups_html += f'
Group {i+1}
{dots_in_group}
'
html = f"""
Dividing {dividend} into {divisor} Groups
We are sharing {dividend} items equally among {divisor} groups.
{groups_html}
Each group gets {quotient} items. So, {dividend} รท {divisor} = {quotient}.
"""
return html
def create_counting_blocks(num1, num2, operation):
"""(Dynamic) Create colorful counting blocks for addition/subtraction."""
html = f"""
{''.join([f'' for _ in range(num1 + num2 if operation == 'add' else max(0, num1 - num2))])}
"""
return html
def create_dynamic_fraction_circle(numerator, denominator):
"""(Dynamic) Generates an SVG of a pizza/pie to represent a fraction."""
if not (0 < numerator <= denominator): return "
"""
return html
def create_shape_explorer():
"""(Static) Create colorful shape recognition tool."""
html = """
๐ท Shape Explorer!
Circle
Round and smooth!
Square
4 equal sides!
Triangle
3 sides and corners!
Rectangle
4 sides, opposite sides equal!
Can you find these shapes around you? ๐โจ
"""
return html
def create_money_counter():
"""(Static) Create coin counting visual."""
html = """
๐ฐ Money Counter!
Penny
1ยข
1 cent
Nickel
5ยข
5 cents
Dime
10ยข
10 cents
Quarter
25ยข
25 cents
Practice counting coins to make different amounts! ๐ชโจ
"""
return html
# --- [The rest of your application code remains the same] ---
# Paste the boilerplate (API Key, Session State, Dialogs, Main Layout) here.
# --- API KEY & MODEL CONFIGURATION ---
load_dotenv()
api_key = None
try:
api_key = st.secrets["GOOGLE_API_KEY"]
except (KeyError, FileNotFoundError):
api_key = os.getenv("GOOGLE_API_KEY")
if api_key:
genai.configure(api_key=api_key)
model = genai.GenerativeModel(
model_name="gemini-1.5-flash",
system_instruction="""
You are "Math Jegna", an AI specializing exclusively in K-12 mathematics.
Your one and only function is to solve and explain math problems for children.
You are an AI math tutor that uses the Professor B methodology. This methodology is designed to activate children's natural learning capacities and present mathematics as a contextual, developmental story that makes sense.
IMPORTANT: When explaining mathematical concepts to young learners, mention that colorful visual aids will be provided to help illustrate the concept. Use phrases like:
- "Let's look at this in a few different ways..."
- "A fun visual will help you see how this works..."
- "Let's use an area model to understand this multiplication problem..."
- "I'll create a picture showing how we can divide these into groups..."
Always use age-appropriate language and relate math to real-world examples children understand.
You are strictly forbidden from answering any question that is not mathematical in nature. If you receive a non-mathematical question, you MUST decline with: "I can only answer math questions for students. Please ask me about numbers, shapes, counting, or other math topics!"
Keep explanations simple, encouraging, and fun for young learners.
"""
)
else:
st.error("๐จ Google API Key not found! Please add it to your secrets or a local .env file.")
st.stop()
# --- SESSION STATE, DIALOGS, and MAIN APP LAYOUT ---
# (This entire section is identical to the previous version and is included for completeness)
if "chats" not in st.session_state:
try:
shared_chat_b64 = st.query_params.get("shared_chat")
if shared_chat_b64:
decoded_chat_json = base64.urlsafe_b64decode(shared_chat_b64).decode()
st.session_state.chats = {"Shared Chat": json.loads(decoded_chat_json)}
st.session_state.active_chat_key = "Shared Chat"
st.query_params.clear()
else: raise ValueError("No shared chat")
except (TypeError, ValueError, Exception):
saved_data_json = localS.getItem("math_mentor_chats")
if saved_data_json:
saved_data = json.loads(saved_data_json)
st.session_state.chats = saved_data.get("chats", {})
st.session_state.active_chat_key = saved_data.get("active_chat_key", "New Chat")
else:
st.session_state.chats = { "New Chat": [{"role": "assistant", "content": "Hello! I'm Math Jegna, your friendly math helper! ๐ง โจ What would you like to learn about today?"}] }
st.session_state.active_chat_key = "New Chat"
@st.dialog("Rename Chat")
def rename_chat(chat_key):
st.write(f"Enter a new name for '{chat_key}':")
new_name = st.text_input("New Name", key=f"rename_input_{chat_key}")
if st.button("Save", key=f"save_rename_{chat_key}"):
if new_name and new_name not in st.session_state.chats:
st.session_state.chats[new_name] = st.session_state.chats.pop(chat_key)
st.session_state.active_chat_key = new_name
st.rerun()
elif not new_name: st.error("Name cannot be empty.")
else: st.error("A chat with this name already exists.")
@st.dialog("Delete Chat")
def delete_chat(chat_key):
st.warning(f"Are you sure you want to delete '{chat_key}'? This cannot be undone.")
if st.button("Yes, Delete", type="primary", key=f"confirm_delete_{chat_key}"):
st.session_state.chats.pop(chat_key)
if st.session_state.active_chat_key == chat_key:
if st.session_state.chats: st.session_state.active_chat_key = next(iter(st.session_state.chats))
else:
st.session_state.chats["New Chat"] = [{"role": "assistant", "content": "Hello! Let's start a new math adventure! ๐"}]
st.session_state.active_chat_key = "New Chat"
st.rerun()
with st.sidebar:
st.title("๐งฎ Math Jegna")
st.write("Your K-8 AI Math Tutor")
st.divider()
for chat_key in list(st.session_state.chats.keys()):
col1, col2, col3 = st.columns([0.6, 0.2, 0.2])
with col1:
if st.button(chat_key, key=f"switch_{chat_key}", use_container_width=True, type="primary" if st.session_state.active_chat_key == chat_key else "secondary"):
st.session_state.active_chat_key = chat_key
st.rerun()
with col2:
if st.button("โ๏ธ", key=f"rename_{chat_key}", help="Rename Chat"): rename_chat(chat_key)
with col3:
if st.button("๐๏ธ", key=f"delete_{chat_key}", help="Delete Chat"): delete_chat(chat_key)
if st.button("โ New Chat", use_container_width=True):
new_chat_name = f"Chat {len(st.session_state.chats) + 1}"
while new_chat_name in st.session_state.chats: new_chat_name += "*"
st.session_state.chats[new_chat_name] = [{"role": "assistant", "content": "Ready for a new math problem! What's on your mind? ๐"}]
st.session_state.active_chat_key = new_chat_name
st.rerun()
st.divider()
if st.button("๐พ Save Chats", use_container_width=True):
data_to_save = {"chats": st.session_state.chats, "active_chat_key": st.session_state.active_chat_key}
localS.setItem("math_mentor_chats", json.dumps(data_to_save))
st.toast("Chats saved to your browser!", icon="โ ")
active_chat_history = st.session_state.chats[st.session_state.active_chat_key]
download_str = format_chat_for_download(active_chat_history)
st.download_button(label="๐ฅ Download Chat", data=download_str, file_name=f"{st.session_state.active_chat_key.replace(' ', '_')}_history.md", mime="text/markdown", use_container_width=True)
if st.button("๐ Share Chat", use_container_width=True):
chat_json = json.dumps(st.session_state.chats[st.session_state.active_chat_key])
chat_b64 = base64.urlsafe_b64encode(chat_json.encode()).decode()
share_url = f"https://huggingface.co/spaces/YOUR_SPACE_HERE?shared_chat={chat_b64}"
st.code(share_url)
st.info("Copy the URL above to share this specific chat! (Update the base URL)")
st.header(f"Chatting with Math Jegna: _{st.session_state.active_chat_key}_")
for message in st.session_state.chats[st.session_state.active_chat_key]:
with st.chat_message(message["role"]):
st.markdown(message["content"])
if "visual_html" in message and message["visual_html"]:
components.html(message["visual_html"], height=550, scrolling=True)
if prompt := st.chat_input("Ask a K-8 math question..."):
st.session_state.chats[st.session_state.active_chat_key].append({"role": "user", "content": prompt})
with st.chat_message("user"):
st.markdown(prompt)
gemini_chat_history = [{"role": convert_role_for_gemini(m["role"]), "parts": [m["content"]]} for m in st.session_state.chats[st.session_state.active_chat_key]]
with st.chat_message("assistant"):
with st.spinner("Math Jegna is thinking..."):
try:
chat_session = model.start_chat(history=gemini_chat_history)
response = chat_session.send_message(prompt, stream=True)
full_response = ""
response_container = st.empty()
for chunk in response:
full_response += chunk.text
response_container.markdown(full_response + " โ")
response_container.markdown(full_response)
visual_html_content = None
if should_generate_visual(prompt, full_response):
visual_html_content = create_visual_manipulative(prompt, full_response)
if visual_html_content:
components.html(visual_html_content, height=550, scrolling=True)
st.session_state.chats[st.session_state.active_chat_key].append({"role": "assistant", "content": full_response, "visual_html": visual_html_content})
except genai.types.generation_types.BlockedPromptException as e:
error_message = "I can only answer math questions for students. Please ask me about numbers, shapes, or other math topics!"
st.error(error_message)
st.session_state.chats[st.session_state.active_chat_key].append({"role": "assistant", "content": error_message, "visual_html": None})
except Exception as e:
st.error(f"An error occurred: {e}")