first commit

This commit is contained in:
2023-01-20 22:15:42 +00:00
commit f144a6f0a4
16 changed files with 1387 additions and 0 deletions

23
players/dash.html Normal file
View File

@@ -0,0 +1,23 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DASH Live Streaming</title>
<link href="https://vjs.zencdn.net/7.5.5/video-js.css" rel="stylesheet">
<script src="https://vjs.zencdn.net/7.5.5/video.js"></script>
</head>
<body>
<h1>DASH Player</h1>
<video id="player" class="video-js vjs-default-skin" width="720" controls preload="auto">
<source src="/dash/test_src.mpd" type="application/dash+xml" />
</video>
<script>
var player = videojs('#player');
</script>
<div id="footer">
<font size="2"> Tareq-Alqutami - 2019</font>
</div>
</body>
</html>

23
players/hls.html Normal file
View File

@@ -0,0 +1,23 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HLS Live Streaming</title>
<link href="https://vjs.zencdn.net/7.5.5/video-js.css" rel="stylesheet">
<script src="https://vjs.zencdn.net/7.5.5/video.js"></script>
</head>
<body>
<h1>HLS Player</h1>
<video id="player" class="video-js vjs-default-skin" width="720" controls preload="auto">
<source src="/hls/test.m3u8" type="application/x-mpegURL" />
</video>
<script>
var player = videojs('#player');
</script>
<div id="footer">
<font size="2"> Tareq-Alqutami - 2019</font>
</div>
</body>
</html>

41
players/hls_hlsjs.html Normal file
View File

@@ -0,0 +1,41 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>HLS streaming</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
</head>
<body>
<h1>HLS Player (using hls.js)</h1>
<div class="well">
<div class="embed-responsive embed-responsive-16by9">
<video id="video" style="max-height: 50%" class="embed-responsive-item video-js vjs-default-skin" controls muted="muted"></video>
</div>
</div>
<script>
if(Hls.isSupported()) {
var video = document.getElementById('video');
var hls = new Hls();
hls.loadSource('/hls/test.m3u8');
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED,function() {
video.play();
});
}
</script>
<div id="footer">
<font size="2">Tareq-Alqutami - 2019</font>
</div>
</body>
</html>

24
players/rtmp.html Normal file
View File

@@ -0,0 +1,24 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>RTMP Live Streaming</title>
<title>Live Streaming</title>
<link href="https://unpkg.com/video.js/dist/video-js.css" rel="stylesheet">
<script src="https://unpkg.com/video.js/dist/video.js"></script>
<script src="https://unpkg.com/videojs-flash/dist/videojs-flash.min.js"></script>
<script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js"></script>
</head>
<body>
<h1>RTMP Player</h1>
<video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" width="720"
data-setup='{"techOrder": ["html5","flash"]}'>
<source src="rtmp://127.0.0.1:1935/live/test" type="rtmp/mp4">
</video>
<div id="footer">
<font size="2">Tareq Alqutami - 2019</font>
</div>
</body>
</html>

30
players/rtmp_hls.html Normal file
View File

@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Live Streaming</title>
<link href="https://unpkg.com/video.js/dist/video-js.css" rel="stylesheet">
<script src="https://unpkg.com/video.js/dist/video.js"></script>
<script src="https://unpkg.com/videojs-flash/dist/videojs-flash.min.js"></script>
<script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js"></script>
</head>
<body>
<h1>RTMP Player</h1>
<video id="rtmp_video" class="video-js vjs-default-skin" controls preload="auto" width="720"
data-setup='{"techOrder": ["html5","flash"]}'>
<source src="rtmp://127.0.0.1:1935/live/test" type="rtmp/mp4">
</video>
<h1>HLS Player</h1>
<video id="hls_video" class="video-js vjs-default-skin" controls preload="auto" width="720"
data-setup='{"techOrder": ["html5","flash"]}'>
<source src="http://127.0.0.1:8080/hls/test.m3u8" type="application/x-mpegURL">
</video>
<div id="footer">
<font size="2">Tareq Alqutami - 2019</font>
</div>
</body>
</html>