forked from AkkomaGang/akkoma-fe
Disabled aggressive matching for reduced motion (we search for gif now)
This commit is contained in:
parent
3e64d78d05
commit
1056b89fd1
1 changed files with 12 additions and 8 deletions
|
@ -40,17 +40,21 @@ const StillImage = {
|
||||||
this.imageLoadError && this.imageLoadError()
|
this.imageLoadError && this.imageLoadError()
|
||||||
},
|
},
|
||||||
detectAnimation (image) {
|
detectAnimation (image) {
|
||||||
|
const mediaProxyAvailable = this.$store.state.instance.mediaProxyAvailable
|
||||||
|
|
||||||
|
// harmless CORS errors without-- clean console with
|
||||||
|
if (!mediaProxyAvailable) {
|
||||||
// It's a bit aggressive to assume all images we can't find the mimetype of is animated, but necessary for
|
// It's a bit aggressive to assume all images we can't find the mimetype of is animated, but necessary for
|
||||||
// people in need of reduced motion accessibility. As such, we'll consider those images animated if the user
|
// people in need of reduced motion accessibility. As such, we'll consider those images animated if the user
|
||||||
// agent is set to prefer reduced motion. Otherwise, it'll just be used as an early exit.
|
// agent is set to prefer reduced motion. Otherwise, it'll just be used as an early exit.
|
||||||
if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
|
if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
|
||||||
|
// Only for no media-proxy for now, since we're capturing gif, webp, and apng (are there others?)
|
||||||
|
// Since the canvas and images are not pixel-perfect matching (due to scaling),
|
||||||
|
// It makes the images jiggle on hover, which is not ideal for accessibility, methinks
|
||||||
this.isAnimated = true
|
this.isAnimated = true
|
||||||
}
|
}
|
||||||
|
return
|
||||||
const mediaProxyAvailable = this.$store.state.instance.mediaProxyAvailable
|
}
|
||||||
|
|
||||||
// harmless CORS errors without-- clean console with
|
|
||||||
if (!mediaProxyAvailable) return
|
|
||||||
|
|
||||||
// Browser Cache should ensure image doesn't get loaded twice if cache exists
|
// Browser Cache should ensure image doesn't get loaded twice if cache exists
|
||||||
fetch(image.src, {
|
fetch(image.src, {
|
||||||
|
|
Loading…
Reference in a new issue