app.py

# import part
import streamlit as st
from transformers import pipeline
from gtts import gTTS
import io


# function part
# img2text
def img2text(url):
    image_to_text_model = pipeline("image-to-text", model="Salesforce/blip-image-captioning-base")
    text = image_to_text_model(url)[0]["generated_text"]
    return text


# text2story
def text2story(text):
    pipe = pipeline("text-generation", model="pranavpsv/genre-story-generator-v2", max_new_tokens=160, min_new_tokens=130, num_return_sequences=1)
    story_text = pipe(text)[0]['generated_text']
    # Make sure the output is complete sentences
    last_punctuation = max(story_text.rfind("."), story_text.rfind("!"), story_text.rfind("?"))
    if last_punctuation != -1:
        story_text = story_text[:last_punctuation+1]
    return story_text


# text2audio
def text2audio(story_text):
    tts = gTTS(text = story_text, lang='en')  # gtts is for a female voice which is more suitable for reading the story for children
    audio_bytes = io.BytesIO()
    tts.write_to_fp(audio_bytes)
    audio_bytes.seek(0)
    return audio_bytes


def main():
    # Optimize title area to attract children's attention
    st.set_page_config(page_title="Magic Storyteller", page_icon="🧚")
    st.markdown("""
    <style>
    @import url('https://fonts.googleapis.com/css2?family=Comic+Neue:wght@700&display=swap');
    .header {
        background: linear-gradient(45deg, #FF9A6C, #FF6B6B);
        border-radius: 15px;
        padding: 2rem;
        text-align: center;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        margin-bottom: 2rem;
    }
    .subtitle {
        font-family: 'Comic Neue', cursive;
        color: #4B4B4B;
        font-size: 1.2rem;
        margin: 1rem 0;
        padding: 1rem;
        background: rgba(255,255,255,0.9);
        border-radius: 10px;
        border-left: 5px solid #FF6B6B;
    }
    </style>
    """, unsafe_allow_html=True)

    st.markdown("""
    <div class="header">
        <h1 style='margin:0;'>🪄 Magic Storyteller</h1>
        <p style='color: white; font-size: 1.2rem;'>Turn your pictures into stories!</p>
    </div>
    """, unsafe_allow_html=True)
    uploaded_file = st.file_uploader("👉🏻 Upload your magic picture here...", type=["jpg", "png"])

    if uploaded_file is not None:
        bytes_data = uploaded_file.getvalue()
        with open(uploaded_file.name, "wb") as file:
            file.write(bytes_data)
        st.image(uploaded_file, caption="Your Magic Picture ✨", use_container_width=True)
        status_container = st.empty()
        progress_bar = st.progress(0)

        # Stage 1: Image to Text
        with status_container.status("🔮 **Step 1/3**: Decoding picture magic...", expanded=True) as status:  # Add progress bar components to improve experience
            progress_bar.progress(33)
            scenario = img2text(uploaded_file.name)
            status.update(label="✅ Picture decoded!", state="complete")
            st.write(f"**What I see:** {scenario}")

        #Stage 2: Text to Story
        with status_container.status("📚 **Step 2/3**: Writing your fairy tale...", expanded=True) as status:
            progress_bar.progress(66)
            story = text2story(scenario)
            status.update(label="✅ Story created!", state="complete")
            st.write(f"**Your Story:**\n{story}")

        #Stage 3: Story to Audio data
        with status_container.status("🎵 **Step 3/3**: Adding magic audio...", expanded=True) as status:
            progress_bar.progress(100)
            audio_data = text2audio(story)
            status.update(label="✅ Start playing the story!", state="complete")
        
            st.audio(audio_data, 
                    format="audio/mp3",
                    autoplay=True)

if __name__ == "__main__":
    main()