Questo componente del tema permette agli utenti di “pop-out” i media in una finestra fluttuante mentre navigano sul sito. Possono anche spostarsi su un altro argomento e i media continueranno a funzionare.
Funziona con qualsiasi <iframe> o <video> (con un trattamento speciale per lazyYT). Aggiunge un pulsante a ogni elemento compatibile, che apre quindi una piccola finestra popup in basso a destra.
Puoi quindi “minimizzarlo”, mantenendo l’audio in esecuzione in background, oppure chiuderlo completamente.
Al momento, le dimensioni del video sono determinate dall’incorporamento originale. Vorrei aggiungere una funzionalità di “ridimensionamento”, sia tramite “clicca e trascina”, sia semplicemente con 3 pulsanti: “piccolo”, “medio”, “grande”.
Attualmente questo oscura il compositore… la soluzione più semplice è chiudere semplicemente la finestra popup se vuoi scrivere un post .
I have fixed this with the addition of an explicit z-index, and some explicit colours. With the vincent theme it now looks like this when you mouse-over:
I tried enabling it on my forum and it makes the video box disappear completely when the video is oneboxed from a mp4 link.
I’ve also tested it with iframes and that makes it works as expected, but iframes are trickier to format properly
We just installed this so users could watch impeachment hearings without having to have another window open and it was such a hit (one comment was “This is very convenient. Amazing. This is by far the best forum interface I’ve ever experienced.”) that people on phones and tablets wanted it too. And since you can’t have multiple windows open on your mobile device, it’s a great feature to have.
To enable it on tablets and phones, just remove no-touch from lines 64 and 82 of Common CSS, and then resize the player on smaller screens with something like:
On touch devices, long-press = hover to bring up the control icon or the media controls, and then tap somewhere else to hide it again.
I was going to leave it off phones, but it’s still useful on a phone because you can listen to the audio with the player collapsed.
I assume this is a known limitation, but YouTubes won’t play audio when collapsed, and if you start to play a YouTube from the post and then decide to pop it out, there is no way to play the video in the floating window. You have to pop it out first without playing it, and then you can play it in the floating window.
It seems to work correctly with YouTube videos if you post them as an iFrame instead of just posting the link and using the Discourse lazyYT.
In order to for this to work, you must enable YouTube iFrames on your site. To do this go to Settings --> “allowed iframes” and whitelist https://www.youtube.com/
Then when you paste an iFrame code (you can find the iFrame code for any video on Youtube under Share --> Embed) the YouTube embedded via iFrame will be fully functional with the Media Overlay component. I.e. you need to post:
instead of https://www.youtube.com/watch?v=Ft1waA3p2_w
The iframe code won’t work on discourse.org because they haven’t whitelisted https://www.youtube.com in their “allowed iframes” settings, but it’s easy to add to your own forum.
Here’s how it looks on our forum on my phone with the media player expanded:
Il componente Media Overlay impediva la visualizzazione di video da siti come Imgur sul nostro forum. Abbiamo risolto il problema rimuovendo video dalla riga 103, ovvero modificando $('iframe, video, .lazyYT', $elem) in $('iframe, .lazyYT', $elem)
function addOverlays($elem) {
$('iframe, video, .lazyYT', $elem).wrap("<div class='media-overlay-eligable'></div>")
Ora i video di Imgur funzionano di nuovo e l’overlay continua a funzionare con gli iframe e i lazyYT.
Per gli utenti interessati a questa funzionalità, iOS Safari e Firefox lo offrono già di default, mentre Chrome prevede di implementarlo nelle prossime versioni.
.
