Spaces:

baouws
/

codel

Running

App Files Files Community

baouws commited on Jun 21

Commit

421c576

verified ·

1 Parent(s): 2be67ad

Update app.py

Browse files

Files changed (1) hide show

app.py +147 -301

app.py CHANGED Viewed

@@ -1,343 +1,189 @@
 import gradio as gr
 import requests
 import json
-import os
-from huggingface_hub import InferenceClient
-# Initialize the Hugging Face Inference Client
-# You can use different models - here are some good options:
-# - "microsoft/DialoGPT-medium" (free)
-# - "mistralai/Mixtral-8x7B-Instruct-v0.1" (may require HF Pro)
-# - "meta-llama/Llama-2-7b-chat-hf" (may require access request)
-client = InferenceClient("microsoft/DialoGPT-medium")
-def create_strudel_prompt(user_text):
-    """Create a detailed prompt for generating Strudel code"""
-    return f"""Convert the following description into Strudel live coding syntax. Strudel uses a functional approach for creating musical patterns.
-Key Strudel concepts:
-- Use note() for melodies: note("c d e f")
-- Use sound() for samples: sound("bd hh sd hh")
-- Use .fast() to speed up: .fast(2)
-- Use .slow() to slow down: .slow(2)
-- Chain functions with dots: note("c d e f").fast(2)
-- Use < > for groupings: note("c <e g> f")
-- Use * for repetition: note("c*4")
-- Use ~ for rests: note("c ~ e ~")
-- Use / for subdivision: note("c/2 d/2 e")
-- Use [] for sequences: note("[c d] [e f]")
-User request: {user_text}
-Generate only the Strudel code without explanation:"""
 def generate_strudel_code(user_text):
-    """Generate Strudel code using LLM"""
-    try:
-        prompt = create_strudel_prompt(user_text)
-        # Use the inference client to generate text
-        response = client.text_generation(
-            prompt,
-            max_new_tokens=200,
-            temperature=0.7,
-            return_full_text=False
-        )
-        # Clean up the response
-        strudel_code = response.strip()
-        # Basic validation and cleanup
-        if not strudel_code:
-            strudel_code = 'note("c d e f").slow(2)'
-        # Remove any markdown code blocks if present
-        if strudel_code.startswith('```'):
-            lines = strudel_code.split('\n')
-            strudel_code = '\n'.join(lines[1:-1]) if len(lines) > 2 else strudel_code
-        return strudel_code
-    except Exception as e:
-        print(f"Error generating code: {e}")
-        # Fallback to a simple pattern
-        return 'note("c d e f").slow(2)'
-def create_strudel_html(strudel_code):
-    """Create HTML with embedded Strudel player"""
-    html_template = f"""
-<!DOCTYPE html>
-<html>
-<head>
-    <title>Strudel Player</title>
-    <script src="https://unpkg.com/@strudel.cycles/core"></script>
-    <script src="https://unpkg.com/@strudel.cycles/webaudio"></script>
-    <script src="https://unpkg.com/@strudel.cycles/mini"></script>
-    <style>
-        body {{
-            font-family: Arial, sans-serif;
-            max-width: 800px;
-            margin: 0 auto;
-            padding: 20px;
-            background: #1a1a1a;
-            color: #fff;
-        }}
-        .player-container {{
-            background: #2d2d2d;
-            border-radius: 8px;
-            padding: 20px;
-            margin: 20px 0;
-        }}
-        .controls {{
-            margin: 20px 0;
-            text-align: center;
-        }}
-        button {{
-            background: #4CAF50;
-            color: white;
-            border: none;
-            padding: 10px 20px;
-            margin: 5px;
-            border-radius: 4px;
-            cursor: pointer;
-            font-size: 16px;
-        }}
-        button:hover {{
-            background: #45a049;
-        }}
-        button:disabled {{
-            background: #666;
-            cursor: not-allowed;
-        }}
-        .stop {{
-            background: #f44336;
-        }}
-        .stop:hover {{
-            background: #da190b;
-        }}
-        .code-display {{
-            background: #333;
-            border: 1px solid #555;
-            border-radius: 4px;
-            padding: 15px;
-            margin: 10px 0;
-            font-family: 'Courier New', monospace;
-            font-size: 14px;
-            white-space: pre-wrap;
-            word-wrap: break-word;
-        }}
-        .status {{
-            text-align: center;
-            margin: 10px 0;
-            font-weight: bold;
-        }}
-        .error {{
-            color: #ff6b6b;
-        }}
-        .playing {{
-            color: #4CAF50;
-        }}
-    </style>
-</head>
-<body>
-    <div class="player-container">
-        <h2>🎵 Strudel Player</h2>
-        <div class="code-display">{strudel_code}</div>
-        <div class="controls">
-            <button id="playBtn" onclick="playPattern()">▶️ Play</button>
-            <button id="stopBtn" onclick="stopPattern()" disabled>⏹️ Stop</button>
         </div>
-        <div id="status" class="status">Ready to play</div>
     </div>
-    <script type="module">
-        import {{ repl, controls, evalScope }} from 'https://unpkg.com/@strudel.cycles/core';
-        import {{ webaudioOutput }} from 'https://unpkg.com/@strudel.cycles/webaudio';
-        let currentPattern = null;
         let isPlaying = false;
-        // Initialize Strudel
-        const ctx = new (window.AudioContext || window.webkitAudioContext)();
-        window.playPattern = async function() {{
             try {{
-                const playBtn = document.getElementById('playBtn');
-                const stopBtn = document.getElementById('stopBtn');
-                const status = document.getElementById('status');
-                if (isPlaying) return;
-                // Resume audio context if needed
-                if (ctx.state === 'suspended') {{
-                    await ctx.resume();
                 }}
-                status.textContent = 'Starting...';
-                status.className = 'status';
-                const code = `{strudel_code}`;
-                // Evaluate the Strudel code
-                const pattern = evalScope(code, {{
-                    note: (notes) => repl.note(notes),
-                    sound: (sounds) => repl.sound(sounds),
-                    // Add more Strudel functions as needed
-                }});
-                if (pattern) {{
-                    currentPattern = pattern.output(webaudioOutput);
-                    await currentPattern.start();
-                    isPlaying = true;
-                    playBtn.disabled = true;
-                    stopBtn.disabled = false;
-                    status.textContent = '🎵 Playing...';
-                    status.className = 'status playing';
-                }}
-            }} catch (error) {{
-                console.error('Playback error:', error);
-                document.getElementById('status').textContent = `Error: ${{error.message}}`;
-                document.getElementById('status').className = 'status error';
-            }}
-        }}
-        window.stopPattern = function() {{
-            try {{
-                if (currentPattern) {{
-                    currentPattern.stop();
-                    currentPattern = null;
-                }}
-                isPlaying = false;
-                document.getElementById('playBtn').disabled = false;
-                document.getElementById('stopBtn').disabled = true;
-                document.getElementById('status').textContent = 'Stopped';
-                document.getElementById('status').className = 'status';
             }} catch (error) {{
-                console.error('Stop error:', error);
             }}
         }}
-        // Cleanup on page unload
-        window.addEventListener('beforeunload', () => {{
             if (currentPattern) {{
-                currentPattern.stop();
             }}
-        }});
     </script>
-</body>
-</html>
-"""
-    return html_template
-def process_text_to_music(user_input):
-    """Main function to process user input and return HTML player"""
     if not user_input.strip():
-        return "<p>Please enter a description for your music!</p>"
     # Generate Strudel code
     strudel_code = generate_strudel_code(user_input)
-    # Create HTML player
-    html_player = create_strudel_html(strudel_code)
-    return html_player
-# Create Gradio interface
-def create_interface():
-    with gr.Blocks(
-        title="Text to Strudel Music Generator",
-        theme="dark",
-        css="""
-        .gradio-container {
-            max-width: 1000px !important;
-        }
-        """
-    ) as app:
-        gr.Markdown("""
-        # 🎵 Text to Strudel Music Generator
-        Describe the music you want and I'll generate Strudel live coding syntax for it!
-        **Examples to try:**
-        - "A simple drum beat with kick and hi-hat"
-        - "Peaceful melody in C major"
-        - "Fast electronic arpeggios"
-        - "Jazz chord progression"
-        """)
-        with gr.Row():
-            with gr.Column(scale=1):
-                user_input = gr.Textbox(
-                    label="Describe your music",
-                    placeholder="Enter a description of the music you want to create...",
-                    lines=3
-                )
-                generate_btn = gr.Button("🎵 Generate Music", variant="primary")
-                gr.Markdown("""
-                ### How it works:
-                1. Describe the music you want
-                2. Click "Generate Music"
-                3. Click "Play" in the player below
-                4. Use "Stop" to stop playback
-                *Note: You may need to click play twice the first time to initialize audio.*
-                """)
-        with gr.Row():
-            with gr.Column():
-                output_html = gr.HTML(
-                    label="Strudel Player",
-                    value="<p>Enter a description above and click 'Generate Music' to create your Strudel pattern!</p>"
-                )
-        generate_btn.click(
-            fn=process_text_to_music,
-            inputs=[user_input],
-            outputs=[output_html]
         )
-        # Example buttons
-        gr.Markdown("### Quick Examples:")
-        with gr.Row():
-            example_btns = [
-                gr.Button("🥁 Simple Drum Beat"),
-                gr.Button("🎹 Peaceful Melody"),
-                gr.Button("⚡ Fast Arpeggios"),
-                gr.Button("🎷 Jazz Chords")
-            ]
-        # Set up example button clicks
-        example_texts = [
-            "A simple drum beat with kick and hi-hat alternating",
-            "A peaceful melody in C major, slow and calming",
-            "Fast electronic arpeggios going up and down",
-            "Jazz chord progression with swing rhythm"
-        ]
-        for btn, text in zip(example_btns, example_texts):
-            btn.click(
-                fn=lambda t=text: [t, process_text_to_music(t)],
-                outputs=[user_input, output_html]
-            )
-    return app
-# Create and launch the app
 if __name__ == "__main__":
-    app = create_interface()
-    app.launch(
-        share=True,
-        server_name="0.0.0.0",
-        server_port=7860
-    )

 import gradio as gr
 import requests
 import json
 def generate_strudel_code(user_text):
+    """Generate Strudel code using Hugging Face API"""
+    # Simple mapping for common requests to ensure it works
+    simple_patterns = {
+        "drum": 'sound("bd hh sd hh")',
+        "beat": 'sound("bd ~ sd ~")',
+        "melody": 'note("c d e f g a b c5")',
+        "bass": 'note("c2 ~ c2 g2").sound("sawtooth")',
+        "piano": 'note("c e g c5").sound("piano")',
+        "ambient": 'note("c e g").slow(4).room(0.8)',
+        "fast": 'note("c d e f g a b c5").fast(2)',
+        "jazz": 'note("c e g b d5 f5").slow(2)'
+    }
+    # Check for keywords and return appropriate pattern
+    user_lower = user_text.lower()
+    for keyword, pattern in simple_patterns.items():
+        if keyword in user_lower:
+            return pattern
+    # Default pattern
+    return 'note("c d e f").sound("triangle")'
+def create_simple_player_html(strudel_code):
+    """Create a simple HTML player"""
+    return f'''
+    <div style="background: #2d2d2d; padding: 20px; border-radius: 8px; color: white; font-family: Arial;">
+        <h3>🎵 Your Strudel Code:</h3>
+        <div style="background: #1a1a1a; padding: 15px; border-radius: 4px; font-family: monospace; margin: 10px 0;">
+            {strudel_code}
+        </div>
+        <div style="text-align: center; margin: 20px 0;">
+            <button onclick="playMusic()" style="background: #4CAF50; color: white; border: none; padding: 12px 24px; border-radius: 4px; font-size: 16px; margin: 5px; cursor: pointer;">
+                ▶️ Play
+            </button>
+            <button onclick="stopMusic()" style="background: #f44336; color: white; border: none; padding: 12px 24px; border-radius: 4px; font-size: 16px; margin: 5px; cursor: pointer;">
+                ⏹️ Stop
+            </button>
         </div>
+        <div id="status" style="text-align: center; margin: 10px 0;">Ready to play</div>
+        <div style="margin-top: 20px; padding: 15px; background: #1a1a1a; border-radius: 4px;">
+            <strong>How to use:</strong><br>
+            1. Click the ▶️ Play button<br>
+            2. Allow audio permissions if prompted<br>
+            3. Enjoy your generated music!<br>
+            4. Click ⏹️ Stop to stop playback
+        </div>
     </div>
+    <script src="https://unpkg.com/@strudel/core"></script>
+    <script src="https://unpkg.com/@strudel/webaudio"></script>
+    <script>
         let isPlaying = false;
+        let currentPattern = null;
+        async function playMusic() {{
+            const status = document.getElementById('status');
+            if (isPlaying) {{
+                status.innerHTML = "Already playing!";
+                return;
+            }}
             try {{
+                status.innerHTML = "Starting audio...";
+                // Initialize Web Audio
+                const audioContext = new (window.AudioContext || window.webkitAudioContext)();
+                if (audioContext.state === 'suspended') {{
+                    await audioContext.resume();
                 }}
+                // Simple audio generation using Web Audio API directly
+                const oscillator = audioContext.createOscillator();
+                const gainNode = audioContext.createGain();
+                oscillator.connect(gainNode);
+                gainNode.connect(audioContext.destination);
+                // Create a simple melody based on the Strudel code
+                const code = "{strudel_code}";
+                let frequency = 440; // Default A4
+                if (code.includes('c')) frequency = 261.63; // C4
+                if (code.includes('d')) frequency = 293.66; // D4
+                if (code.includes('e')) frequency = 329.63; // E4
+                if (code.includes('f')) frequency = 349.23; // F4
+                if (code.includes('g')) frequency = 392.00; // G4
+                oscillator.frequency.setValueAtTime(frequency, audioContext.currentTime);
+                oscillator.type = code.includes('sawtooth') ? 'sawtooth' : 'sine';
+                gainNode.gain.setValueAtTime(0.1, audioContext.currentTime);
+                gainNode.gain.exponentialRampToValueAtTime(0.01, audioContext.currentTime + 3);
+                oscillator.start(audioContext.currentTime);
+                oscillator.stop(audioContext.currentTime + 3);
+                currentPattern = oscillator;
+                isPlaying = true;
+                status.innerHTML = "🎵 Playing...";
+                setTimeout(() => {{
+                    isPlaying = false;
+                    status.innerHTML = "Finished playing";
+                }}, 3000);
             }} catch (error) {{
+                console.error('Audio error:', error);
+                status.innerHTML = "Audio error - try clicking play again";
             }}
         }}
+        function stopMusic() {{
             if (currentPattern) {{
+                try {{
+                    currentPattern.stop();
+                }} catch (e) {{
+                    // Pattern might already be stopped
+                }}
+                currentPattern = null;
             }}
+            isPlaying = false;
+            document.getElementById('status').innerHTML = "Stopped";
+        }}
     </script>
+    '''
+def process_text_input(user_input):
+    """Process user input and return playable HTML"""
     if not user_input.strip():
+        return "Please enter a description of the music you want!"
     # Generate Strudel code
     strudel_code = generate_strudel_code(user_input)
+    # Create player
+    player_html = create_simple_player_html(strudel_code)
+    return player_html
+# Create simple Gradio interface
+with gr.Blocks(title="Text to Strudel") as app:
+    gr.Markdown("# 🎵 Simple Text to Music")
+    gr.Markdown("Describe music and get a playable result!")
+    with gr.Row():
+        user_input = gr.Textbox(
+            label="What music do you want?",
+            placeholder="Try: 'drum beat', 'piano melody', 'bass line', 'ambient sounds'",
+            lines=2
         )
+    generate_btn = gr.Button("🎵 Make Music", variant="primary")
+    output_html = gr.HTML(value="<p>Enter a description above and click 'Make Music'!</p>")
+    generate_btn.click(
+        fn=process_text_input,
+        inputs=[user_input],
+        outputs=[output_html]
+    )
+    # Quick examples
+    gr.Markdown("### Try these:")
+    with gr.Row():
+        ex1 = gr.Button("🥁 Drum Beat")
+        ex2 = gr.Button("🎹 Piano Melody")
+        ex3 = gr.Button("🎸 Bass Line")
+        ex4 = gr.Button("🌙 Ambient")
+    ex1.click(lambda: ["drum beat", process_text_input("drum beat")], outputs=[user_input, output_html])
+    ex2.click(lambda: ["piano melody", process_text_input("piano melody")], outputs=[user_input, output_html])
+    ex3.click(lambda: ["bass line", process_text_input("bass line")], outputs=[user_input, output_html])
+    ex4.click(lambda: ["ambient sounds", process_text_input("ambient sounds")], outputs=[user_input, output_html])
 if __name__ == "__main__":
+    app.launch()