Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support for prefers-reduced-motion #8494

Merged
merged 12 commits into from
Jul 19, 2019
Merged

Support for prefers-reduced-motion #8494

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
a9a2474
feat/reduced-motion: change animation duration to 0 when user has red…
Jul 16, 2019
b8448ad
Fix failing tests
Jul 16, 2019
b6078c2
address CR comments and add check to flyTo
Jul 18, 2019
874c650
fix CI errors
Jul 18, 2019
c96f042
fix flow error
Jul 18, 2019
2a84613
add unit tests
Jul 18, 2019
dc165f0
make tests more robust to CI timing issues
Jul 18, 2019
a5e1465
Merge branch 'master' of github.com:mapbox/mapbox-gl-js into feat/red…
Jul 19, 2019
8b96dc4
fix typo
Jul 19, 2019
e4f40a9
add js docs comments
Jul 19, 2019
602b17a
trim trailing whitespace
Jul 19, 2019
6f84951
fix yet another typo
Jul 19, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/ui/camera.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -679,7 +679,7 @@ class Camera extends Evented {
easing: defaultEasing
}, options);

if (options.animate === false) options.duration = 0;
if (options.animate === false || browser.prefersReducedMotion) options.duration = 0;

const tr = this.transform,
startZoom = this.getZoom(),
Expand Down
13 changes: 12 additions & 1 deletion src/util/browser.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,8 @@ const cancel = window.cancelAnimationFrame ||

let linkEl;

let _reducedMotionQuery: MediaQueryList;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: maybe remove the dangling _ in the name for consistency? This will be private anyway since it's not exposed.


/**
* @private
*/
Expand Down Expand Up @@ -53,7 +55,16 @@ const exported = {
},

hardwareConcurrency: window.navigator.hardwareConcurrency || 4,
get devicePixelRatio() { return window.devicePixelRatio; }

get devicePixelRatio() { return window.devicePixelRatio; },
get prefersReducedMotion(): boolean {
if (!window.matchMedia) return false;
//Lazily initialize media query
if (_reducedMotionQuery == null) {
_reducedMotionQuery = window.matchMedia('(prefers-reduced-motion: reduce)');
}
return _reducedMotionQuery.matches;
},
};

export default exported;