Spaces:
Running
Running
| import subprocess | |
| import sys | |
| try: | |
| from flask import Flask, render_template_string | |
| except ImportError: | |
| subprocess.check_call([sys.executable, '-m', 'pip', 'install', 'flask']) | |
| from flask import Flask, render_template_string | |
| app = Flask(__name__) | |
| def home(): | |
| html_content = ''' | |
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Binaural Beats and Bindu Tratak</title> | |
| <style> | |
| body { | |
| margin: 0; | |
| padding: 0; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| height: 100vh; | |
| background: black; | |
| color: white; | |
| font-family: Arial, sans-serif; | |
| overflow: hidden; | |
| } | |
| .container { | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| text-align: center; | |
| } | |
| .dot { | |
| width: 20px; | |
| height: 20px; | |
| background-color: #ff0000; | |
| border-radius: 50%; | |
| margin: 20px 0; | |
| } | |
| .instructions { | |
| position: absolute; | |
| top: 10%; | |
| color: white; | |
| font-size: 1.2rem; | |
| background: rgba(0, 0, 0, 0.7); | |
| padding: 10px 15px; | |
| border-radius: 5px; | |
| text-align: center; | |
| } | |
| .instructions.hidden { | |
| display: none; | |
| } | |
| .controls-panel { | |
| position: absolute; | |
| right: 20px; | |
| top: 20px; | |
| background: rgba(0, 0, 0, 0.7); | |
| padding: 20px; | |
| border-radius: 10px; | |
| box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); | |
| backdrop-filter: blur(10px); | |
| display: none; | |
| flex-direction: column; | |
| max-height: 80vh; | |
| overflow-y: auto; | |
| } | |
| .controls-panel.visible { | |
| display: flex; | |
| } | |
| .controls-panel input, .controls-panel button, .controls-panel select { | |
| margin: 10px 0; | |
| padding: 10px; | |
| border: none; | |
| border-radius: 5px; | |
| } | |
| .controls-panel label { | |
| margin-top: 10px; | |
| } | |
| .toggle-controls { | |
| position: absolute; | |
| top: 20px; | |
| left: 20px; | |
| background: #ffffff30; | |
| color: white; | |
| border: none; | |
| padding: 10px 15px; | |
| border-radius: 5px; | |
| cursor: pointer; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <div class="instructions" id="instructions"> | |
| Focus on the bindu (dot) for meditation and relaxation. | |
| Adjust frequencies and bindu settings using the controls. | |
| </div> | |
| <div class="dot" id="bindu"></div> | |
| </div> | |
| <div class="controls-panel" id="controls-panel"> | |
| <label for="left-frequency">Left Ear Frequency:</label> | |
| <input type="range" id="left-frequency" min="20" max="2000" value="440"> | |
| <label for="right-frequency">Right Ear Frequency:</label> | |
| <input type="range" id="right-frequency" min="20" max="2000" value="446"> | |
| <label for="dot-size">Bindu Size:</label> | |
| <input type="range" id="dot-size" min="10" max="100" value="20"> | |
| <label for="presets">Quick Presets:</label> | |
| <select id="presets"> | |
| <option value="440-446">Focus (440Hz - 446Hz)</option> | |
| <option value="100-106">Relaxation (100Hz - 106Hz)</option> | |
| <option value="20-26">Deep Sleep (20Hz - 26Hz)</option> | |
| <option value="528-534">Healing (528Hz - 534Hz)</option> | |
| </select> | |
| <button id="apply-preset">Apply Preset</button> | |
| <button id="play-music">Play Music</button> | |
| </div> | |
| <button class="toggle-controls" id="toggle-controls">Show Controls</button> | |
| <script> | |
| const playMusicButton = document.getElementById('play-music'); | |
| const leftFrequencyInput = document.getElementById('left-frequency'); | |
| const rightFrequencyInput = document.getElementById('right-frequency'); | |
| const dotSizeInput = document.getElementById('dot-size'); | |
| const presets = document.getElementById('presets'); | |
| const applyPresetButton = document.getElementById('apply-preset'); | |
| const controlsPanel = document.getElementById('controls-panel'); | |
| const toggleControlsButton = document.getElementById('toggle-controls'); | |
| const instructions = document.getElementById('instructions'); | |
| const bindu = document.getElementById('bindu'); | |
| let audioContext = null; | |
| let leftOscillator = null; | |
| let rightOscillator = null; | |
| let isPlaying = false; | |
| let instructionsTimeout; | |
| function hideInstructions() { | |
| instructionsTimeout = setTimeout(() => { | |
| instructions.classList.add('hidden'); | |
| }, 5000); | |
| } | |
| function showInstructions() { | |
| clearTimeout(instructionsTimeout); | |
| instructions.classList.remove('hidden'); | |
| hideInstructions(); | |
| } | |
| function stopMusic() { | |
| if (audioContext) { | |
| audioContext.close(); | |
| audioContext = null; | |
| leftOscillator = null; | |
| rightOscillator = null; | |
| isPlaying = false; | |
| playMusicButton.textContent = 'Play Music'; | |
| } | |
| } | |
| function setupBinauralBeats(leftFreq, rightFreq) { | |
| audioContext = new (window.AudioContext || window.webkitAudioContext)(); | |
| leftOscillator = audioContext.createOscillator(); | |
| rightOscillator = audioContext.createOscillator(); | |
| const leftGain = audioContext.createGain(); | |
| const rightGain = audioContext.createGain(); | |
| leftOscillator.frequency.value = leftFreq; | |
| rightOscillator.frequency.value = rightFreq; | |
| leftGain.gain.value = 0.5; | |
| rightGain.gain.value = 0.5; | |
| leftOscillator.connect(leftGain).connect(audioContext.destination); | |
| rightOscillator.connect(rightGain).connect(audioContext.destination); | |
| leftOscillator.start(); | |
| rightOscillator.start(); | |
| } | |
| playMusicButton.addEventListener('click', () => { | |
| if (isPlaying) { | |
| stopMusic(); | |
| } else { | |
| setupBinauralBeats(leftFrequencyInput.value, rightFrequencyInput.value); | |
| playMusicButton.textContent = 'Stop Music'; | |
| isPlaying = true; | |
| } | |
| }); | |
| applyPresetButton.addEventListener('click', () => { | |
| const [left, right] = presets.value.split('-').map(Number); | |
| leftFrequencyInput.value = left; | |
| rightFrequencyInput.value = right; | |
| stopMusic(); // Stop music when a new preset is applied | |
| }); | |
| toggleControlsButton.addEventListener('click', () => { | |
| controlsPanel.classList.toggle('visible'); | |
| toggleControlsButton.textContent = controlsPanel.classList.contains('visible') | |
| ? 'Hide Controls' | |
| : 'Show Controls'; | |
| }); | |
| dotSizeInput.addEventListener('input', (e) => { | |
| const newSize = e.target.value + 'px'; | |
| bindu.style.width = newSize; | |
| bindu.style.height = newSize; | |
| }); | |
| document.addEventListener('mousemove', showInstructions); | |
| hideInstructions(); // Initial call to hide instructions after delay | |
| </script> | |
| </body> | |
| </html> | |
| ''' | |
| return render_template_string(html_content) | |
| if __name__ == '__main__': | |
| app.run(debug=True,host='0.0.0.0', port=7860) | |