Phaser3でスマホ対応ブラウザゲームを作る

横向きゲームの場合、ユーザがゲームプレイ時に画面を横向きにしていなければ勧告ダイアログを出したい。
また、ユーザがプレイの途中で画面を縦向きにした時にもダイアログを出したいかもしれない。
これは画面角度取得と、画面回転時のイベント発生を利用して実現することができる。

<script>
      /**
       * [Event] ロード完了 (onload)
       */
      window.onload = () => {
        forceHorizon();
      };
      /**
       * [Event] 画面回転 (orientationchange)
       */
      window.addEventListener('orientationchange', () => {
        forceHorizon();
      });

      function forceHorizon() {
        // スマホ・タブレットじゃないなら回転判定をしない
        if (!navigator.userAgent.match(/(iPhone|iPad|iPod|Android)/i)) return;
        if (isNotHorizon()) alert('横向きにするほよ');
      }

      // 縦向きか判定
      function isNotHorizon() {
        // 角度を取得
        let angle = screen && screen.orientation && screen.orientation.angle;
        if (angle === undefined) {
          angle = window.orientation; // iOS用
        }
        return angle === 0;
      }
    </script>

参考 HTML5 スマホの縦向き/横向きを検知する