Commit 61fe4db9 authored by rene's avatar rene
Browse files

ya no hay npm/librerias, css/js puro

parent 40c620a9
......@@ -2,4 +2,3 @@ source 'https://rubygems.org'
gem 'jekyll'
gem 'jekyll-seo-tag'
gem 'jekyll-gzip'
......@@ -29,8 +29,6 @@ GEM
rouge (~> 3.0)
safe_yaml (~> 1.0)
terminal-table (~> 1.8)
jekyll-gzip (2.4.2)
jekyll (>= 3.0, < 5.0)
jekyll-sass-converter (2.1.0)
sassc (> 2.0.1, < 3.0)
jekyll-seo-tag (2.6.1)
......@@ -66,7 +64,6 @@ PLATFORMS
DEPENDENCIES
jekyll
jekyll-gzip
jekyll-seo-tag
BUNDLED WITH
......
......@@ -4,11 +4,10 @@ lang: es
markdown: kramdown
streaming:
url: https://transmisor.partidopirata.com.ar
chat:
chat: https://chat.partidopirata.com.ar
stream: miaudev
formats:
- webm
- mp4
exclude:
- bin
......@@ -17,4 +16,3 @@ exclude:
plugins:
- jekyll-seo-tag
- jekyll-gzip
......@@ -5,11 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="assets/favicon.gif">
<link href="assets/main.css" rel="stylesheet" />
<script type="text/javascript" src="assets/streaming.js"></script>
{% seo %}
</head>
<body class="no-scroll">
<body>
{{ content }}
<script type="text/javascript" src="assets/streaming.js"></script>
</body>
</html>
---
---
{% node_module chota/dist/chota.min.css %}
html, body {
background-color: black;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
.row {
min-height: 100vh;
main {
display: flex;
width: 100%;
height: 100%;
}
.is-full-screen {
min-height: auto;
height: 100%;
video {
flex: 5 auto;
/* background-image: url(cover.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;*/
max-width: 60%;
}
@media screen and (max-width: 768px) {
.no-scroll {
overflow: hidden;
main {
flex-direction: column;
}
video {
max-width: 100%;
}
}
.chat {
flex: 1 auto;
border: none;
}
---
---
// TODO hacerlo en JS puro
{% node_module zepto/dist/zepto.min.js %}
const videoEl = document.querySelector('video');
// Estamos esperando la descarga de un stream
var waiting = false;
// El intervalo que reintenta, si está vacío se crea uno nuevo al
// siguiente error.
var waiter = null;
let waiter = null;
function streaming() {
// Si ya estamos esperando no tenemos que hacer nada
if (waiting) return;
// Indicarle a otros streamers que ya estamos trabajando.
waiting = true;
// Encontrar todos los <video>
var video = $('video');
// Cambiar el src para que incluya un timestamp, esto engaña a Firefox
// a recargar el video cuando se corta en lugar de pensar que terminó
// la descarga y empezar a reproducir desde el principio.
video.find('source').attr('src', function() {
var source = $(this);
// Obtener la URL completa hasta el ?
var src = source.attr('src').split('?')[0];
return src+'?'+Date.now().toString();
});
for (const el of videoEl.querySelectorAll('source')) {
el.src = `${el.src.split('?')[0]}?${Date.now().toString()}`;
}
// Empezar la reproducción
video.get(0).load();
video.get(0).play();
videoEl.load();
videoEl.play();
}
$(document).ready(function() {
// Cuando estamos reproduciendo dejamos de esperar y limpiamos todas
// las recargas después de un error
$('video').on('playing', function() {
waiting = false;
if (waiter) {
clearInterval(waiter);
waiter = null;
}
});
// Cuando estamos reproduciendo dejamos de esperar y limpiamos todas
// las recargas después de un error
videoEl.addEventListener('playing', e => waiter && clearInterval(waiter));
// Volver a reproducir cuando se corte
$('video').on('ended', function() {
console.log('Reiniciando transmisión');
streaming();
});
// Volver a reproducir cuando se corte
videoEl.addEventListener('ended', event => {
console.log('Reiniciando transmisión');
streaming();
});
// Si falla la carga, por ejemplo mientras vuelve la transmisión,
// reintentar regularmente. Si ya estamos intentando, no hacer nada.
$('video source').on('error', function() {
// Señalamos que el intento anterior falló
waiting = false;
// Si falla la carga, por ejemplo mientras vuelve la transmisión,
// reintentar regularmente. Si ya estamos intentando, no hacer nada.
for (const el of videoEl.querySelectorAll('source')) {
el.addEventListener('error', event => {
// Si no hay una tarea esperando, configurarla
if (!waiter) {
console.log('Falló la carga de la fuente, reiniciando transmisión.');
......@@ -63,4 +39,4 @@ $(document).ready(function() {
waiter = setInterval(streaming, 2000);
}
});
});
}
......@@ -3,19 +3,15 @@ layout: default
title: Transmisión del MiauDev
---
<div class="row is-paddingless">
<div class="col{% if site.streaming.chat %}-8{% endif %} is-paddingless is-marginless">
<video poster="assets/poster.jpg" class="is-full-screen is-vertical-align" controls autoplay="false">
{% for format in site.streaming.formats %}
<source src="{{ site.streaming.url }}/{{ site.streaming.stream }}.{{ format }}"
id="{{ format }}"
type="video/{{ format }}"/>
{% endfor %}
</video>
</div>
<main>
<video controls autoplay="false" poster="assets/cover.jpg">
{% for format in site.streaming.formats %}
<source src="{{ site.streaming.url }}/{{ site.streaming.stream }}.{{ format }}"
id="{{ format }}"
type="video/{{ format }}"/>
{% endfor %}
</video>
{% if site.streaming.chat %}
<div class="col is-paddingless is-marginless">
<iframe class="is-full-screen" src="{{ site.streaming.chat }}"></iframe>
</div>
<iframe class="chat" src="{{ site.streaming.chat }}"></iframe>
{% endif %}
</div>
</main>
{
"requires": true,
"lockfileVersion": 1,
"dependencies": {
"zepto": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/zepto/-/zepto-1.2.0.tgz",
"integrity": "sha1-4Se9nmb9hGvl6rSME5SIL3wOT5g="
}
}
}
{
"dependencies": {
"chota": "^0.5.1",
"zepto": "^1.2.0"
}
}
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
chota@^0.5.1:
version "0.5.1"
resolved "https://registry.yarnpkg.com/chota/-/chota-0.5.1.tgz#705f163d90543673e53787a37df663f1bbc6d4ef"
zepto@^1.2.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/zepto/-/zepto-1.2.0.tgz#e127bd9e66fd846be5eab48c1394882f7c0e4f98"
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment