読者です 読者をやめる 読者になる 読者になる

S.F. Page

Programming,Music,etc...

Web Audio APIのモジュラー接続デモを作ってみる(17) - localStorageを使ってデータ保存・読み込みを作る

Web Audio API JavaScript HTML5 Audio WebAudioModuler

コードを改良するたびにテスト用のモジュラー接続を作ったりデータ入力をするのが面倒なのでlocalStorageに保存するようにしてみた。Bugはあるがとりあえず保存・読み込みができるようになった。データ形式はJSONである。例によってChromeのみで動作する。

http://sfpgmr.github.io/webaudiomoduler/dist/20151206/

使い方だが、マウス操作は以下のとおりである。

  • 右クリックでノードの挿入。
  • 端子間のドラッグで接続。
  • ノードを右クリックでプロパティ表示。
  • Shift + 左ボタンクリックでノード・もしくは接続の削除。
  • オシレータノード上でCtrl + 左クリックで発音開始。

シーケンス・エディタの機能は今のところ以下の通りである。

キー 機能
[←] カーソルを一つ左に動かす。
左端にカーソルがある時は、1行上の右端に移動します。
[→]/[SPACE] カーソルを一つ右に動かす。
右端にカーソルがある時は、1行下の左端に移動します。
[↑] カーソルを一つ上に動かす。
上端にカーソルがある時は、1行ロールダウンします。
[↓] カーソルを一つ下に動かす。
下端にカーソルがある時は、1行ロールアップします。
[PgUP]/[CTRL]+[ C ] 1ページ先に進める。
[PgDown]/[CTRL]+[ R ] 1ページ前に戻す。
[SHIFT]+[PgUP] 高速スクロールアップ
[SHIFT]+[PgDown] 高速スクロールダウン
[Home] 先頭行に戻す。
[End] 最終行に進める。
[RET] カーソルのある行にノートデータを挿入する。
[CTRL]+[ Y ] 行削除カーソルのある 行を削除行バッファに移動する。
[CTRL]+[ L ] 行復活カーソルのある行に削除行バッファの内容を挿入する。
[ * ] メジャーエンド カーソルのある行に小節線を引く。
[CTRL]+[Z] アンドゥ
[CTRL]+[A] リドゥ

気が付くとエディタ部分もきちんと動作しない部分ができてしまっている。まだ修正し切れていない。 使えるようになるまでは先は長い。