Nourishing Pear Medley

    device-orientation-manager
    TypeScript icon, indicating that this package has built-in type declarations

    0.8.0 • Public • Published

    DeviceOrientationManager

    A manager which will help you to control DeviceOrientation easily.

    This manager supports graceful degradation, configurable frequency and smoothing.

    Usage

    Install:

    npm i device-orientation-manager --save

    Then:

    import DeviceOrientationManager from 'device-orientation-manager';
     
    const options = {
      // Frequency, number, defaults to 10.
      // Event will be emitted every (1000 / freq)ms.
      freq: 10,
      // Allow user to control by mouse or touch? boolean | 'auto', defaults to 'auto'.
      // If 'auto', mouse controlling will be enabled on pc, touch controlling will be enable on mobile without supporting deviceorientation event.
      enableMouseOrTouch?: 'auto',
      // Field will be controlled, defaults to null.
      container?: HTMLElement,
      // User defined orientation mode, defaults to 'auto'.
      // If 'auto', orientation will be auto changed by window.orientation.
      orientation?: 0 | 90 | 180 | -90 | 'auto',
      // Filter smoothing, defaults to .5.
      // Larger smoothing, larger weight for current value.
      filterSmoothing?: number,
      // Filter window size, defaults to 10.
      // The larger size, better effect and larger delay for current value.
      filterWindowSize?: number 
    }
     
    const doManager: DeviceOrientationManager = new DeviceOrientationManager(options);
    // change options after constructor
    doManager.freq = 30;
     
    doManager.addEventListener(
      'orientationchange',
      orientation => {
        // 0 | 90 | 180 | -90
        console.log(orientation);
      }
    );
     
    doManager.addEventListener(
      'deviceorientation',
      ({yaw, pitch, roll, order, orientation}) => {
        console.log({
          // -PI ~ PI
          yaw,
          // -PI ~ PI
          pitch,
          // -PI / 2 ~ PI / 2
          roll,
          // 0 | 90 | 180 | -90
          orientation,
          // 'YXZ'
          order 
        });
     
        const q0 = new Quaternion();
        const q1 = new Quaternion().rotateX(-Math.PI * 80 / 180);
        const euler = new Euler();
        euler.set(pitch, yaw, roll, order);
        camera.quaternion.fromEuler(euler);
        camera.quaternion.multiply(q1);
        camera.quaternion.multiply(q0.setAxisAngle(new Vector3(0, 0, 1), -orientation));
      }
    );
     
    doManager.start();
     
    // If you want to stop
    doManager.stop();

    Install

    npm i device-orientation-manager

    DownloadsWeekly Downloads

    0

    Version

    0.8.0

    License

    MIT

    Unpacked Size

    19.6 kB

    Total Files

    7

    Last publish

    Collaborators

    • dtysky