import streamlit as st
import cv2
import numpy as np
import datetime
import os
import time
import base64
import re
import glob
from camera_input_live import camera_input_live

# Set wide layout
st.set_page_config(layout="wide")

# Decorator for caching images
@st.cache(allow_output_mutation=True)
def get_image_count():
    return {'count': 0}

# Function Definitions for Camera Feature
def save_image(image, image_count):
    timestamp = datetime.datetime.now().strftime("%Y%m%d_%H%M%S")
    filename = f"captured_image_{timestamp}_{image_count['count']}.png"
    image_count['count'] += 1
    bytes_data = image.getvalue()
    cv2_img = cv2.imdecode(np.frombuffer(bytes_data, np.uint8), cv2.IMREAD_COLOR)
    cv2.imwrite(filename, cv2_img)
    return filename

# Other function definitions...

# Main Function
def main():
    # Layout Configuration
    col1, col2, col3 = st.columns([2, 3, 5])

    # Camera Section
    with col1:
        st.title("Real-Time Camera Stream")
        st.header("QR code reader ready.")

        snapshot_interval = st.slider("Snapshot Interval (seconds)", 1, 10, 5)
        image_placeholder = st.empty()

        if 'captured_images' not in st.session_state:
            st.session_state['captured_images'] = []
        if 'last_captured' not in st.session_state:
            st.session_state['last_captured'] = time.time()

        image = camera_input_live()
        if image is not None:
            image_placeholder.image(image)

            if time.time() - st.session_state['last_captured'] > snapshot_interval:
                image_count = get_image_count()
                filename = save_image(image, image_count)
                st.session_state['captured_images'].append(filename)
                st.session_state['last_captured'] = time.time()

        sidebar_html = "<div style='display:flex;flex-direction:column;'>"
        for img_file in st.session_state['captured_images']:
            image_base64 = get_image_base64(img_file)
            sidebar_html += f"<img src='data:image/png;base64,{image_base64}' style='width:100px;'><br>"
        sidebar_html += "</div>"
        st.sidebar.markdown("## Captured Images")
        st.sidebar.markdown(sidebar_html, unsafe_allow_html=True)

        # JavaScript Timer
        st.markdown(f"<script>setInterval(function() {{ document.getElementById('timer').innerHTML = new Date().toLocaleTimeString(); }}, 1000);</script><div>Current Time: <span id='timer'></span></div>", unsafe_allow_html=True)

    # Chord Sheet Section
    with col2:
        # ... (Chord Sheet section remains unchanged) ...

    # Trigger a rerun only when the snapshot interval is reached
    if 'last_captured' in st.session_state and time.time() - st.session_state['last_captured'] > snapshot_interval:
        st.experimental_rerun()

if __name__ == "__main__":
    main()