From 4a49cefbcac8a312574820eb3e52cab744289809 Mon Sep 17 00:00:00 2001 From: samtar Date: Fri, 12 Aug 2022 22:49:14 +0100 Subject: [PATCH] RealtimePreview.js: Respect prefers-reduced-motion Set inManualMode to the result of the current prefers-reduced-motion setting. Add another property (reducedMotion) for later UI/message work Bug: T314787 Change-Id: Ifeb8b996430830499945e73eca2dcfe0355c8046 --- modules/realtimepreview/RealtimePreview.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/modules/realtimepreview/RealtimePreview.js b/modules/realtimepreview/RealtimePreview.js index 88ee797b..0aacb7e8 100644 --- a/modules/realtimepreview/RealtimePreview.js +++ b/modules/realtimepreview/RealtimePreview.js @@ -59,7 +59,10 @@ function RealtimePreview() { // Manual mode widget. this.manualWidget = new ManualWidget( this, this.reloadButton ); - this.inManualMode = false; + // Set up a property for reducedMotion — useful for customising the UI message. + this.reducedMotion = window.matchMedia( '(prefers-reduced-motion: reduce)' ).matches; + // If the user has "prefers-reduced-motion" set, force us into manual mode. + this.inManualMode = this.reducedMotion; this.twoPaneLayout.getPane2().append( this.manualWidget.$element, this.reloadButton.$element, this.$loadingBar, this.$previewNode, this.errorLayout.$element ); this.eventNames = 'change.realtimepreview input.realtimepreview cut.realtimepreview paste.realtimepreview';