utoroのJS解説

JavaScriptプログラムの解説。動作条件の説明があるので先頭から読んでください。

リズムを切り替えよう

今回はリズムパターンの切り替えをできるようにします。まずは下記のリンクを右クリックして、別ウインドウで開いてください。

サンプル9(リズムを切り替える)

右下の「Play」ボタンをクリックすると、メトロノームが鳴ります。では、その上にある「Pattern Number」セレクタを変えてみましょう。パターン0〜7にそれぞれ別のリズムパターンが入っており、演奏も編集もできるようになっています。

ソースを見ていきましょう。htmlはセレクトを1つ追加しているだけ。変更されればfunction changedrpt()が発動します。

変数var currdrptnbにパターンナンバーの数字が入ります。初期値は0です。function changedrpt()でセレクタの行数が入ります。ページロード時にdrar配列が読み込まれますが、前回のサンプル8ではdpn=0のパターンナンバー0に対してのみ読み書きを行っていましたが、今回はdpn=currdrptnbとして現在選択されているパターンナンバーに対する処理を行うようにさせています。function ded()も、function drartoscr()もその変更のみです。

そして実際の発音処理を行うfunction tick()でも、dpn=0だった部分をcurrdrptnbに置き換えただけです。つまり、実際には前回の時点でほぼ切り替えできる仕組みはできあがっていたのです。一度にたくさんのことを解説すると混乱するので、2回に分けて解説したというわけです。

これで編集し自動保存されたリズムパターンを切り替えて鳴らすことができるようになりました。