frontend

EdmundC

Oct 11th, 2024

Never

Add comment

Not a member of Pastebin yet? Sign Up, it unlocks many cool features!

HTML 2.26 KB | None | 0 0

raw download clone embed print report

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Synth App</title>
<script>
function sendForm() {
const title = document.getElementById("title").value;
const bpm = document.getElementById("bpm").value;
const voicePath = document.getElementById("voice-path").value;
const melody = document.getElementById("melody").value;
const microtones = document.getElementById("microtones").value;
const data = { title, bpm, voicePath, melody, microtones };
fetch('/submit', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
}).then(response => response.json()).then(result => {
console.log(result);
});
}
function downloadVoice() {
const url = document.getElementById("voice-url").value;
const link = document.createElement("a");
link.href = url;
link.download = url.split('/').pop();
link.click();
}
</script>
</head>
<body>
<h1>Welcome to Synth App</h1>
<label for="title">Piece Title:</label>
<input type="text" id="title" placeholder="Enter title">
<br>
<label for="bpm">BPM:</label>
<input type="text" id="bpm" placeholder="Enter BPM">
<br>
<label for="voice-url">Voice Download URL:</label>
<input type="text" id="voice-url" placeholder="Enter URL to download voice">
<button onclick="downloadVoice()">Download Voice</button>
<br>
<label for="voice-path">Voice File Path:</label>
<input type="text" id="voice-path" placeholder="Enter voice file path">
<br>
<label for="melody">Melody:</label>
<input type="text" id="melody" placeholder="Enter melody (e.g., Bb 1/4 C 1/4)">
<br>
<label for="microtones">Microtones:</label>
<input type="text" id="microtones" placeholder="e.g., 300hz 1/8">
<br>
<button onclick="sendForm()">Submit</button>
<h2>Options</h2>
<button>Add Voice</button>
<button>Edit Melody</button>
</body>
</html>

Add Comment

Please, Sign In to add comment