Bluemedia/nginx-live
1
0
Fork 0
mirror of https://github.com/BluemediaGER/nginx-live.git synced 2024-11-22 09:55:28 +01:00
Code Issues Packages Projects Releases Wiki Activity

Use vanilla Clappr instead of voc-player

Browse source
This commit is contained in:
Oliver Traber 2021-07-31 00:44:42 +02:00
parent 80202deb89
commit 65e5982ea2
Signed by: Bluemedia
GPG key ID: C7BA47275B086E2C
4 changed files with 26 additions and 1154 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
README.md
View file

@ -44,7 +44,7 @@ If you want to make the web player and the HLS files available via HTTPS, you ca
## Built with
- [NGINX](https://www.nginx.com/) High Performance Load Balancer, Web Server, & Reverse Proxy
- [nginx-rtmp-module](https://github.com/arut/nginx-rtmp-module) NGINX-based Media Streaming Server
- [voc-player](https://github.com/voc/voc-player) HTML5 Stream Player for MPEG-DASH and HLS
- [Clappr](https://github.com/clappr/clappr) Extensible media player for the web
## Project structure / Directories
- `config/` NGINX config files with various placeholders which will be replaced by the entrypoint script.

1144
frontend/assets/js/player.js
View file

File diff suppressed because one or more lines are too long

0
frontend/assets/css/style.css → frontend/assets/style.css
View file

34
frontend/index.html
View file

@ -4,7 +4,12 @@
<meta charset="UTF-8">
<title>Livestream</title>
<link rel="icon" href="assets/favicon.ico">
<link rel="stylesheet" href="assets/css/style.css">
<link rel="stylesheet" href="assets/style.css">
<script type="text/javascript" crossorigin="anonymous" src="https://cdn.jsdelivr.net/npm/clappr/dist/clappr.min.js"></script>
<script type="text/javascript" crossorigin="anonymous" src="https://cdn.jsdelivr.net/npm/clappr-stats/dist/clappr-stats.min.js"></script>
<script type="text/javascript" crossorigin="anonymous" src="https://cdn.jsdelivr.net/npm/clappr-nerd-stats/dist/clappr-nerd-stats.min.js"></script>
<script type="text/javascript" crossorigin="anonymous" src="https://cdn.jsdelivr.net/npm/clappr-pip-plugin/dist/clappr-pip-plugin.js"></script>
</head>
</head>
<body>
<div class="container">
@ -14,23 +19,34 @@
<div id="player"></div>
</div>
</body>
<script src="assets/js/player.js"></script>
<script>
// expose Clappr to load additional plugins
window.Clappr = window.VOCPlayer
</script>
<script>
new VOCPlayer.Player({
new Clappr.Player({
//** Standard clappr.io Options **
// Use custom source
sources: ["hls/live.m3u8"],
// Plugins
plugins: [ClapprNerdStats, ClapprStats, ClapprPIPPlugin],
clapprNerdStats: {
iconPosition: 'none'
},
// Disable m3u8 preload to prevent error on page load
hlsPlayback: {
preload: false
},
// Set a custom poster
poster: "assets/backdrop.jpg",
// Assign parent by id
parentId: "#player"
})
parentId: "#player",
// Set dimensions and media control delay
height: "100%",
width: "100%",
hideMediaControlDelay: 1000
})
</script>
</html>