tholinka / crunchyroll-html5 Gearchiveerd

We houden echt niet van flash en willen het zo snel mogelijk uit de wereld helpen. Er is momenteel echter geen HTML5-speler beschikbaar voor Crunchyroll zonder dat je een abonnement hebt. Dus dit is het antwoord.

Functies

• Een volwaardige HTML5 speler die veel op YouTube’s speler lijkt.
• Videokwaliteit in de speler wijzigen.
• Verander ondertiteling in de speler (met behulp van libass met JavascriptSubtitlesOctopus).
• Snelheidscontroles.
• Auto-play de volgende video.
• Shortcuts (zie lijst met sneltoetsen)

Download

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

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

Screenshots

Subtitle Engine

De browser is erg slecht in het weergeven van ondertitels, dus ik moest een bibliotheek vinden die SSA/ASS ondertitels kan weergeven. Ik heb gekeken of ik WebVTT kon gebruiken, maar Chrome was niet echt in staat om ze te renderen zonder een grote zwarte doos eromheen.

Dus heb ik besloten om JavascriptSubtitlesOctopus te gebruiken, wat een emscripten project is dat libass in de browser laat werken met fontsupport. Ik heb echter enkele wijzigingen in het project moeten aanbrengen om het laden van het standaard.ttffile en het fonts.conffile dynamisch toe te staan. Ik heb ook een manier geïmplementeerd om de ondertitel track te veranderen zonder de WebWorker te hoeven herstarten die de engine draait.

Alle aanpassingen kunnen hier gevonden worden.

Build

Het bouwen van dit project zal resulteren in een crunchyroll-html5.user.js bestand in de/dist directory. Om het op Crunchyroll te laten draaien, moet je een auserscript header toevoegen die het mogelijk maakt om het script uit te voeren ophttp://www.crunchyroll.com/*. Ik heb het momenteel niet in staat gesteld om voor elke browser of userscript te bouwen.

Voor het bouwen moet u ervoor zorgen dat u Node.js en Yarn (optioneel) geïnstalleerd hebt. Daarna moet u de afhankelijkheden van het project installeren via Yarn.

Het bouwen wordt gedaan door het script build:

$ yarn build

Verpakken

U kunt de oude Firefox addon verpakken als firefox.xpi (niet ondertekend omdat het niet meer mogelijk is deze te ondertekenen) en de Web Extensie als webextension.zip (ondertekenbaar zie hieronder).

$ yarn package:firefox$ yarn package:webextension

Firefox ondertekenen

U kunt de Web Extensie ondertekenen. U hebt echter een API-sleutel en een API-secret nodig om de Web Extensie te kunnen ondertekenen (u kunt er hier een krijgen). Als u de ID van de extensie leeg laat, wordt er een nieuwe gegenereerd. U kunt de gegenereerde ID in de toekomst gebruiken om de extensie bij te werken in plaats van bij elke update een nieuwe aan te maken.

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

TODO

• Het bijhouden van de voortgang
  • Chrunchyroll
    • Het bijhouden van bekeken afleveringen
    • Gebruik Crunchyrolls hervattingsfunctie.
  • Kitsu
    • Tracking van bekeken afleveringen
  • MyAnimeList
    • Tracking van bekeken afleveringen
  • Local
    • Tracking van bekeken afleveringen
    • Het bijhouden van wat u in een video hebt bekeken.
    • Hervat video’s die u nog niet helemaal bekeken hebt.
  • …
• Mogelijkheid toevoegen om ondertiteling in andere talen te veranderen. Momenteel wordt alleen de standaard ondertiteling getoond (in de meeste gevallen zal dit Engels zijn).
• Meer lettertypen toevoegen. Momenteel is alleen Arial beschikbaar.
• Overweeg om de kwaliteitsselectie naar de speler te verplaatsen.
• Overweeg om Chromecast ondersteuning toe te voegen.
• Een eindscherm toevoegen om aan te geven dat de gebruiker klaar is met de huidige aflevering en misschien automatisch naar de volgende aflevering te gaan.
• Voeg meerdere versies van dit project toe voor gebruikersscripts, Chrome, Firefox en meer.
• Een manier toevoegen voor de speler om de keuzes van de gebruiker te onthouden zoals hoe hoog of laag het volume is.
• Kijk naar het verkleinen van de code in het userscript.

Hoofdbibliotheken

• hls.js
• JavascriptSubtitlesOctopus