import streamlit as st 
from streamlit_option_menu import option_menu
import openai
from streamlit_chat import message
#importation des librairies 
import pandas as pd

st.set_page_config(layout='wide')
st.markdown("""
        <style>
               .block-container {
                    padding-top: 2rem;
                    padding-bottom: 0rem;
                    padding-left: 1rem;
                    padding-right: 1rem;
                }
        </style>
        """, unsafe_allow_html=True)

openai.api_key = "sk-proj-RExBXqnjaTYCWwB3aQOOT3BlbkFJJf9S2nbyQj11VfArtjjo"
 
def api_calling(prompt):
    completions = openai.Completion.create(
        engine="gpt-3.5-turbo-instruct",
        prompt=prompt,
        max_tokens=1024,
        n=1,
        stop=None,
        temperature=0.5,
    )
    message = completions.choices[0].text
    return message
header , menu = st.columns(2)

with header:
    st.image('static/img/bot.PNG')

with menu:
    # option_menu(menu_title=None,
    #     options=['Visualisation','Prédiction'],
    #     icons=["house","book",'envelope'],
    #     default_index=0,
    #     orientation="horizontal"
    #     )
    selecte=option_menu(None, ["Accueil", "Se déconnecter"], 
    icons=['house', 'cloud-upload'], 
    menu_icon="cast", default_index=0, orientation="horizontal",
    styles={
        "container": {"padding": "0!important", "background-color": "#fafafa","font-family": "Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif"},
        "icon": {"color": "orange", "font-size": "25px" }, 
        "nav-link": {"font-size": "20px", "text-align": "left", "margin":"0px", "--hover-color": "#eee"},
        "nav-link-selected": {"background-color": "#70ad46","color":"white"},
        "menu-title":{"color":"#424143"}
    }
)
    

if selecte == "Accueil":
    st.title(f"Bienvenu au cours d'informatique de la classe de 3ieme")
    sect1_col1=st.container()
    sect1_col2 = st.container()
    

    with open('static/css/style.css') as f:
            st.markdown(f'<style>{f.read()}</style>', unsafe_allow_html=True)
    with sect1_col1.container(height=700):

        st.selectbox("Quelle UE voulez-vous preparer?",("Architecture Maintenance et taleur" ,"   "))
        st.selectbox("De quel UA s'agit-il?",("Decrire les peripheriques","Decrire les logiciels","Assurer le bon fonctionnement de l'ordinateur","utiliser les fonctions d'un tableur"))
        if 'user_input' not in st.session_state:
            st.session_state['user_input'] = []
 
        if 'openai_response' not in st.session_state:
            st.session_state['openai_response'] = []
        
        def get_text():
            input_text = st.text_input("Quelles sont les objectifs du programme concerné?", key="input")
            return input_text
        
        user_input = get_text()
        
        if user_input:
            output = api_calling(user_input)
            output = output.lstrip("\n")
        
            # Store the output
            st.session_state.openai_response.append(user_input)
            st.session_state.user_input.append(output)
        
        message_history = st.empty()
        
        if st.session_state['user_input']:
            for i in range(len(st.session_state['user_input']) - 1, -1, -1):
                # This function displays user input
                message(st.session_state["user_input"][i], 
                        key=str(i),avatar_style="icons")
                # This function displays OpenAI response
                message(st.session_state['openai_response'][i], 
                        avatar_style="miniavs",is_user=True,
                        key=str(i) + 'data_by_user')

        
        st.markdown("""
        <style>
        # div[data-testid="stMetric"] {
        #     background-color: rgba(187, 216, 158, 0.59);
        #     border: 1px solid rgba(28, 131, 225, 0.1);
            padding:-10px;
        #     border-radius: 5px;
        #     color: rgb(30, 103, 119);
        #     overflow-wrap: break-word;
        #     font-weight:bold;
            
            
        # }
        
        [data-testid="stMetricValue"]{
            font-size: 45px;
            color: #2FB56B;
            font-weight:bold;
            text-align:center;
            margin-top:-33px;
            
            
            
        }

        /* breakline for metric text */
        [data-testid="stMetricLabel"] {
            word-wrap: break-word;
            color: #ef8451;
            font-size:40px;
            font-weight:bold;
                
            }
                    
                    
        [data-testid ="stVerticalBlock"]{
            #background-color: rgba(187, 216, 158, 0.59);
            #border: 1px solid rgba(28, 131, 225, 0.1);
            text-align:center;
        }
        [data-v-5af006b8]{
            background-color:black;
        }
        .st-emotion-cache-sr3x2q{
            width:80%;
            margin-left:10%;
            margin-right:10%;
            height: 50% !important;
        }
        .st-emotion-cache-7ym5gk{
            background-color: #70ad46;
            color:white;    
        }
        .st-emotion-cache-1jmvea6 p {
            font-size: 20px;
            color: black;
        }
        .st-emotion-cache-1jmvea6 p{
            font-size: 20px;
        }
        .st-emotion-cache-1wrcr25{
           background-color: #b1d1a0;
        }
        .st-emotion-cache-18ni7ap{
            background-color: #b1d1a0;
        }
        .st-emotion-cache-1yiq2ps{
            background-color: #b1d1a0;
        }
        </style>
    """
    , unsafe_allow_html=True)
    footer = st.container()
    with footer:
        st.markdown("---")
        st.markdown(
            """
            <style>
                p {
                    font-size: 16px;
                    text-align: center;
                }
                a {
                    text-decoration: none;
                    color: #00a;
                    font-weight: 600;
                }
            </style>
            <p>
                &copy; Designed by <a href="#"></a>.
            </p>
            """, unsafe_allow_html=True
            )


    
    

if selecte == "Données":
    


    st.title(f"Les Capteurs en NAIROBI,KENYA")
    st_folium(map,width=2000,height=600)
    st.title(f"DATA")
    moi = st.columns(1)
     
    placeholder = st.empty()
    df_all_concatenated_transform_daily= df_all_concatenated_transform_daily[df_all_concatenated_transform_daily["Moi"] ==moi_filtre]