import streamlit as st
# import openai
import replicate
import os
from dotenv import load_dotenv
from streamlit_extras.stylable_container import stylable_container
import streamlit_extras
# load_dotenv()
# REPLICATE_API_TOKEN = os.environ.get("REPLICATE_API_TOKEN")
# replicate = replicate.Client(api_token=REPLICATE_API_TOKEN)

streamlit_style = """
            <style>
            #MainMenu {visibility: hidden;}
            footer {visibility: hidden;}
            video{width:200px;}
            .css-1wbqy5l {visibility: hidden;}
            .css-15zrgzn {visibility: hidden;}
            .css-klqnuk {visibility: hidden;}
            .en6cib64 {visibility: hidden;}
            .css-1u4fkce {visibility: hidden;}
            .en6cib62 {visibility: hidden;}
            .css-19rxjzo, .ef3psqc11 {
            background-color: purple;
            text-color: white;
            }
            div.stButton > button:first-child {
            background-color: darkgreen;
            text-weight: bold;
            }
            
            </style>
            """
def page8():
    with stylable_container(
         key="title",
         css_styles=[
             """ span {
                text-align: center;
                padding-top: 0px;
                padding-right: 0px;
                padding-bottom: 0px;
                padding-left: 0px;
                }"""
                ,
                """
                st-emotion-cache-0{
                     text-align: center;
                padding-top: 0px;
                padding-right: 0px;
                padding-bottom: 0px;
                padding-left: 0px;
                }""",
                
                """
                .e1f1d6gn0{
                     text-align: center;
                padding-top: 0px;
                padding-right: 0px;
                padding-bottom: 0px;
                padding-left: 0px;
                }
                
               
        """,
        ],
        
    ):
        st.markdown("<h3>Text to video</h3>", unsafe_allow_html=True) #This is under a css style 
    st.markdown(streamlit_style, unsafe_allow_html=True) 
    
    with st.form(key='form'):
        prompt = st.text_input(label='Enter text prompt for Video generation')
        placeholder=st.empty()
        col1,col2=placeholder.columns(2)
        video_length = col1.number_input("Enter video length (seconds)", step=1, min_value=1, max_value=8, value=4, placeholder="Type a number...")
        submit_button = st.form_submit_button(label='Generate Video')
    
    if submit_button:
        if prompt:
            placeholder=st.empty()
            col1,col2=placeholder.columns(2)
            with st.spinner("Generating Video from Text. Please wait...."):
                output = replicate.run(
                    "cjwbw/text2video-zero:e671ffe4e976c0ec813f15a9836ebcfd08857ac2669af6917e3c2549307f9fae",
                    input={
                        "fps": 4,
                        "prompt": prompt,
                        "model_name": "dreamlike-art/dreamlike-photoreal-2.0",
                        "timestep_t0": 44,
                        "timestep_t1": 47,
                        "video_length": video_length,
                        "negative_prompt": "",
                        "motion_field_strength_x": 12,
                        "motion_field_strength_y": 12
                    }
                )
                
                col1.text("Generated Video")
                col1.video(output)
                st.markdown(
                        """
                        <script>
                            const video = document.querySelector('video');
                            video.loop = true;
                            video.autoplay = true;
                        </script>
                        """,
                        unsafe_allow_html=True,
                        )