MYETV Video Player Open Source

Introduzione al lettore MYETV

The MYETV video player è un'esperienza media moderna, HTML5-prima progettata per l'avvio veloce, l'interfaccia utente pulita e la personalizzazione profonda attraverso le superfici web e TV, continuando la lunga evoluzione della piattaforma da precedenti giocatori HTML5 ad uno strumento completamente aperto e e estensivo. Costruito su tecnologie web standard, abbraccia didascalie, capitoli, temi, plugin e un Javascript API documentato in modo che i team possano integrare, marcare ed estendere la riproduzione in modo affidabile attraverso i dispositivi. Il codebase sarà rilasciato come open source sotto la licenza MIT nel repository ufficiale GitHub per incoraggiare la revisione della comunità, i contributi e il riutilizzo.

Link Github: https://github.com/OskarCosimo/MYETV-video-player-opensource/

Demo link: https://oskarcosimo.com/MYETV-video-player/MYETV-player-demo.html

MITTA Licenza a colpo d'occhio

La licenza MIT è una breve, permissiva licenza open source che consente l'uso, la copia, la modifica, la distribuzione, la sublicenza e l'uso commerciale, a condizione che il copyright originale e l'avviso di licenza siano conservati. Il software- [Program/Software: the instructions that control what a computer does; computer programs] - è fornito “come è,” senza garanzie o responsabilità, che mantiene la conformità chiara e leggera per gli sviluppatori e le imprese individuali. Questa combinazione di flessibilità e semplicità è una ragione chiave per cui MIT rimane una delle licenze più popolari per i progetti open source.

Perché open source

Open sourcing il giocatore sotto MIT consente lo sviluppo trasparente, abbassa il rischio di blocco del fornitore e consente miglioramenti basati sulla comunità, inclusi plugin e integrazioni ispirate da ecosistemi vibranti visti in giocatori HTML5 ampiamente utilizzati. Permissive licensing rende facile incorporare il giocatore all'interno di stack commerciali o di risorse chiuse, mentre contribuisce ancora correzioni di bug indietro o miglioramenti come desiderato. Questo approccio si allinea con MYETVLa storia della riproduzione in evoluzione e le funzionalità UI per ambienti diversi.

Architettura core

Il giocatore si concentra su supporti HTML5 e API web standard, offrendo ampia compatibilità e distribuzione semplice su browser moderni e viste web. Grazie a tracce e controlli basati su standard, supporta capzioni, capitoli e miglioramenti dell'interfaccia utente senza dipendenze proprietarie di runtime. Il risultato è il comportamento prevedibile, l'estensibilità, e una base stabile per caratteristiche personalizzate e la messa a punto delle prestazioni.

Opzioni JavaScript

• inizializzazione di riproduzione: URL sorgente (s), autoplay, precarico, loop, muted, playsinline, loghi di marca, loghi di filigrana e retro mirror proprietà HTML5 familiari per la configurazione prevedibile.
• Configurazione UX: le opzioni per la visibilità della barra di controllo, il layout del pulsante, il comportamento della tastiera, i timeout dell'inattività e le punte degli strumenti forniscono il controllo fine-grained dei modelli di interazione.
• Gestione dei media: selezione di qualità, menu a ripetizione e menu di traccia (audio/caption) seguire le migliori pratiche viste in giocatori e toolkit consolidati.
• Callback eventi: onReady, onPlay, onPause, onEnded, onError, onRateChange, onQuality Cambiare, onCaptionChange abilitare app-level orchestrazione e analitici ganci.

SCSS e CSS

Le variabili a tema e i ganci di classe CSS consentono colori personalizzati, tipografia, spaziatura, radii ad angolo e iconografia, consentendo l'allineamento senza soluzione di continuità con i sistemi di marca del prodotto. Le pelli multiple sono supportate da fogli di stile leggeri in modo che una singola costruzione possa presentare diversi sguardi tra proprietà o inquilini. Elementi di marca come un piccolo logo angolo o filigrana possono essere applicati attraverso opzioni o overlay CSS.

Loghi completamente personalizzabili

Il giocatore presenta loghi e filigrane di marca completamente personalizzabili.
Logo di marca: Situato a destra della barra di controllo, può essere visualizzato a sinistra dei pulsanti. Può essere impostato con un URL immagine (dimensione consigliata: altezza 44px – larghezza 120px), un link personalizzato, e c'è una specifica opzione per visualizzarlo o no.
Logo Watermark: Posizionato come desiderato sul video, può essere impostato con un URL immagine (dimensione consigliata: larghezza: 180px, altezza: 100px), un link, una didascalia del link, e c'è un'opzione per impostare la sua posizione (in alto a sinistra, in alto a destra, in basso a sinistra, in basso a destra).

I loghi sono facoltativi, hanno un ampio supporto API e sono già inseriti come opzione quando il giocatore inizializza, quindi nessun plugin è richiesto.

Didascalie: VTT e SRT

Il lettore supporta tracce di testo con WebVTT per didascalie e sottotitoli, tra cui menu multilingua e styling, sfruttando il modello di traccia standard utilizzato sul web. I file WebVTT sono facili da autorizzare e mantenere, e sono adatti sia per capzioni che per i capitoli, rendendoli una misura naturale per le tubazioni di produzione. I flussi di lavoro che hanno origine in SRT possono essere ospitati convertendo in VTT o utilizzando processi ingest che producono entrambi i formati per la massima compatibilità.

Capitoli con immagini

I capitoli sono abilitati tramite le tracce del capitolo WebVTT, consentendo una rapida navigazione attraverso contenuti di lunga durata con segmenti chiari e etichettati. Il giocatore può mostrare anteprime visive e miniature delle immagini accanto alle voci dei capitoli per rendere la navigazione più intuitiva e coinvolgente per il pubblico. Questo approccio semplifica la modifica dei contenuti: i produttori aggiornano un sidecar VTT e immagini, e il capitolo UI si aggiorna automaticamente.

Pulsanti di controllo

• Riproduzione: riproduzione/pausa, ricerca, riproduzione e visualizzazione del tempo sono presenti con scorciatoie da tastiera per una navigazione efficiente.
• Audio: mute/unmute e cursore del volume assicurano un controllo del suono coerente, con menu audio-track facoltativi quando sono presenti più tracce.
• Visualizza: lo schermo intero e l'immagine-in-immagine si integrano con le funzionalità del browser, e le modalità opzionali per il teatro o la forma aiutano a soddisfare le esigenze del layout.
• Qualità e velocità: i menu bitrate/qualità e la selezione della classe di riproduzione forniscono l'agenzia utente per le preferenze di rete e comprensione.
• Didascalie: un menu didascalie fornisce on/off toggles e selezione traccia, con lo styling allineato alla guida di accessibilità.
• Overflow: un menu “più” personalizzabile ospita impostazioni avanzate e azioni plugin-driven per mantenere l'interfaccia utente concentrata.

Lettore audio con visualizzazione d'onda

Il lettore può anche essere utilizzato solo come lettore audio e ha un sistema di visualizzazione audio waveform integrato senza la necessità di alcun plugin; il sistema può ancora essere personalizzato costruendo plugin separati. Due opzioni vengono impostate quando il giocatore viene inizializzato: “audiofile” (vero o falso) imposta il lettore come lettore audio, mentre “audiowave” (vero o falso) visualizzerà la forma d’onda audio nello spazio video.

Sistema Plugin

L'architettura del plugin espone i ganci del ciclo di vita, i punti di iniezione dell'interfaccia utente e gli abbonamenti degli eventi in modo nuove funzionalità possono essere aggiunti senza forking core. Esempi includono beacon di analisi, integrazioni di annunci tramite SDK standardizzati, overlays di watermarking e pulsanti personalizzati per azioni specifiche di dominio. Questo rispecchia gli ecosistemi aperti di successo in cui i pacchetti comunitari ampliano le capacità dei giocatori nel tempo.

API di sviluppo

Un'API concisa consente un controllo imperativo gioco, pausa, cercare, setVolume, setMuted, setPlaybackRate, setSource(s), setTrack(s), e getState plus ready/error promesse per la formazione di stivali lisci. Gli emettitori di eventi rispecchiano la semantica HTML5 in modo che il codice dell'app possa reagire ai cambiamenti della testa di gioco, buffering, errori, track toggles, switch di qualità e transizioni a schermo intero. La configurazione può essere fornita tramite JavaScript o attributi dati, consentendo sia modelli di inizializzazione dichiarativa che programmatica.

Caratteristiche di accesso

Le didascalie WebVTT e le tracce dei capitoli migliorano l'accessibilità e la comprensione, consentendo una navigazione facile da tastiera attraverso l'interfaccia utente del giocatore. Chiara messa a fuoco stati, contrasto leggibile e supporto di stile didascalia regolabile esperienza inclusiva di default. Il supporto multilingua segue i metadati tracciati e si allinea alle pratiche utilizzate dai lettori desktop e TV consolidati.

Theming e branding su scala

Le variabili CSS globali consentono scambi di colore e tipografia veloci in modo che le marche possano mantenere un'identità coerente tra i giocatori incorporati in più siti o applicazioni. I modelli Skinning forniscono una maggiore separazione tra logica e stile, semplificando la manutenzione e la progettazione a lungo termine. Le organizzazioni possono standardizzare layout e comportamenti attraverso preimpostazioni a tema, preservando allo stesso tempo spazio per sovrascritture per pagina.

Flussi di produzione

Utilizzando file VTT sidecar per didascalie e capitoli semplifica la pubblicazione continua: gli editori spediscono tracce di testo aggiornate senza ri-codifica media. Un modello simile si applica alle miniature di anteprima e alle immagini di poster, che possono essere scambiate indipendentemente dai file video per l'iterazione rapida dell'interfaccia utente. Queste convenzioni si allineano con le pratiche ampiamente adottate nelle pipeline di distribuzione video professionale.

Perché questo approccio funziona

I giocatori a base di standard sono più facili da debug, tema, e si estendono, e si adattano bene ai flussi di lavoro moderni CI/CD e di design-system. Una licenza permissiva più un core plugin-friendly invita contributi e integrazioni che beneficiano sia le squadre di prodotto che la comunità più ampia. Nel corso del tempo, questo effetto ecosistema composto produce migliori caratteristiche, doc e stabilità per tutti.

Disponibilità

Il codice del giocatore sarà pubblicato come open source sotto la licenza MIT nel repository ufficiale GitHub, invitando i problemi, estrarre le richieste e le discussioni da sviluppatori e integratori. La semplicità della licenza rende semplice incorporare il giocatore attraverso i progetti, onorando l'attribuzione e preservando il testo della licenza. Documentazione ed esempi accompagneranno il rilascio per accelerare l'adozione e la personalizzazione.

Una nota per gli utenti MYETV

Questo progetto si basa su anni di miglioramenti iterativi alla riproduzione MYETV piattaforma, tra cui la personalizzazione dell'interfaccia utente e le estensioni dei giocatori che hanno supportato il branding e l'evoluzione delle esperienze di visualizzazione. Aprire il sourcing del giocatore formalizza che il progresso e rende più facile adottare, estendere e mantenere in tutti gli ambienti web e TV MYETV serve. Questa è la base per una roadmap sostenibile e guidata dalla comunità per caratteristiche e integrazioni in corso.

Elenco di controllo della caratteristica

• riproduzione HTML5-prima con tracce e controlli basati su standard per la compatibilità del browser ampio.
• Didascalia con WebVTT, menu multi-track e flussi di autori VTT compatibili con la produzione; flussi di lavoro SRT-origin supportati da conversioni o condutture.
• I capitoli con segmenti etichettati e le anteprime opzionali per la navigazione a forma lunga.
• Il disegno tramite variabili CSS, pelli e elementi di marca come filigrane o loghi d'angolo.
• Comandi completi: gioco/pausa, cercare, tempo, volume, muto, didascalie, qualità, velocità, schermo intero, immagine-in-immagine.
• Collegare l'architettura per analisi, annunci, filigrane e pulsanti personalizzati senza forking il nucleo.
• Supporta lo streaming HLS o DASH per la compatibilità con tutti i flussi audio/video
• API trasparente per controllo imperativo, eventi e inizializzazione dichiarativa tramite attributi.
• Comunicato open source MIT-licensed per incoraggiare la collaborazione e il riutilizzo flessibile.

Chiusura

Releasing MYETV Il lettore sotto la licenza MIT invita la comunità a creare un'esperienza di riproduzione focalizzata, veloce ed estensibile che i team possano fidarsi della produzione. Con robuste didascalie, capitoli, a tema, plugin e una API pulita, è progettato per essere una base affidabile per le applicazioni web e TV di oggi.