system/serenity
system/serenity
1
0
Fork 0
mirror of https://github.com/SerenityOS/serenity synced 2024-07-21 18:15:58 +00:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

Base: Add options to the video test page to change its attributes

Browse source 
This is to allow testing autoplay, poster images, etc. without having to
stash local changes to the page. This also changes the URLs used on the
page to be relative to the page itself, to allow the page to load both
on Serenity and Lagom.
This commit is contained in:
Timothy Flynn 2023-04-20 08:41:39 -04:00 committed by Andreas Kling
parent 83bb24991b
commit 59a1a3f463
1 changed files with 41 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
Base/res/html/misc/video-webm.html
View file

@ -73,15 +73,44 @@
</tr>
</tbody>
</table>
<fieldset>
<legend>Select a video playback option:</legend>
<div>
<input type=radio id=option-default value=default name=options>
<label for=option-default>Default</label>
</div>
<div>
<input type=radio id=option-autoplay value=autoplay name=options>
<label for=option-autoplay>Autoplay</label>
</div>
<div>
<input type=radio id=option-poster value=poster name=options>
<label for=option-poster>Poster</label>
</div>
</fieldset>
</div>
<br />
<video id=video autoplay controls src="file:///home/anon/Videos/test-webm.webm"></video>
<video id=video controls src="../../../home/anon/Videos/test-webm.webm"></video>
<script type="text/javascript">
let video = document.getElementById('video');
const params = new URLSearchParams(document.location.search);
const option = params.get('option');
if (option === 'autoplay') {
document.getElementById('option-autoplay').setAttribute('checked', '');
video.setAttribute('autoplay', '');
} else if (option === 'poster') {
document.getElementById('option-poster').setAttribute('checked', '');
video.setAttribute('poster', '../../wallpapers/grid.png');
} else {
document.getElementById('option-default').setAttribute('checked', '');
}
video.videoTracks.onaddtrack = (event) => {
document.getElementById('id').textContent = event.track.id;
document.getElementById('selected').textContent = event.track.selected;
@ -112,6 +141,17 @@
document.getElementById('state').textContent = 'paused';
document.getElementById('ended').textContent = video.ended;
});
for (const option of document.getElementsByName('options')) {
option.addEventListener('change', function() {
if (!this.checked) {
return;
}
const location = `${window.location.pathname}?option=${this.value}`;
window.location.href = location;
});
}
</script>
</body>
</html>