app.py

import streamlit as st
import os
from PIL import Image
import google.generativeai as genai

# Konfigurasi API Gemini
secret_key = os.getenv("SECRET_KEY")
genai.configure(api_key=secret_key)

# Fungsi untuk menghasilkan prompt dari gambar
def get_gemini_response(image):
    model = genai.GenerativeModel('gemini-2.0-flash')
    input = '''You are a prompt generator. You will get an image.
    Your work is to write a prompt such that an image generator model would create most identical picture
    as the image given to you'''
    response = model.generate_content([input, image])  
    return response.text

# Konfigurasi halaman
st.set_page_config(page_title="Prompt Generation from Image", layout="wide")
st.title("🖼️ Prompt Generator from Image")

# Dua kolom layout
col1, col2 = st.columns(2)

with col1:
    st.markdown("### 📤 Upload Your Image")
    uploaded_file = st.file_uploader(
        "Drag and drop or click to upload an image...",
        type=["jpg", "jpeg", "png", "webp"],
        label_visibility="collapsed"
    )

    if uploaded_file is not None:
        image = Image.open(uploaded_file)
        st.image(image, caption="Uploaded Image", use_column_width=True)
    else:
        image = None

with col2:
    st.markdown("### 🎯 Generated Prompt")
    if uploaded_file is not None:
        if st.button("✨ Generate Prompt"):
            with st.spinner("Generating prompt..."):
                prompt = get_gemini_response(image)
            st.code(prompt, language="markdown")

            # Inject JavaScript untuk notifikasi klik tombol copy
            st.markdown("""
                <script>
                    setTimeout(() => {
                        const copyBtns = window.parent.document.querySelectorAll('[data-testid="stCopyButton"]');
                        copyBtns.forEach(btn => {
                            btn.addEventListener('click', () => {
                                const notice = document.createElement("div");
                                notice.innerText = "✅ Prompt copied to clipboard!";
                                notice.style.position = "fixed";
                                notice.style.bottom = "30px";
                                notice.style.right = "30px";
                                notice.style.backgroundColor = "#4CAF50";
                                notice.style.color = "white";
                                notice.style.padding = "10px 16px";
                                notice.style.borderRadius = "8px";
                                notice.style.boxShadow = "0 4px 6px rgba(0,0,0,0.2)";
                                notice.style.zIndex = "9999";
                                notice.style.fontSize = "14px";
                                document.body.appendChild(notice);
                                setTimeout(() => {
                                    notice.remove();
                                }, 2000);
                            });
                        });
                    }, 1000);
                </script>
            """, unsafe_allow_html=True)
    else:
        st.info("Please upload an image to generate a prompt.")