orientation

Read device orientation events and lock/unlock the screen orientation via the DeviceOrientation and Screen Orientation APIs.

Import: @rtorcato/browser-common/orientation

📖 MDN: DeviceOrientationEvent · 📊 caniuse: deviceorientation

iOS 13+ Safari requires an explicit user-gesture permission grant (see motion's requestMotionPermission, which covers orientation too).

Browser support

API	Chrome	Edge	Firefox	Safari	iOS Safari	Baseline
DeviceOrientationEvent	✅ 7+ [1]	✅ 12+	✅ 6+ [2]	✅ 17+	✅ 4.2+	Widely available
ScreenOrientation	✅ 38+	✅ 79+	✅ 43+	✅ 16.4+	✅ 16.4+	Widely available

1. Chrome: Before version 50, Chrome provided absolute values instead of relative values for this event. Developers still needing absolute values may use the deviceorientationabsolute event.
2. Firefox: Firefox 3.6, 4, and 5 supported mozOrientation instead of the standard DeviceOrientationEvent interface.

✅ supported · ◐ partial · ❌ not supported · [n] see note. Generated from MDN browser-compat-data and web-features. caniuse: DeviceOrientationEvent · ScreenOrientation

Example

import {
  isDeviceOrientationAvailable,
  onDeviceOrientation,
  lockScreenOrientation,
  unlockScreenOrientation,
} from '@rtorcato/browser-common/orientation'

if (isDeviceOrientationAvailable()) {
  const off = onDeviceOrientation((e) => console.log(e.alpha, e.beta, e.gamma))
  off()
}

await lockScreenOrientation('landscape-primary')
unlockScreenOrientation()

Exports

• isDeviceOrientationAvailable() — feature check for DeviceOrientationEvent
• onDeviceOrientation(callback) — subscribes to orientation changes, returns an unsubscribe function
• getScreenOrientationType() — current orientation type (e.g. 'portrait-primary')
• lockScreenOrientation(type) — locks the screen to an orientation, if supported
• unlockScreenOrientation() — unlocks the screen orientation, if supported

See the API reference for full signatures.