import streamlit as st
import requests
from streamlit_ace import st_ace

# Configure Streamlit page
st.set_page_config(
    page_title="Online Python Compiler",
    page_icon="🐍",
    layout="wide"
)

# Custom CSS for background, text, and tabs
tabs_css = """
    <style>
        /* Full-screen background image */
        .stApp {
            background: url('https://huggingface.co/spaces/MLDeveloper/python_compiler/blob/main/images/web-browser-mockup-browser-template-blank-web-page-simple-design-web-window_570901-31.avif') no-repeat center center fixed;
            background-size: cover;
        }
        /* Remove the white background box in header */
        .stHeader, .stSubheader {
            background-color: transparent !important;
        }
        /* Remove any background box around the text */
        .stMarkdown, .stTitle, .stText, .stList, .stSubheader {
            background-color: transparent;
            color: black !important;
            font-weight: bold;
        }
        /* Custom styling for tabs */
        .stTabs [data-baseweb="tab-list"] {
            background-color: white;
            border-radius: 20px;
            padding: 5px;
            box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
        }
        .stTabs [data-baseweb="tab"] {
            color: #B71C1C;
            font-weight: bold;
            border-radius: 20px;
            padding: 10px 20px;
        }
        .stTabs [aria-selected="true"] {
            background-color: #FAE5D3 !important;
            color: #B71C1C !important;
            font-weight: bold;
        }
        /* Add some padding and styling to text boxes */
        .stTextInput, .stTextArea {
            font-size: 16px;
            padding: 10px;
            border-radius: 8px;
            border: 1px solid #ccc;
        }

        /* Extra styling for textarea and button */
        .stTextArea textarea {
            font-size: 16px;
            font-family: monospace;
        }
        .stButton button {
            background-color: #1E90FF;
            color: white;
        }
    </style>
"""
st.markdown(tabs_css, unsafe_allow_html=True)

st.title("🐍 Online Python Compiler")

# Default Python code template
default_code = '''# Write your Python code here
print("Hello, World!")
'''

# Code editor (using Ace Editor)
code = st_ace(
    value=default_code,
    language="python",
    theme="monokai",
    key="python_editor",
    font_size=16,
    height=300,
    auto_update=True,
)

# Run button
if st.button("▶ Run Code"):
    if code.strip():
        with st.spinner("Running your code..."):
            try:
                # Send code to backend
                API_URL = "https://your-backend-service.onrender.com/run"  # Replace with actual backend URL
                response = requests.post(API_URL, json={"code": code})  # Make API call

                # Get output
                output = response.json().get("output", "Error in execution.")

                # Display output
                st.subheader("📌 Output:")
                st.code(output, language="text")

            except requests.exceptions.RequestException as e:
                st.error(f"⚠️ Error connecting to the backend: {e}")
    else:
        st.warning("⚠️ Please write some Python code before running.")