import streamlit as st
import requests

images = {
    "ChatBot": "https://recfaces.com/wp-content/uploads/2021/06/voice-recognition-830x571.jpg",
    "Text2Speech": "https://img.freepik.com/vecteurs-premium/traducteur-vocal-ligne-isometrique-concept-langues-apprentissage-e-learning-traduction-langues-guide-audio-traducteur-chatbot-intelligence-artificielle_589019-3704.jpg?w=900",
    "Translation": "https://as2.ftcdn.net/v2/jpg/00/49/36/65/1000_F_49366575_CRDRRXsM7DrL2AHc06Fa4uoPFTOSh4oj.jpg"
}

# Fonction pour afficher la barre de menu horizontale interactive
def afficher_barre_menu():
    
    # Modifier l'arrière-plan de la barre latérale en fonction du choix      
    st.markdown(
        """
        <style>
        
        [data-testid="stSidebarContent"]{
        background-color: #e5e5f7;
        opacity: 0.8;
        background-image:  repeating-radial-gradient( circle at 0 0, transparent 0, #e5e5f7 10px ), repeating-linear-gradient( #f7724555, #f77245 );
        font-family: cursive;
        justify-content: center;
        
        }
        .nav-item {
            margin-right: 20px;
            color: white;
            font-size: 18px;
            font-weight: bold;
            text-decoration: none;
            transition: all 0.3s ease-in-out; /* Animation de transition */
        }
        .nav-item:hover {
            transform: translateY(-3px); /* Animation de légère élévation au survol */
            cursor: pointer; /* Curseur pointeur au survol */
        }
        
        </style>
        """,
        unsafe_allow_html=True
    )

    st.markdown(
        """
        <script>
        function change_contenu(option) {
            const choix = option.toLowerCase();
            const elements = document.getElementsByClassName('nav-item');
            for (let i = 0; i < elements.length; i++) {
                elements[i].classList.remove('selected');
            }
            document.getElementById(option).classList.add('selected');
            const contenu = document.getElementById('contenu');
            fetch_data(choix);
        }

        function fetch_data(choix) {
            const descriptions = {
                ChatBot: "Description de l'onglet ChatBot",
                Text2Speech: "Description de l'onglet Text2Speech",
                Translation: "Description de l'onglet Translation"
            };
            const description = descriptions[choix];
            document.getElementById('description').innerText = description;
        }
        
        </script>
        """,
        unsafe_allow_html=True
    )

# Fonction pour afficher la barre de description verticale
def afficher_barre_description(description):
    st.sidebar.title("Description")
    st.sidebar.write(description)

# Fonction principale pour afficher l'application
def main():
    afficher_barre_menu()
    st.sidebar.header("Principal")
    choix = st.sidebar.selectbox("Choose your option ",["ChatBot", "Text2Speech", "Translation"])

    if choix == "ChatBot":
        afficher_barre_description("This section features a chatbot inspired by Mistral-7B-Instruct-v0.2. Which is able to respond with a high level of expertise NB: for more precision put your text between quote.")
        afficher_ChatBot()
        
    elif choix == "Text2Speech":
        afficher_barre_description("Enter the text you wish to convert to speech in the text box below, then click the button to listen to the generated speech.")
        afficher_Text2Speech()
       
    elif choix == "Translation":
        afficher_barre_description("The Hellsinki model is used to translate Korean and Spanish texts into French.")
        afficher_Translation()
        
# Fonctions pour afficher le contenu
def afficher_ChatBot():
    st.title("Interactive Chatbot ")
    st.write("Welcome all of you.")
    
    # Définir le modèle et le tokenizer
    
    API_URL =  "https://api-inference.huggingface.co/models/mistralai/Mistral-7B-Instruct-v0.2"
    headers = {"Authorization":"XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"}
    
    def query(payload):
        response = requests.post(API_URL, headers=headers, json=payload)
        return response.json()
    
    # Envoyer le message lorsque l'utilisateur appuie sur Entrée
    messages = st.container(height = 300)
    if user_input := st.chat_input("Say something"):
        output = query({
	"inputs": user_input
	
})
        messages.chat_message('user').write(user_input)
        
        with st.spinner('Loading....'):
            messages.chat_message("assistant")
            messages.write(output[0]['generated_text'])



    
def afficher_Text2Speech():
    st.title("Text2Speech")
    API_URL = "https://api-inference.huggingface.co/models/facebook/mms-tts-eng"
    headers = {"Authorization": "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"}

    def query(payload):
        response = requests.post(API_URL, headers=headers, json=payload)
        return response.content

    texte_input = st.text_input("Enter your speech")
    
    if st.button('Conversion'):
        with st.spinner("Converting..."):
            audio_bytes = query({"inputs": texte_input, })
           
            md = f"""
            <audio autoplay="true">
            <source src="data:audio/wav;base64" type="audio/mp3">
            </audio>
            """
            st.markdown(
            md,
            unsafe_allow_html=True,
        )
            st.audio(audio_bytes, format="audio/mpeg", loop=True)
            
def afficher_Translation():
  langues = {
    "Korean - French": "Helsinki-NLP/opus-mt-ko-fr",
    "Espagnol - French": "Helsinki-NLP/opus-mt-es-fr"
}
  st.title("Translator")
  with st.container(height=500):
  
    langue_source = st.selectbox("Source :", list(langues.keys()))
    phrase = st.text_input("Enter the sentence to be translated :") 
    if st.button("Translate"):
            # Récupérer les modèles correspondants aux langues sélectionnées
        modele_source = langues[langue_source]
    
            # Appeler l'API pour traduire la phrase
        resultat = traduire(phrase, modele_source)

            # Afficher le résultat de la traduction
        st.markdown("** The translation :**")
        st.write(resultat[0]['translation_text'])

# Fonction pour appeler l'API de traduction
def traduire(phrase, modele_source):
    API_URL = f"https://api-inference.huggingface.co/models/{modele_source}"
    headers = {"Authorization": "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"}
    payload = {"inputs": phrase}
    response = requests.post(API_URL, headers=headers, json=payload)
    
    return response.json()

# Appel de la fonction principale
if __name__ == "__main__":
    main()