import streamlit as st
from apps.utils import read_markdown
# from .streamlit_tensorboard import st_tensorboard, kill_tensorboard
from .utils import Toc

def app(state=None):
    #kill_tensorboard()
    toc = Toc()
    st.info("Welcome to our Multilingual Image Captioning demo. Please use the navigation sidebar to move to our demo, or scroll below to read all about our project. 🤗 In case the sidebar isn't properly rendered, please change to a smaller window size and back to full screen.")

    st.header("Table of contents")
    toc.placeholder()

    toc.header("Introduction and Motivation")
    st.write(read_markdown("intro/intro.md"))
    toc.subheader("Novel Contributions")
    st.write(read_markdown("intro/contributions.md"))

    toc.header("Methodology")

    toc.subheader("Pre-training")
    st.write(read_markdown("pretraining/intro.md"))
    toc.subsubheader("Dataset")
    st.write(read_markdown("pretraining/dataset.md"))
    _, col2, _ = st.beta_columns([1,3,1])
    with col2:
        st.image("./misc/Multilingual-IC.png", use_column_width='always')
    toc.subsubheader("Model")
    st.write(read_markdown("pretraining/model.md"))
    # toc.subsubheader("MLM Training Logs")
    # st.info("In case the TensorBoard logs are not displayed, please visit this link: https://huggingface.co/flax-community/multilingual-vqa-pt-ckpts/tensorboard")
    # st_tensorboard(logdir='./logs/pretrain_logs', port=6006)
    st.write(read_markdown("bias.md"))

    _, col2, col3, _ = st.beta_columns([0.5,2.5,2.5,0.5])
    with col2:
        st.image("./misc/examples/female_dev_1.jpg", width=350, caption = 'German Caption: <PERSON> arbeitet an einem Computer.', use_column_width='always')
    with col3:
        st.image("./misc/examples/female_doctor.jpg", width=350, caption = 'English Caption: A portrait of <PERSON>, a doctor who specializes in health care.', use_column_width='always')

    _, col2, col3, _ = st.beta_columns([0.5,2.5,2.5,0.5])
    with col2:
        st.image("./misc/examples/female_doctor_1.jpg", width=350, caption = 'Spanish Caption: El Dr. <PERSON> es un estudiante de posgrado.', use_column_width='always')
    with col3:
        st.image("./misc/examples/women_cricket.jpg", width=350, caption = 'English Caption: <PERSON> of India bats against <PERSON> of Australia during the first Twenty20 match between India and Australia at Indian Bowl Stadium in New Delhi on Friday. - PTI', use_column_width='always')

    _, col2, col3, _ = st.beta_columns([0.5,2.5,2.5,0.5])
    with col2:
        st.image("./misc/examples/female_dev_2.jpg", width=350, caption = "French Caption: Un écran d'ordinateur avec un écran d'ordinateur ouvert.", use_column_width='always')
    with col3:
        st.image("./misc/examples/female_biker_resized.jpg", width=350, caption = 'German Caption: <PERSON> auf dem Motorrad von <PERSON>.', use_column_width='always')

    toc.header("Challenges and Technical Difficulties")
    st.write(read_markdown("challenges.md"))

    toc.header("Limitations and Biases")
    st.write(read_markdown("bias.md"))

    toc.header("Conclusion, Future Work, and Social Impact")
    toc.subheader("Conclusion")
    st.write(read_markdown("conclusion_future_work/conclusion.md"))
    toc.subheader("Future Work")
    st.write(read_markdown("conclusion_future_work/future_scope.md"))
    toc.subheader("Social Impact")
    st.write(read_markdown("conclusion_future_work/social_impact.md"))

    toc.header("References")
    st.write(read_markdown("references.md"))


    toc.header("Acknowledgements")
    st.write(read_markdown("acknowledgements.md"))
    toc.generate()