Skip to content
Snippets Groups Projects
Commit 30658d9b authored by me5na7qbjqbrp's avatar me5na7qbjqbrp
Browse files

Merge branch 'streamtmp' into 'newinfra'

Streamtmp

See merge request !81
parents fff25e9b 5a2b9907
No related branches found
No related tags found
1 merge request!81Streamtmp
......@@ -15,16 +15,42 @@
</style>
</head>
<body class="bg-dark">
<div class="container h-100 p-3">
<div class="row align-items-center h-100">
<div class="col-12">
<div class="container-fluid h-100 p-0">
<div class="row align-items-center h-100 mx-0">
<div class="col-lg-8">
<video id="my-video" class="video-js embed-responsive shadow-lg rounded-sm"></video>
<p class="text-right text-white">
<a class="text-white text-decoration-none" href="#" id="linkStream">Ouvrir le flux dans une application externe</a>
<a class="text-white text-decoration-none" href="#" id="refreshStream">
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-arrow-repeat" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M2.854 7.146a.5.5 0 0 0-.708 0l-2 2a.5.5 0 1 0 .708.708L2.5 8.207l1.646 1.647a.5.5 0 0 0 .708-.708l-2-2zm13-1a.5.5 0 0 0-.708 0L13.5 7.793l-1.646-1.647a.5.5 0 0 0-.708.708l2 2a.5.5 0 0 0 .708 0l2-2a.5.5 0 0 0 0-.708z"/>
<path fill-rule="evenodd" d="M8 3a4.995 4.995 0 0 0-4.192 2.273.5.5 0 0 1-.837-.546A6 6 0 0 1 14 8a.5.5 0 0 1-1.001 0 5 5 0 0 0-5-5zM2.5 7.5A.5.5 0 0 1 3 8a5 5 0 0 0 9.192 2.727.5.5 0 1 1 .837.546A6 6 0 0 1 2 8a.5.5 0 0 1 .501-.5z"/>
</svg>
Rafraîchir
</a>
<a class="text-white text-decoration-none" href="#aboutModal" data-toggle="modal">À propos</a>
<a class="text-white text-decoration-none" href="#" id="linkStream">
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-box-arrow-up-right" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M1.5 13A1.5 1.5 0 0 0 3 14.5h8a1.5 1.5 0 0 0 1.5-1.5V9a.5.5 0 0 0-1 0v4a.5.5 0 0 1-.5.5H3a.5.5 0 0 1-.5-.5V5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 0 0-1H3A1.5 1.5 0 0 0 1.5 5v8zm7-11a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-1 0V2.5H9a.5.5 0 0 1-.5-.5z"/>
<path fill-rule="evenodd" d="M14.354 1.646a.5.5 0 0 1 0 .708l-8 8a.5.5 0 0 1-.708-.708l8-8a.5.5 0 0 1 .708 0z"/>
</svg>
Ouvrir le flux dans une application externe
</a>
<a class="text-white text-decoration-none" href="#aboutModal" data-toggle="modal">
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-info-square" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M14 1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>
<path d="M8.93 6.588l-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588z"/>
<circle cx="8" cy="4.5" r="1"/>
</svg>
À propos
</a>
</p>
</div>
<div class="col-lg-4 h-100 px-0">
<div class="embed-responsive h-100 shadow-lg rounded-left">
<iframe src="https://irc.crans.org/web/?join=video_NOM&nick=viewer1&password=&realname=Viewer1"></iframe>
</div>
</div>
</div>
</div>
......@@ -49,7 +75,7 @@
Pour diffuser sur cette plateforme, allez dans l'onglet « Stream (flux) » des paramètres :
</p>
<ul>
<li><b>Serveur :</b> <code>rtmp://stream.adm.crans.org/live</code>,</li>
<li><b>Serveur :</b> <code>rtmps://stream.adm.crans.org:1935/live</code>,</li>
<li><b>Clé de stream :</b> votre identifiant.</li>
</ul>
<h5>Avec FFmpeg</h5>
......@@ -57,7 +83,7 @@
<code>
ffmpeg -re -i mavideo.webm -vcodec libx264 -vprofile baseline
-acodec aac -strict -2 -f flv
rtmp://stream.adm.crans.org/live/identifiant
rtmps://stream.adm.crans.org:1935/live/identifiant
</code>
</p>
......@@ -99,7 +125,7 @@
const streamUrl = `/hls/${streamId}.m3u8`
document.getElementById("linkStream").href = streamUrl
// If stream exists, then load
// Create player
const player = videojs('my-video', {
controls: true,
autoplay: true,
......@@ -109,21 +135,32 @@
aspectRatio: '16:9'
})
fetch(streamUrl, {
method: 'HEAD',
cache: 'no-cache'
}).then((response) => {
if (response.ok) {
// Stream exists, load!
player.src({
type: 'application/x-mpegURL',
src: streamUrl
});
} else {
// Stream does not exist, alert!
player.poster('/no-stream.jpg')
}
});
function loadStream() {
fetch(streamUrl, {
method: 'HEAD',
cache: 'no-cache'
}).then((response) => {
if (response.ok) {
// Stream exists, load!
player.poster()
player.src({
type: 'application/x-mpegURL',
src: streamUrl
})
} else {
// Stream does not exist, alert!
player.poster('/no-stream.jpg')
}
})
}
$(document).ready(function () {
loadStream()
document.getElementById("refreshStream").addEventListener("click", function(){
loadStream()
})
})
</script>
</body>
</html>
......@@ -52,3 +52,8 @@
src: /usr/share/javascript
dest: /var/www/stream/lib
state: link
- name: Configure tmpfs
lineinfile:
path: /etc/fstab
line: tmpfs /var/www/stream/hls tmpfs rw,noexec,nodev,nosuid 0 0
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment