[Userscript] Derpibooru WebM Volume Toggle (1.3.1)

Marker
My Little Pony - 1992 Edition
Wallet After Summer Sale -
Magnificent Metadata Maniac - #1 Assistant
Not a Llama - Happy April Fools Day!

Misanthrope
Derpibooru WebM Volume Toggle
 
A stopgap solution until Derpibooru implements the feature natively.
 
Shows a toggleable icon on the top left of all webms that contains an audio track.  
On the image page the icon is hidden until you hover over the image.
 
Download from Github  
Download from OpenUserJS
 
Requires Violentmonkey  
Firefox users are required to install Laboratory by Mozilla and follow the instructions here.
 
version 1.3.0:  
  • Added option to auto mute videos when scrolled out of view.  
    version 1.2.2:  
  • Fix webm sometimes stuck in paused state  
    *version 1.2.0  
  • Added the option to always load full size video  
    version 1.1.0:  
  • Settings could now be found at Derpibooru’s Content Settings page, under the new ‘Userscript’ tab. And should now carry across script updates.  
  • Added the option to disable browser’s native video control  
  • Added the option to enable audio by default.
     
    full  
    full
Marker
My Little Pony - 1992 Edition
Wallet After Summer Sale -
Magnificent Metadata Maniac - #1 Assistant
Not a Llama - Happy April Fools Day!

Misanthrope
version 1.0.14 update:
 
Added options to  
  • replace GIF preview with webm thumbnails  
  • pause webm videos when tab is in background  
    Both defaults to off, edit the source code to enable.
Marker
My Little Pony - 1992 Edition
Wallet After Summer Sale -
Magnificent Metadata Maniac - #1 Assistant
Not a Llama - Happy April Fools Day!

Misanthrope
I increase the font-size from 2em to 2.5em on the image page. you can test it out by adding font-size: 2.5em; to the CSS selector #image_target .volume-toggle-button.
Marker
My Little Pony - 1992 Edition
Wallet After Summer Sale -
Magnificent Metadata Maniac - #1 Assistant
Not a Llama - Happy April Fools Day!

Misanthrope
StSyaN  
You mean stick it in that nicely commented section at the top? Sure I guess, but you’d ended up editing the source anyway, as those configs doesn’t carry over across script updates.
stsyn
Lunar Supporter - Helped forge New Lunar Republic's freedom in the face of the Solar Empire's oppressive tyrannical regime (April Fools 2023).
Elements of Harmony - Had an OC in the 2022 Community Collab
Non-Fungible Trixie -
Twinkling Balloon - Took part in the 2021 community collab.
Notoriously Divine Tagger - Consistently uploads images above and beyond the minimum tag requirements. And/or additionally, bringing over the original description from the source if the image has one. Does NOT apply to the uploader adding several to a dozen tags after originally uploading with minimum to bare tagging.
Best Artist - Providing quality, Derpibooru-exclusive artwork
Fine Arts - Two hundred uploads with a score of over a hundred (Safe/Suggestive)
Economist -
Cool Crow - "Caw!" An awesome tagger
The Power of Love - Given to a publicly verified artist with an image under their artist’s tag that has reached 1000 upvotes

Moderator
@Marker  
>You mean stick it in that nicely commented section at the top?  
Yeah
 
>…but you’d ended up editing the source anyway, as those configs doesn’t carry over across script updates.  
I know, the only solution is localStorage. But if nothing will change on derpibooru, there should not be many script updates…
Marker
My Little Pony - 1992 Edition
Wallet After Summer Sale -
Magnificent Metadata Maniac - #1 Assistant
Not a Llama - Happy April Fools Day!

Misanthrope
Script updated to 1.0.15
 
StSyaN  
>there should not be many script updates…  
Oh you’d be surprised how many bugs I often find in my code after I publish it.
Marker
My Little Pony - 1992 Edition
Wallet After Summer Sale -
Magnificent Metadata Maniac - #1 Assistant
Not a Llama - Happy April Fools Day!

Misanthrope
So, apparently on Firefox the webm thumbnails aren’t muted when they were inserted into the page, leading to a terrible cacophony on the gallery when displaying webms. Version 1.0.16 fixes this bug.
 
Also, I’ve been trying to solve the problem of Chrome occasionally seizing up when trying to load/play multiple webms simultaneously (48 in my case), this will affect you if you have SERVE_WEBM_THUMB or PAUSE_IN_BACKGROUND enabled. If you’re one of those severely affected, -try the experimental version that I’m working on, it’s still terribly buggy and leaks memory on rare occasions but hopefully makes the problem occur less frequently. It also contains enough logging to deforest the Amazon. Edit: Nevermind don’t use the script the memory leak is bad.
Marker
My Little Pony - 1992 Edition
Wallet After Summer Sale -
Magnificent Metadata Maniac - #1 Assistant
Not a Llama - Happy April Fools Day!

Misanthrope
Update 1.1.0
 
  • Settings could now be found at Derpibooru’s Content Settings page, under the new ’Userscript’ tab. And should now carry across script updates.  
  • Added the option to disable browser’s native video control  
  • Added the option to enable audio by default.
Marker
My Little Pony - 1992 Edition
Wallet After Summer Sale -
Magnificent Metadata Maniac - #1 Assistant
Not a Llama - Happy April Fools Day!

Misanthrope
Update 1.2.0
 
  • New feature: Added setting to load full sized WebMs, disabled by default.
     
    Why?  
    The scaled WebM videos on Derpibooru are encoded with an maximum average bitrate of around 1000 ~ 1500 kb/s. However this is not always enough for complex scenes, causing heavy blocking artifacts if ‘scale large images’ is enabled and the videos are scaled to your window size.  
    An example is this cinemagraph >>1711590: Compare the full size video with the scaled ‘large’ version and the distinction should be clear.
Marker
My Little Pony - 1992 Edition
Wallet After Summer Sale -
Magnificent Metadata Maniac - #1 Assistant
Not a Llama - Happy April Fools Day!

Misanthrope
Update 1.2.2  
  • Fix webms sometimes stuck in paused state when “Pause in background” or “Enable sound by default” are enabled.
Marker
My Little Pony - 1992 Edition
Wallet After Summer Sale -
Magnificent Metadata Maniac - #1 Assistant
Not a Llama - Happy April Fools Day!

Misanthrope
Version 1.3.1 - Fix for webms sometimes not playing when navigated with the browser’s back/forward button. A really minor change, but if your webms starts fucking up you know who to blame.
Interested in advertising on Derpibooru? Click here for information!
Champions of Equestria

Help fund the $15 daily operational cost of Derpibooru - support us financially!

Syntax quick reference: **bold** *italic* ||hide text|| `code` __underline__ ~~strike~~ ^sup^ %sub%

Detailed syntax guide