forked from Jimbo/Jimbo-Landing-Page
delete streams folder
This commit is contained in:
parent
9410526a1c
commit
bb07f7c3ac
|
|
@ -1,33 +0,0 @@
|
||||||
body, html {
|
|
||||||
font-family: 'Segoe UI', 'Tahoma', 'Geneva', 'Verdana', sans-serif;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
height: 100%;
|
|
||||||
background-color: black;
|
|
||||||
font-size: 16px; /* Establish a base font size */
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.video-container, .image-container {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
width: calc(90vh * 4 / 3);
|
|
||||||
max-width: 100vw;
|
|
||||||
overflow: hidden; /* Ensure no overflow occurs */
|
|
||||||
}
|
|
||||||
|
|
||||||
.video-container video, .image-container img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
object-fit: contain; /* Ensure the image/video covers the container without stretching */
|
|
||||||
}
|
|
||||||
|
|
@ -1,70 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Airbenz TV</title>
|
|
||||||
<link rel="stylesheet" href="../43styles.css">
|
|
||||||
<link href="https://vjs.zencdn.net/8.10.0/video-js.css" rel="stylesheet" />
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="container">
|
|
||||||
<div class="video-container" id="video-container">
|
|
||||||
<video
|
|
||||||
id="my-video"
|
|
||||||
class="video-js vjs-fluid"
|
|
||||||
controls
|
|
||||||
preload="auto"
|
|
||||||
width="1280"
|
|
||||||
height="720"
|
|
||||||
autoplay
|
|
||||||
poster="MY_VIDEO_POSTER.jpg"
|
|
||||||
data-setup='{"techOrder": ["html5", "flash"], "html5": {"hls": {"enableLowInitialPlaylist": true, "smoothQualityChange": true}}}'
|
|
||||||
>
|
|
||||||
<source src="/streams/hls/AirbenzTV.m3u8" type="application/x-mpegURL" />
|
|
||||||
<p class="vjs-no-js">
|
|
||||||
To view this video please enable JavaScript, and consider upgrading to a
|
|
||||||
web browser that
|
|
||||||
<a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
|
|
||||||
</p>
|
|
||||||
</video>
|
|
||||||
</div>
|
|
||||||
<div class="image-container" id="image-container" style="display:none;">
|
|
||||||
<img src="/images/copyright/airbenz-offline.png" alt="Fallback Image" id="fallback-image">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<script src="https://vjs.zencdn.net/8.10.0/video.min.js"></script>
|
|
||||||
<script>
|
|
||||||
var videoElement = document.getElementById('my-video');
|
|
||||||
var videoContainer = document.getElementById('video-container');
|
|
||||||
var imageContainer = document.getElementById('image-container');
|
|
||||||
var fallbackImage = document.getElementById('fallback-image');
|
|
||||||
|
|
||||||
function handleVideoError() {
|
|
||||||
videoContainer.style.display = 'none';
|
|
||||||
imageContainer.style.display = 'flex';
|
|
||||||
|
|
||||||
// Adjust image container to match the aspect ratio of the fallback image
|
|
||||||
fallbackImage.onload = function() {
|
|
||||||
var aspectRatio = fallbackImage.naturalWidth / fallbackImage.naturalHeight;
|
|
||||||
if (window.innerWidth / window.innerHeight > aspectRatio) {
|
|
||||||
fallbackImage.style.width = 'auto';
|
|
||||||
fallbackImage.style.height = '100%';
|
|
||||||
} else {
|
|
||||||
fallbackImage.style.width = '100%';
|
|
||||||
fallbackImage.style.height = 'auto';
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleVideoPlaying() {
|
|
||||||
videoContainer.style.display = 'block';
|
|
||||||
imageContainer.style.display = 'none';
|
|
||||||
}
|
|
||||||
|
|
||||||
videoElement.addEventListener('error', handleVideoError);
|
|
||||||
videoElement.addEventListener('canplay', handleVideoPlaying);
|
|
||||||
videoElement.addEventListener('playing', handleVideoPlaying);
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -1,70 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Bloxeleste Gaming</title>
|
|
||||||
<link rel="stylesheet" href="../styles.css">
|
|
||||||
<link href="https://vjs.zencdn.net/8.10.0/video-js.css" rel="stylesheet" />
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="container">
|
|
||||||
<div class="video-container" id="video-container">
|
|
||||||
<video
|
|
||||||
id="my-video"
|
|
||||||
class="video-js vjs-fluid"
|
|
||||||
controls
|
|
||||||
preload="auto"
|
|
||||||
width="1280"
|
|
||||||
height="720"
|
|
||||||
autoplay
|
|
||||||
poster="MY_VIDEO_POSTER.jpg"
|
|
||||||
data-setup='{"techOrder": ["html5", "flash"], "html5": {"hls": {"enableLowInitialPlaylist": true, "smoothQualityChange": true}}}'
|
|
||||||
>
|
|
||||||
<source src="/streams/hls/jimbo.m3u8" type="application/x-mpegURL" />
|
|
||||||
<p class="vjs-no-js">
|
|
||||||
To view this video please enable JavaScript, and consider upgrading to a
|
|
||||||
web browser that
|
|
||||||
<a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
|
|
||||||
</p>
|
|
||||||
</video>
|
|
||||||
</div>
|
|
||||||
<div class="image-container" id="image-container" style="display:none;">
|
|
||||||
<img src="/images/offline/jimbo-offline.png" alt="Fallback Image" id="fallback-image">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<script src="https://vjs.zencdn.net/8.10.0/video.min.js"></script>
|
|
||||||
<script>
|
|
||||||
var videoElement = document.getElementById('my-video');
|
|
||||||
var videoContainer = document.getElementById('video-container');
|
|
||||||
var imageContainer = document.getElementById('image-container');
|
|
||||||
var fallbackImage = document.getElementById('fallback-image');
|
|
||||||
|
|
||||||
function handleVideoError() {
|
|
||||||
videoContainer.style.display = 'none';
|
|
||||||
imageContainer.style.display = 'flex';
|
|
||||||
|
|
||||||
// Adjust image container to match the aspect ratio of the fallback image
|
|
||||||
fallbackImage.onload = function() {
|
|
||||||
var aspectRatio = fallbackImage.naturalWidth / fallbackImage.naturalHeight;
|
|
||||||
if (window.innerWidth / window.innerHeight > aspectRatio) {
|
|
||||||
fallbackImage.style.width = 'auto';
|
|
||||||
fallbackImage.style.height = '100%';
|
|
||||||
} else {
|
|
||||||
fallbackImage.style.width = '100%';
|
|
||||||
fallbackImage.style.height = 'auto';
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleVideoPlaying() {
|
|
||||||
videoContainer.style.display = 'block';
|
|
||||||
imageContainer.style.display = 'none';
|
|
||||||
}
|
|
||||||
|
|
||||||
videoElement.addEventListener('error', handleVideoError);
|
|
||||||
videoElement.addEventListener('canplay', handleVideoPlaying);
|
|
||||||
videoElement.addEventListener('playing', handleVideoPlaying);
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -1,33 +0,0 @@
|
||||||
body, html {
|
|
||||||
font-family: 'Segoe UI', 'Tahoma', 'Geneva', 'Verdana', sans-serif;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
height: 100%;
|
|
||||||
background-color: black;
|
|
||||||
font-size: 16px; /* Establish a base font size */
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.video-container, .image-container {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
width: calc(90vh * 16 / 9);
|
|
||||||
max-width: 100vw;
|
|
||||||
overflow: hidden; /* Ensure no overflow occurs */
|
|
||||||
}
|
|
||||||
|
|
||||||
.video-container video, .image-container img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
object-fit: contain; /* Ensure the image/video covers the container without stretching */
|
|
||||||
}
|
|
||||||
Loading…
Reference in New Issue