You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
98 lines
3.0 KiB
JavaScript
98 lines
3.0 KiB
JavaScript
function renderPlaylist(playlist) {
|
|
const playlistDiv = document.getElementById('playlist');
|
|
|
|
const fragment = document.createDocumentFragment();
|
|
|
|
const tableHeader = document.createElement('tr');
|
|
tableHeader.innerHTML = '<th>X</th><th>Y</th><th>Zoom 0-16384</th><th>Pan Speed 1-18</th><th>Tilt Speed 1-14</th><th>Delay</th>';
|
|
fragment.appendChild(tableHeader);
|
|
|
|
for (let i = 0; i < playlist.length; i++) {
|
|
const row = document.createElement('tr');
|
|
|
|
row.innerHTML = `
|
|
<td><input type="number" value="${playlist[i].x}"></td>
|
|
<td><input type="number" value="${playlist[i].y}"></td>
|
|
<td><input type="number" value="${playlist[i].zoom}"></td>
|
|
<td><input type="number" value="${playlist[i].vs}"></td>
|
|
<td><input type="number" value="${playlist[i].hs}"></td>
|
|
<td><input type="number" value="${playlist[i].delay}"></td>
|
|
<td><button onclick="setPost(${i})">Goto</button></td>
|
|
<td><button onclick="this.parentElement.parentElement.remove()">Remove</button></td>
|
|
`;
|
|
|
|
fragment.appendChild(row);
|
|
}
|
|
|
|
playlistDiv.replaceChildren(fragment);
|
|
}
|
|
|
|
async function fetchPlaylist() {
|
|
const response = await fetch('/playlist');
|
|
const playlist = await response.json();
|
|
|
|
return playlist;
|
|
}
|
|
|
|
async function main() {
|
|
renderPlaylist(await fetchPlaylist());
|
|
}
|
|
|
|
main();
|
|
|
|
async function setPost(index) {
|
|
const playlistDiv = document.getElementById('playlist');
|
|
const row = playlistDiv.children[index + 1];
|
|
const inputs = row.children;
|
|
const x = parseInt(inputs[0].children[0].value);
|
|
const y = parseInt(inputs[1].children[0].value);
|
|
const zoom = parseInt(inputs[2].children[0].value);
|
|
const vs = parseInt(inputs[3].children[0].value);
|
|
const hs = parseInt(inputs[4].children[0].value);
|
|
|
|
const response = await fetch('/setpos', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify({ x, y, zoom, vs, hs })
|
|
});
|
|
}
|
|
|
|
function getPlaylist() {
|
|
const playlist = [];
|
|
const playlistDiv = document.getElementById('playlist');
|
|
const children = playlistDiv.children;
|
|
for (let i = 1; i < children.length; i++) {
|
|
const row = children[i];
|
|
const inputs = row.children;
|
|
playlist.push({
|
|
x: parseInt(inputs[0].children[0].value),
|
|
y: parseInt(inputs[1].children[0].value),
|
|
zoom: parseInt(inputs[2].children[0].value),
|
|
vs: parseInt(inputs[3].children[0].value),
|
|
hs: parseInt(inputs[4].children[0].value),
|
|
delay: parseInt(inputs[5].children[0].value)
|
|
});
|
|
}
|
|
|
|
return playlist;
|
|
}
|
|
|
|
async function sendPlaylist(playlist) {
|
|
const response = await fetch('/playlist', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify(playlist)
|
|
});
|
|
}
|
|
|
|
document.getElementById('update').addEventListener('click', () => { sendPlaylist(getPlaylist()); });
|
|
document.getElementById('run').addEventListener('click', () => fetch('/run', { method: 'POST' }));
|
|
document.getElementById('addRow').addEventListener('click', () => {
|
|
let playlist = getPlaylist();
|
|
playlist.push({ x: 0, y: 0, zoom: 0, vs: 18, hs: 14, delay: 1000 });
|
|
renderPlaylist(playlist);
|
|
}); |