Giter Club home page Giter Club logo

cr-fixes's Introduction

Deprecation Notice

CR-Fixes in no longer in development and only ever worked with the old (pre 2022-10) website design.
Feel free to fork it though, if anything seems useful to keep around for use iwth the new design.


CR-Fixes

logo

What is this

This extension attempts to add some functions to the crunchyroll webpage, that I felt were direly needed. Like toggable autoplay, so you can read the comments at the ned of the video without being interrupted by a redirect. A dark mode so you can watch your animes alone and in the darkness without burning your eyes.
All options can be disabled individually, so you can avoid conflicts with your already existing customisations. In fact, if you are only interested in the visual changes (darkmode, player resize, background), these can all be achieved with already existing plugins and user-scripts across most browsers.1 In case of the video quality selection, there was one user script I know of that did this, but this script doesn't work anymore. However toggable autoplay and the hierachical multi-langual subtitle selection are to my knowledge as off publishing this unique to this extension. THe language selection lets you define language orders like:
German -> English -> Spanish (Spain... -> Off
and the first of these languages available for your video will be selected.

For a full list of options, see the Settings section below.

Why does this need Permissions 'X' ?

Alright, here are all permissions requested by this extension, as well as a short explanation what it is needed for:

storage

This is needed to save the settings

activeTab

This is an optional permission, that might be requested on runtime, though usually the request is silently granted by the browser without any need for user interaction. It is required to dynamically update the theme of the current tab as a preview of what this theme looks like. This happens when the theme is changed via the popup menu.
It is also required to inject the playerSettings scripts into the player iframe (along with the host permissions for www and static.crunchyroll.com).

cookies

Requiered for "Experimental: Request DRM-free streams", see Settings section for details about what this does. Cookies can only be edited cookies for whose domains the host permission was granted.

Host-permission: "*//*.crunchyroll.com/*"

Well, this extension changes stuff on www.crunchyroll.com. Also the player frame is loaded from static.crunchyroll.com, thus only requesting "*://www.crunchyroll.com/*"* would not be sufficient.
As the cookies for "Experimental: Request DRM-free streams" must be set for the domains .crunchyroll.com (all subdomains), the extension also requests the host permission for all subdomains instead of only www and static.

Settings

Generally speaking all changes to settings require the website to be reloaded(F5), unless stated otherwise. All cahnges to settings made in the popup need to be saved before they take full effect.

Enable Autoplay

Default: false
If set to true autoplay of next episode is allowed; this is the current website behaviour.
If set to false autoplay will be blocked. This setting takes effect as of the moment it is saved
This setting can be set via the popup menu

Use Darktheme

Default: true
If set to true a custom css stylesheet will be injected into all normal crunchyroll.com pages with a dark color palette (with some ornage highlights).
If set to false no action is performed.
Set this to false, if you wish to keep the default style or if using a different extension or script to change the style of crunchyroll.com sites. This setting can be set via the popup menu
If this setting is toggled via the popup menu and the active tab is a crunchyroll webpage, a preview of the darktheme/normal theme will be directly displayed. For it to take full effect saving is requiered and a refresh might also be necessary under certain conditions.2

Resize Player

Default: true
If set to true the player container will be resized according to the values defined in the input boxes. The default resize values are meant to fill the width of the template_container object, to not interfere with a possible background image. Also if this is set to true any possible signup-box will be removed to make space for a larger video container.
If set to false, no action will be taken.

16:9 Player and 5:3 Player x,y values

Default 16:9: 960 x 540
Default 16:9: 960 x 576
These customise the player size, if Resize Player is set to true. The values are set in pixel units. You may either enlarge or shrink the player. Minimum length is 0 and maximum length is 9999.

Custom Background

Default: false
Default URL: <empty string> If set to true, the extension will attempt to inject a custom background image into the body of all crunchyroll pages and redefine the image on alll template_skin_splashlink objects, if present, though the splashlink object will still be present and clickable. How backgrounds set by users on their userpage are treted depnds on the "Force background" option.
If set to false no action will be taken.

Force background

Default: false
If set to false custom backgrounds on crunchyroll userpages are respected, but if a crunchyroll user did not set a background for their userpage, the background will be replaced.
If set to true the background chosen by the user of this extension will replace all other backgrounds.

Sp: Top Simulcast

Default: false
If set to true the 'Simulcasts' section on the startpage will be moved above the news section. (Simulcasts will be on top of all other sections directly below the news carousel)

Custom Navbar

Default: false
If set to true the Navbar on all regular Crunchyroll pages, will be modified according to your selection. With this it is possible to readd the 'Forum' tab and remove unneccessary tabs.

Navbar: ×××

Default: true iff CR has this in their default navbar as of writing
If set to true will keep/add tab '×××' to the navbar. If set to false, remove tab '×××' from the navbar.

Default Video Quality (disabled)

Disabled unti #2 has been resolved
Default: none
If not default value, 'activeTab' permission is required
If set to something other than none, the extension will try to set the video quality to the given value when the page is loaded.
Available values: none, auto, 1080, 720, 480, 360, 240

Subtitle Languages (disabled)

Disabled unti #2 has been resolved
Default: <empty string>
If not default value, 'activeTab' permission is required
If not empty the extension will try to set the subtitle language according to this option, regardless of the language of the crunchyroll website. The value of this setting will be processed as follows:

  1. If the value is an empty string, no action will be taken.
  2. The string will be split with ';' as a seperator. Each element of this string represents one language.
  3. A language specified by the user is available if in the player subtitle menu, there is an entry that whose start is identical to the language. E.g. the entry French (France... will be matched by either F, French or French (France, but will not be matched by French (France).
  4. If the first language is an available option, this language will be selected.
  5. Otherwise the extension will move on to the second language requested by the user.
  6. This continous until a language could be set or there are no more languages set by the user.

Please note that all languages must exactly match the start of their counterparts in the player options menu. E.g. the entry for German in the player menu is German (German..., so German, Ger, G or German (German... will all match, but german, g, GER or German (Germany) would not match. If you wish to set Spanish, including the part after the parantheses might be necessary to match your desired language as the player has entries for Spanish (Spain.. and Spanish (Latin.... Only requesting Spanish might yield either of these choices.

Advanced Settings

Experimental: Custom Segment-Id

Default: false Dispatches a custom Trebeck SegmentId Event setting your tracking id to no. Has been reported to be useful in some cases where the real event was not executed properly. If you don't know what this is and don't have any problems you probably don't need this, though it should do no harm.

Log Level

Default: Warnings
Tells the extension what messages should be logged to console. By default only errors and warnings are logged. When submitting error reports, please use "Debug" for logs.

Removed settings

Experimental: Request DRM-free streams

Removed: Cookie no longer acknowledged, but fallback to HLS by default if no Widevine supported
Default: true
When saving settings with this as true, and on browser start if this is set to true: Setting "VILOS_DRM_ROLLOUT" cookie to the non-drm value. As crunchyroll might stop respecting this cookie value at any time, this is marked as an experimental feature.

Installation

addons.mozilla.com

This extension is now avialable at https://addons.mozilla.org/en-US/firefox/addon/cr-fixes/

Latest master commit

Clone this repo, build and then either:

  • load as temporary extension
  • OR
  • pack the contents of the build folder (without root folder) yourself and install from file in Firefox after allowing unsigned installs

For Developers

Contributing

Just send me Pullrequest or open an issue, explaining the changes made and/or the problems encountered. Please note that this projected is licensed under the GPLv3. If you contribute to this project, you consent to also release your contribution under the terms of the GNU General Public License version 3.

Build instructions

Just run make. This will copy all the files inside the extension folder to the build folder (will be created if necessary) and process all //#INCLUDE instructions.

Build Dependencies

  • GNU make
  • awk
  • find
  • Some POSIX-compliant shell available as sh

The build was tested with GNU Make 4.1 ; GNU Awk 4.1.4 and find (GNU findutils) 4.7.0-git on GNU/Linux 5.0.0-20-generic x86_64. Known to work shells are bash, bash --posix, dash and ash.

File hierachy and file names

All webpages and their corresponding scripts and css are located in extensions/extension_pages.
All scripts meant to modify crunchyroll are located in extension/js. All content script files start with cs_, all js files that only define functions and constants start with lib_, all scripts that are injected via browser.tabs.executeScript start with in_ and all background scripts start with bg_.
All stylesheets for crunchyroll.com are located in extension/css.


1: In fact the darktheme provided here is a modified version of tholinka's dark crunchyroll plugin, which can be found here: https://github.com/tholinka/Dark-Crunchyroll-Plugin

2: If the active tab was a series overview page (where all the episodes are listed) a refresh is necessary to change the container colour. And for the dark/not-dark mode to take effect in other tabs, that were not active when toggling via popup, a refresh is also necessary.

cr-fixes's People

Contributors

theoneric avatar

Watchers

 avatar

cr-fixes's Issues

Quality & language selection broken

Since Ellation/Crunchyroll transitioned to the new new HTML-Player (early 2020) the language and quality auto selection does no longer work. So far so unsurprising. The catch is that the HTML-Elements did not just get moved/renamed but rather the player now removes and adds HTML-elements every time they want to show some player UI.
Not only is this very inefficient, it also means that we can no longer easily trigger the button events to set quality and language – there are no buttons.
Simulating mouse movements seems difficult or impossible as Firefox places restrictions on those for security reasons, so getting the buttons to show up is also difficult.

Frankly, I don't see a way to get this to work without ridiculous effort like locating the right calls in the minified JS code, which frequently changes.
If anybody feels like figuring out a solution, that doesn't break with every minor update of CR's js code, I'll accept GitHub-pullrequests or git format-patch per email.

In the meantime I'll disable those options in settings.


Footnote:
Apparently they are using React[1] which seems to have a more convenient way for devs to add and and delete HTML-Nodes, which might explain why this is done so needlessly inefficient (disabling and enabling is not only faster, but also still easier than Reacts adding/deleting btw).

[1]: https://web.archive.org/web/20200203224503/https://blog.ellation.com/velocity-crunchyrolls-universal-react-player-e70a61b6dfa7?gi=1aaf43b55389

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.