Create app.py

app.py

@@ -0,0 +1,142 @@
+import streamlit as st
+from streamlit.components.v1 import html
+import base64
+import os
+
+# Streamlit UI
+st.title("Project Shazam - Audio Input")
+
+# Option to upload or record audio
+option = st.radio("Choose an option:", ("Upload Audio File", "Record Audio"))
+
+# Function to save audio data to a file
+def save_audio(audio_data, filename="/tmp/input_audio"):
+    audio_bytes = base64.b64decode(audio_data)
+    with open(filename, "wb") as f:
+        f.write(audio_bytes)
+    return filename
+
+# Upload Audio File
+if option == "Upload Audio File":
+    uploaded_file = st.file_uploader("Upload any audio file (up to 2 minutes recommended)", type=None)
+    if uploaded_file is not None:
+        # Determine file extension and MIME type
+        file_extension = uploaded_file.name.split('.')[-1].lower()
+        mime_types = {
+            "mp3": "audio/mpeg",
+            "wav": "audio/wav",
+            "ogg": "audio/ogg",
+            "m4a": "audio/mp4",
+            "flac": "audio/flac"
+        }
+        mime_type = mime_types.get(file_extension, "audio/mpeg")  # Default to MP3 if unknown
+        filename = f"/tmp/uploaded_audio.{file_extension}"
+        
+        # Save uploaded file
+        with open(filename, "wb") as f:
+            f.write(uploaded_file.read())
+        st.success(f"Audio uploaded and saved as '{os.path.basename(filename)}'!")
+        
+        # HTML5 audio player with controls
+        audio_player_html = f"""
+        <audio controls>
+            <source src="data:{mime_type};base64,{base64.b64encode(open(filename, 'rb').read()).decode()}" type="{mime_type}">
+            Your browser does not support the audio element.
+        </audio>
+        """
+        st.markdown("### Listen to Uploaded Audio:")
+        html(audio_player_html)
+
+# Record Audio
+elif option == "Record Audio":
+    st.write("Record audio (up to 2 minutes):")
+
+    # HTML and JavaScript for recording with live timer
+    audio_recorder_html = """
+    <script>
+    let mediaRecorder;
+    let audioChunks = [];
+    let startTime;
+    let timerInterval;
+
+    function startRecording() {
+        navigator.mediaDevices.getUserMedia({ audio: true })
+            .then(stream => {
+                mediaRecorder = new MediaRecorder(stream);
+                mediaRecorder.start();
+                audioChunks = [];
+                startTime = Date.now();
+                document.getElementById("status").innerText = "Recording: 00:00";
+                timerInterval = setInterval(updateTimer, 1000);
+                mediaRecorder.ondataavailable = event => {
+                    audioChunks.push(event.data);
+                };
+                mediaRecorder.onstop = () => {
+                    const audioBlob = new Blob(audioChunks, { type: 'audio/wav' });
+                    const audioBase64 = blobToBase64(audioBlob).then(base64 => {
+                        window.parent.postMessage({ type: 'audio', data: base64 }, '*');
+                    });
+                    clearInterval(timerInterval);
+                    document.getElementById("status").innerText = "Recording stopped";
+                };
+                setTimeout(() => {
+                    if (mediaRecorder.state !== "inactive") {
+                        mediaRecorder.stop();
+                    }
+                }, 120000);  // Max 2 minutes = 120,000 ms
+            })
+            .catch(error => {
+                document.getElementById("status").innerText = "Error: " + error.message;
+            });
+    }
+
+    function stopRecording() {
+        if (mediaRecorder && mediaRecorder.state !== "inactive") {
+            mediaRecorder.stop();
+        }
+    }
+
+    function updateTimer() {
+        const elapsed = Math.floor((Date.now() - startTime) / 1000);
+        const minutes = Math.floor(elapsed / 60).toString().padStart(2, '0');
+        const seconds = (elapsed % 60).toString().padStart(2, '0');
+        document.getElementById("status").innerText = `Recording: ${minutes}:${seconds}`;
+    }
+
+    function blobToBase64(blob) {
+        return new Promise((resolve) => {
+            const reader = new FileReader();
+            reader.onloadend = () => resolve(reader.result.split(',')[1]);
+            reader.readAsDataURL(blob);
+        });
+    }
+    </script>
+    <button onclick="startRecording()">Start Recording</button>
+    <button onclick="stopRecording()">Stop Recording</button>
+    <p id="status">Press Start to record</p>
+    """
+
+    # Embed the recorder
+    audio_data = None
+    if html(audio_recorder_html, height=200):
+        message = st.session_state.get("message", None)
+        if message and message["type"] == "audio":
+            audio_data = message["data"]
+
+    if audio_data:
+        audio_path = save_audio(audio_data, "/tmp/recorded_audio.wav")
+        st.success("Audio recorded and saved as 'recorded_audio.wav'!")
+        # HTML5 audio player with controls
+        audio_player_html = f"""
+        <audio controls>
+            <source src="data:audio/wav;base64,{base64.b64encode(open(audio_path, 'rb').read()).decode()}" type="audio/wav">
+            Your browser does not support the audio element.
+        </audio>
+        """
+        st.markdown("### Listen to Recorded Audio:")
+        html(audio_player_html)
+
+def on_message(message):
+    st.session_state["message"] = message
+
+st.session_state["on_message"] = on_message