tholinka / crunchyroll-html5 Archiviato

Latest release Titolo Greenkeeper

Non ci piace proprio flash e vogliamo che venga ucciso il prima possibile. Tuttavia, attualmente non c’è un lettore HTML5 disponibile per Crunchyroll senza avere un abbonamento. Quindi questa è la risposta.

Caratteristiche

  • Un lettore HTML5 completo che assomiglia molto a quello di YouTube.
  • Cambia la qualità del video nel lettore.
  • Cambia i sottotitoli nel lettore (usando libass con JavascriptSubtitlesOctopus).
  • Controlli della velocità.
  • Auto-riproduci il video successivo.
  • Scorciatoie (vedi lista delle scorciatoie)

Download

Estensione Chrome: https://chrome.google.com/webstore/detail/crunchyroll-html5/ihegfgnkffeibpmnajnoiemkcmlbmhmi

Firefox addon: https://addons.mozilla.org/en-US/firefox/addon/crunchyroll-html5-unofficial/

Screenshots

Preview

Subtitle Engine

Il browser è davvero pessimo nel visualizzare i sottotitoli così ho dovuto trovare una libreria in grado di rendere i sottotitoli SSA/ASS. Ho cercato di usare solo WebVTT, ma Chrome non era davvero in grado di renderli senza una grande scatola nera intorno.

Così ho deciso di usare JavaScriptSubtitlesOctopus, che è un progetto emscripten che fa funzionare libass nel browser con il supporto dei font. Tuttavia, ho dovuto fare alcune modifiche al progetto per permettere il caricamento dinamico del filedefault.ttffile e del file fonts.conffile. Ho anche implementato un modo per cambiare la traccia dei sottotitoli senza dover riavviare il WebWorker che sta eseguendo il motore.

Tutte le modifiche possono essere trovate qui.

Build

La costruzione di questo progetto risulterà in un file crunchyroll-html5.user.js nella directory/dist. Per farlo funzionare su Crunchyroll è necessario aggiungere l’intestazione auserscript che permette l’esecuzione dello script suhttp://www.crunchyroll.com/*. Al momento non l’ho reso capace di costruire per ogni browser o userscript.

Prima di costruire assicurati di aver installato Node.js e Yarn (opzionale). Dopo di che ti viene richiesto di installare le dipendenze del progetto attraverso Yarn.

La compilazione viene fatta eseguendo lo script build:

$ yarn build

Packaging

Puoi pacchettizzare l’addon legacy Firefox come firefox.xpi (non firmato perché non è più possibile firmarlo) e l’estensione web come webextension.zip (firmabile, vedi sotto).

$ yarn package:firefox$ yarn package:webextension

Firefox Signing

Si può firmare l’estensione web. Tuttavia, hai bisogno di una chiave API e di un APIsecret per poter firmare l’estensione web (puoi ottenerne una qui); se lasci l’ID dell’estensione vuoto ne verrà generato uno nuovo. Puoi usare l’ID generato in futuro per aggiornare l’estensione invece di creare nuove estensioni ad ogni aggiornamento.

$ yarn sign:webextension --key <API KEY> --secret <API SECRET> --id <ID>

TODO

  • Aggiungi il supporto per il monitoraggio dei progressi
    • Chrunchyroll
      • Tracciamento degli episodi visti
      • Utilizza la funzione resume di Crunchyroll.
    • Kitsu
      • Tracciamento degli episodi visti
    • MyAnimeList
      • Tracciamento degli episodi visti
    • Local
      • Tracciamento degli episodi visti
      • Tracciamento di ciò che hai guardato in un video.
      • Riprendere i video che non hai ancora guardato completamente.
  • Aggiungi opzione per cambiare i sottotitoli in altre lingue. Attualmente, viene visualizzato solo il sottotitolo predefinito (nella maggior parte dei casi questo sarà inglese).
  • Aggiungi più font. Attualmente è disponibile solo Arial. Dovrebbe essere abbastanza facile, ma alcuni test devono essere fatti per questo.
  • Considera di spostare la selezione della qualità nel lettore.
  • Guarda se aggiungere il supporto Chromecast.
  • Aggiungi una schermata finale per indicare che l’utente ha finito l’episodio corrente e forse passa automaticamente all’episodio successivo.
  • Aggiungi versioni multiple di questo progetto per userscripts, Chrome, Firefox andmore.
  • Aggiungi un modo per il lettore di ricordare le scelte dell’utente come quanto è alto o basso il volume.
  • Guarda se è possibile ridurre la dimensione del codice nell’userscript.

Librerie principali

  • hls.js
  • JavascriptSubtitlesOctopus

Lascia un commento