added html pages
This commit is contained in:
74
examples/bayern.html
Normal file
74
examples/bayern.html
Normal file
@ -0,0 +1,74 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Live Stream Player</title>
|
||||
<style>
|
||||
body, html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background-color: black; /* Hintergrundfarbe auf Schwarz setzen */
|
||||
}
|
||||
|
||||
#video-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#fullscreen-button {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
z-index: 999;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="video-container">
|
||||
<video id="videoPlayer" controls autoplay playsinline muted></video>
|
||||
<button id="fullscreen-button">Fullscreen</button>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
|
||||
<script>
|
||||
const videoPlayer = document.getElementById('videoPlayer');
|
||||
const fullscreenButton = document.getElementById('fullscreen-button');
|
||||
|
||||
fullscreenButton.addEventListener('click', () => {
|
||||
if (videoPlayer.requestFullscreen) {
|
||||
videoPlayer.requestFullscreen();
|
||||
} else if (videoPlayer.mozRequestFullScreen) { /* Firefox */
|
||||
videoPlayer.mozRequestFullScreen();
|
||||
} else if (videoPlayer.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
|
||||
videoPlayer.webkitRequestFullscreen();
|
||||
} else if (videoPlayer.msRequestFullscreen) { /* IE/Edge */
|
||||
videoPlayer.msRequestFullscreen();
|
||||
}
|
||||
});
|
||||
|
||||
// Add event listener when video ends to loop it
|
||||
videoPlayer.addEventListener('ended', function() {
|
||||
this.load();
|
||||
this.play();
|
||||
});
|
||||
|
||||
// Check if HLS.js is supported
|
||||
if (Hls.isSupported()) {
|
||||
const hls = new Hls();
|
||||
hls.loadSource('https://brevent.akamaized.net/hls/live/2028222-b/event_05/master_1280p_3328.m3u8');
|
||||
hls.attachMedia(videoPlayer);
|
||||
} else {
|
||||
console.error('HLS not supported');
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
47
examples/brocken-pano.html
Normal file
47
examples/brocken-pano.html
Normal file
@ -0,0 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Fullscreen Embedded Page</title>
|
||||
<style>
|
||||
body, html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<iframe src="https://webtv.feratel.com/webtv/?design=v4&pg=5EB12424-7C2D-428A-BEFF-0C9140CD772F&cam=3177" id="embedded-frame"></iframe>
|
||||
|
||||
<script>
|
||||
const iframe = document.getElementById('embedded-frame');
|
||||
|
||||
// Function to request fullscreen
|
||||
function requestFullscreen(element) {
|
||||
if (element.requestFullscreen) {
|
||||
element.requestFullscreen();
|
||||
} else if (element.mozRequestFullScreen) { /* Firefox */
|
||||
element.mozRequestFullScreen();
|
||||
} else if (element.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
|
||||
element.webkitRequestFullscreen();
|
||||
} else if (element.msRequestFullscreen) { /* IE/Edge */
|
||||
element.msRequestFullscreen();
|
||||
}
|
||||
}
|
||||
|
||||
// Request fullscreen when the document is loaded
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
requestFullscreen(iframe);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
74
examples/torfhaus.html
Normal file
74
examples/torfhaus.html
Normal file
@ -0,0 +1,74 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Live Stream Player</title>
|
||||
<style>
|
||||
body, html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background-color: black; /* Hintergrundfarbe auf Schwarz setzen */
|
||||
}
|
||||
|
||||
#video-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#fullscreen-button {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
z-index: 999;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="video-container">
|
||||
<video id="videoPlayer" controls autoplay playsinline muted></video>
|
||||
<button id="fullscreen-button">Fullscreen</button>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
|
||||
<script>
|
||||
const videoPlayer = document.getElementById('videoPlayer');
|
||||
const fullscreenButton = document.getElementById('fullscreen-button');
|
||||
|
||||
fullscreenButton.addEventListener('click', () => {
|
||||
if (videoPlayer.requestFullscreen) {
|
||||
videoPlayer.requestFullscreen();
|
||||
} else if (videoPlayer.mozRequestFullScreen) { /* Firefox */
|
||||
videoPlayer.mozRequestFullScreen();
|
||||
} else if (videoPlayer.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
|
||||
videoPlayer.webkitRequestFullscreen();
|
||||
} else if (videoPlayer.msRequestFullscreen) { /* IE/Edge */
|
||||
videoPlayer.msRequestFullscreen();
|
||||
}
|
||||
});
|
||||
|
||||
// Add event listener when video ends to loop it
|
||||
videoPlayer.addEventListener('ended', function() {
|
||||
this.load();
|
||||
this.play();
|
||||
});
|
||||
|
||||
// Check if HLS.js is supported
|
||||
if (Hls.isSupported()) {
|
||||
const hls = new Hls();
|
||||
hls.loadSource('https://ch-fra-n16.livespotting.com/vpu/qjkdtjva/4ctm3g1a_720.m3u8');
|
||||
hls.attachMedia(videoPlayer);
|
||||
} else {
|
||||
console.error('HLS not supported');
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
47
examples/wernigerode-pano.html
Normal file
47
examples/wernigerode-pano.html
Normal file
@ -0,0 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Fullscreen Embedded Page</title>
|
||||
<style>
|
||||
body, html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<iframe src="https://webtv.feratel.com/webtv/?cam=3175&t=1&design=v4&c0=0&c2=0&c39=1&c40=0&lg=de&pg=5EB12424-7C2D-428A-BEFF-0C9140CD772F&s=0" id="embedded-frame"></iframe>
|
||||
|
||||
<script>
|
||||
const iframe = document.getElementById('embedded-frame');
|
||||
|
||||
// Function to request fullscreen
|
||||
function requestFullscreen(element) {
|
||||
if (element.requestFullscreen) {
|
||||
element.requestFullscreen();
|
||||
} else if (element.mozRequestFullScreen) { /* Firefox */
|
||||
element.mozRequestFullScreen();
|
||||
} else if (element.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
|
||||
element.webkitRequestFullscreen();
|
||||
} else if (element.msRequestFullscreen) { /* IE/Edge */
|
||||
element.msRequestFullscreen();
|
||||
}
|
||||
}
|
||||
|
||||
// Request fullscreen when the document is loaded
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
requestFullscreen(iframe);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
46
examples/wetter-wernigerode.html
Normal file
46
examples/wetter-wernigerode.html
Normal file
@ -0,0 +1,46 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<style>
|
||||
body, html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<iframe src="https://radar.wo-cloud.com/desktop/rr/interactive?wry=51.83,10.78&wrn=V2VybmlnZXJvZGU%3D&wrg=10454&wrf=true&wrx=51.83,10.78&wro=true&wrm=8" id="embedded-frame"></iframe>
|
||||
|
||||
<script>
|
||||
const iframe = document.getElementById('embedded-frame');
|
||||
|
||||
// Function to request fullscreen
|
||||
function requestFullscreen(element) {
|
||||
if (element.requestFullscreen) {
|
||||
element.requestFullscreen();
|
||||
} else if (element.mozRequestFullScreen) { /* Firefox */
|
||||
element.mozRequestFullScreen();
|
||||
} else if (element.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
|
||||
element.webkitRequestFullscreen();
|
||||
} else if (element.msRequestFullscreen) { /* IE/Edge */
|
||||
element.msRequestFullscreen();
|
||||
}
|
||||
}
|
||||
|
||||
// Request fullscreen when the document is loaded
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
requestFullscreen(iframe);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
Reference in New Issue
Block a user