chinchiroのロジック解説(4)

サイコロを振るchin chiro rinの演出

今日は、コマンドラインに文字の演出が入る部分の解説をします。

chinchiro
今回はansi escapeの処理を使うので、npmのansi-escape-sequencesをインストールしておきます。

npm install ansi-escape-sequences

そうしたら、ansi escapeを使うファイルのトップレベルで、インポートを宣言します。

import ansi from 'ansi-escape-sequences'

これでひとまず準備はOK。 コード部分の解説に移ります。

  async sleep (time) {
    const _sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms))
    await _sleep(time)
  }

  async chinchirorin () {
    const texts = ['chin', ' chiro', ' rin']
    for (const text of texts) {
      process.stdout.write(text)
      await this.sleep(500)
    }
    process.stdout.write(ansi.erase.inLine(1) + ansi.cursor.nextLine(1))
  }

まず、上のsleep()メソッドについてです。演出のメソッドであるchinchirorinを作るにあたり、進行を止めておくメソッドが必要です。そうでないと全ての処理が一瞬で終わってしまい、何が起きたかわからなくなってしまいます。 sleepメソッドによって、処理を止めて段階的にゲームの進行が表示されるように出来ます。

メソッドchinchirorintextsで定義した配列の文字列を、0.5秒ごとに順番に表示するメソッドです。

特に注目してもらいたいのが、最後のprocess.stdout.write(ansi.erase.inLine(1) + ansi.cursor.nextLine(1)の部分です。 ここのansi.erase.inLine(1)で表示したchin chiro rinの文字列を消して、ansi.cursor.nextLine(1)でカーソルを元の位置に戻しています。 なぜ文字を消すかといえば、進行に関係ない演出の部分なので、消してログを見やすくするためです。 ログを見ればゲームの進行がわかるような情報を残すようにしています。