import pandas as pd
import streamlit as st
import altair as alt

# Main title for the app
st.title("Streamlit App for IS445: ID29937")

# Text description with URL
st.text("The URL for this app is: https://huggingface.co/spaces/Shrek29/is445_demo")

# Divider to separate sections
st.divider()

# Header for the scatter plot section
st.header("Scatter Plot of Weather Data from the BFRO Dataset")

source = "https://raw.githubusercontent.com/UIUC-iSchool-DataViz/is445_data/main/bfro_reports_fall2022.csv"
data = pd.read_csv(source).dropna()

# Scatter plot using Altair
scatter = (
    alt.Chart(data).mark_circle().encode(
        alt.X('visibility:Q').title('Visibility'),
        alt.Y('wind_speed:Q').title('Wind Speed'),
        alt.Color('season:N').scale(scheme="set2"),  # Using 'set2' color scheme
        alt.Size('temperature_high:Q'),
        alt.Tooltip(['visibility', 'wind_speed', 'season', 'pressure'])
    ).interactive()
)

st.altair_chart(scatter, use_container_width=True)

# Divider to separate sections
st.divider()

# Header for mixed chart section
st.header("Mixed Chart of Weather Data from the BFRO Dataset")

pts = alt.selection_point(encodings=['x'])
rect = alt.Chart(data).mark_rect().encode(
    alt.X('uv_index:Q').bin().title('UV Index'),
    alt.Y('cloud_cover:Q').bin().title('Cloud Cover'),
    alt.Color('count()').scale(scheme='greens').title('Count of UV Index'),
)

circ = rect.mark_point().encode(
    alt.ColorValue('darkred'),  # Change point color to dark red
    alt.Size('count()').title('Count of Cloud Cover')
).transform_filter(pts)

bar = alt.Chart(data, width=550, height=200).mark_bar().encode(
    x='season:N',
    y='count()',
    color=alt.condition(pts, alt.ColorValue("orange"), alt.ColorValue("grey"))
).add_params(pts)
    
special = alt.vconcat(
    rect + circ,
    bar
).resolve_legend(
    color="independent",
    size="independent"
)

# Display mixed chart
st.altair_chart(special)