Audio - cwtickle/danoniplus GitHub Wiki
English | Japanese
| < ローカルストレージ仕様 | オーディオ仕様 | 速度変化・Motionオプション仕様 > |
オーディオ仕様 / Audio
- Dancing☆Onigiri (CW Edition)における音源再生は、可能な限りWeb Audio APIを使うことで音源の再生遅延を抑えています。
しかし、Web Audio APIの仕様で利用できないケースがあり、一部でHTMLのAudio要素を使用しています。
Web Audio APIに対応しているパターン
- :heavy_check_mark: 対応 / :x: 未対応 (HTML Audioで代用)
- ローカル/リモートどちらでも再生遅延を抑えるには、楽曲データをjs化するのが早いです。
※js, txt形式(エンコード有)は楽曲データをjs化(エンコード)したデータのことです。
ダンおに曲データjs化ツールにて変換したデータを作成できます。
| mp3, ogg形式 | js, txt形式(エンコード有) | |
|---|---|---|
| ローカル (htmlを直接開く方法) | :x: | :heavy_check_mark: |
| ローカル (Xamppを使用してサーバーを立てる方法) | :heavy_check_mark: | :heavy_check_mark: |
| リモート (Web上にアップロードして公開した状態) | :heavy_check_mark: | :heavy_check_mark: |
HTMLのAudio要素を使用した場合の制限
-
HTMLのAudioはWeb Audio APIよりも機能が制限されます。
現状、以下の事象を確認しています。 -
:heavy_check_mark: 問題なし / :warning: 一部問題あり / :x: 機能使用不可
| Web Audio API | HTML Audio | |
|---|---|---|
| フェードインによる譜面ズレ | :heavy_check_mark:ズレなし | :warning:音源によりずれることがある |
| 音量設定 | :heavy_check_mark:問題なし | :heavy_check_mark: (Windows) 問題なし:x: (Mac / iPad) 常時100% |
| フェードイン音量 | :heavy_check_mark:問題なし | :heavy_check_mark: (Windows) 問題なし:x: (Mac / iPad) フェードインしない |
| フェードアウト音量 | :heavy_check_mark:問題なし | :heavy_check_mark: (Windows) 問題なし:x: (Mac / iPad) フェードアウトしない |
| 小数のAdjustment | :heavy_check_mark:有効 | :x:無効 |
詳細比較
| 項目 | AudioPlayerクラス | 標準Audioインスタンス |
|---|---|---|
| 内部実装 | Web Audio APIのAudioContext/AudioBufferSourceNodeをラップした独自クラス | ブラウザ標準のHTMLAudioElement |
| 使用対象 | エンコード済み音源(.js/.txt、base64) | 通常の音源ファイル(url指定・非エンコード) |
| 音源読み込み | init(_arrayBuffer)でdecodeAudioDataを呼びバッファをデコード |
.srcにURLをセットしloadedmetadataイベントを待つ |
| 再生開始 | play(_adjustmentTime):AudioContext.currentTimeにg_scheduleLead+調整値を加えてスケジューリング |
.play()(標準API、即時) |
| 停止 | pause()はAudioBufferSourceNode.stop(0)、close()でノード自体を破棄 |
.pause()+removeAttribute('src')/.load()でリセット |
| シーク(currentTime) | set currentTimeは実際には_fadeinPositionを更新するのみで、反映にはpause()→play()の再起動が必要 |
ネイティブプロパティとして直接シーク可能(timeupdateイベントも発火) |
| 経過時間取得 | elapsedTimeゲッター:AudioContext.currentTimeと_scheduledTimeの差分から算出(playbackRate・g_scheduleLead・フェードイン位置を加味) |
.currentTime(ブラウザ管理) |
| ループ終了・区間監視 | timeupdateイベントが発火しないため、elapsedTimeをpoll関数でポーリング監視(repeatBGM) | timeupdateイベントでcurrentTime >= musicEndを判定 |
| ミュート | _gain.gain.valueを0/保存値に切り替える独自実装(_savedVolumeで音量を保持) |
ネイティブ.mutedプロパティ |
| その他インターフェース互換 | addEventListener/removeEventListener/load/dispatchEventなどを空実装または独自実装で提供し、Audioと同様のインターフェースを模倣 | ネイティブ実装 |
iOSにおける開始方法の違い
- iOSの場合、ユーザ操作無しに楽曲を自動再生することができません。
このため、iOSに限り開始直前に開始確認ボタンを追加しています。
関連項目
- 疑似フレーム処理仕様
- endFrame :pencil: プレイ終了フレーム数
- fadeFrame :pencil: フェードアウト開始フレーム数
- adjustment :pencil: 譜面位置の初期調整-
| < ローカルストレージ仕様 | オーディオ仕様 | 速度変化・Motionオプション仕様 > |