gmgsite/static/ytr.html

77 lines
1.8 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="en">
<head>
2023-05-10 10:54:03 +02:00
<meta charset="UTF-8"/>
2023-05-10 10:53:20 +02:00
<title>Video site chooser</title>
<link rel="icon" type="image/x-icon" href="favicon.ico">
<style>
2023-05-10 10:56:15 +02:00
html,
body {
2023-05-10 10:53:20 +02:00
height: 100%;
}
2023-05-10 10:53:20 +02:00
html {
display: table;
margin: auto;
}
2023-05-10 10:53:20 +02:00
body {
display: table-cell;
vertical-align: middle;
background-color: #000000;
color: white;
font: small-caption;
}
2023-05-10 10:53:20 +02:00
p {
text-align: center;
}
2023-05-10 10:53:20 +02:00
.button {
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
2023-05-10 10:56:15 +02:00
cursor: pointer;
2023-05-10 10:53:20 +02:00
}
2023-05-10 10:56:15 +02:00
#pipedbtn {background-color: darkred} /* Piped */
#ytbtn {background-color: red} /* YouTube */
#odybtn {background-color: purple} /* Odysee */
#ptbtn {background-color: darkorange} /* PeerTube */
2023-05-10 10:53:20 +02:00
</style>
</head>
<body>
2023-05-10 10:53:20 +02:00
<script async>
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const codeyt = urlParams.get('yt')
const codeody = urlParams.get('ody')
const codept = urlParams.get('pt')
2023-05-10 10:53:20 +02:00
function changeHref(type,suffix) {
let btn = document.getElementById(type+'btn');
btn.href+=suffix;
}
2023-05-10 10:53:20 +02:00
//wait for page to load before executing js, so the elements actually exist
window.addEventListener('load',()=>{
changeHref('yt',codeyt);
changeHref('piped',codeyt);
changeHref('pt',codept);
changeHref('ody',codeody);
});
</script>
2023-05-10 10:53:20 +02:00
<p>Where do you want to watch this video?</p>
<a id="pipedbtn" class="button" href="https://il.ax/embed/">Piped (il.ax)</a>
<a id="ytbtn" class="button" href="https://youtube.com/embed/">YouTube*</a>
<a id="odybtn" class="button" href="https://odysee.com/$/embed/@gianmarcogg03:e/">Odysee*</a>
<a id="ptbtn" class="button" href="https://peertube.uno/videos/embed/">PeerTube</a>
<p>* = not freedom and/or privacy respecting.</p>
</body>
</html>