[編集モード] オーディオテスト

刷新されたオーディオ関連命令を一通りお試し。オーディオ長取得、設定でシークバー的な。オーディオ音量取得、設定でボリュームの変更も。／ファイル選択、画面上へのドラッグ＆ドロップでローカルのファイルを再生できるようにしたよ☆

!「https://n3s.nadesi.com/plain/nadesiko3-FileReader.js」を取込む。//ローカルファイル開く
音＝「https://n3s.nadesi.com/image.php?f=29.mp3」をオーディオ開く。
音長さ＝0。オーディオ再生位置＝0。音量＝1。曲再生中＝オフ。

# UI作成
ファイル選択作成して、オーディオファイル選択に代入。
オーディオファイル選択の「accept」に『audio/*』をDOM属性設定。
改行作成。改行作成。改行作成。

[0,100,0]の値指定バー作成して、シークバーに代入。
シークバーの「幅」に「300px」をDOMスタイル設定。
空のラベル作成して、シークバーラベルに代入。
再生オーディオ反映。

改行作成。
「再生」のボタン作成して、再生ボタンに代入。
「停止」のボタン作成して、停止ボタンに代入。
「一時停止」のボタン作成して、一時停止ボタンに代入。
「ループ再生」のボタン作成して、ループボタンに代入。
改行作成。
「音量(0～1)：」のラベル作成。
「－」のボタン作成して、音量下げるボタンに代入。
「＋」のボタン作成して、音量上げるボタンに代入。
「〔 {音量} 〕」のラベル作成して、音量ラベルに代入。

# イベント
シークバーの「onchange」に「再生位置変更」をDOMイベント設定。

再生ボタンをクリックした時には、
　再生位置表示。曲再生中はオン。
　音をオーディオ再生。
　1秒毎には(T)
　　再生位置表示。
　　もし、音長さ≦オーディオ再生位置ならば、
　　　Tのタイマー停止。音をオーディオ停止。
　　ここまで。
　　もし、曲再生中＝オフならば、Tのタイマー停止。
　ここまで。
ここまで。

停止ボタンをクリックした時には、
　曲再生中はオフ。
　音をオーディオ停止。
　再生位置表示。
ここまで。

一時停止ボタンをクリックした時には、
　曲再生中はオフ。
　音をオーディオ一時停止。
ここまで。

ループボタンをクリックした時には、
　再生位置表示。曲再生中はオン。
　音をオーディオループ再生。
　1秒毎には(T)
　　再生位置表示。
　　もし、曲再生中＝オフならば、Tのタイマー停止。
　ここまで。
ここまで。

音量下げるボタンをクリックした時には、
　音量＝音のオーディオ音量取得。
　もし、(０＜音量)かつ(音量≦１)ならば、
　　音量＝(音量-0.1)を2で小数点四捨五入
　　音を音量にオーディオ音量設定。
　　音量ラベルに「〔 {音量} 〕」をテキスト設定。
　ここまで。
ここまで。

音量上げるボタンをクリックした時には、
　音量＝音のオーディオ音量取得。
　もし、(０≦音量)かつ(音量＜１)ならば、
　　音量＝(音量+0.1)を2で小数点四捨五入。
　　音を音量にオーディオ音量設定。
　　音量ラベルに「〔 {音量} 〕」をテキスト設定。
　ここまで。
ここまで。

＃ローカルファイル
オーディオファイル選択の「onchange」に、「選択オーディオ取得」をDOMイベント設定。
DOCUMENTにファイルドロップした時には、
　　選択ファイルリスト＝対象。
　　オーディオファイル選択["files"]＝選択ファイルリスト。
　　ファイル＝選択ファイルリスト[0]
　　ファイルのオーディオファイル開いた時には
　　　音＝対象。
　　　再生オーディオ反映。
　　ここまで。
ここまで。

●選択オーディオ取得
　選択ファイルリスト＝オーディオファイル選択["files"]。
　ファイル＝選択ファイルリスト[0]。
　ファイルのオーディオファイル開いた時には、
　　音＝対象。
　　再生オーディオ反映。
　ここまで。
ここまで。

●再生オーディオ反映
　1秒後には
　　音長さ＝音のオーディオ長取得。
　　音量＝音のオーディオ音量取得。
　　音を0にオーディオ再生位置設定。//Firefoxのために０に戻す。
　　もし、(音長さ＝無限大)または(音長さ＝非数)または(音長さ＝未定義)ならば、
　　　シークバーラベルに「〔 00:00 / --:-- 〕」をテキスト設定。
　　違えば、
　　　音長さ＝音長さを切捨て。
　　　シークバーラベルに「〔 00:00 / {音長を時間計算} 〕」をテキスト設定。
　　　シークバーの「max」に音長さをDOM属性設定。
　　ここまで。
　ここまで。
ここまで。

# シークバー
●再生位置表示
　オーディオ再生位置＝音のオーディオ再生位置取得を四捨五入。
　シークバーにオーディオ再生位置をテキスト設定。
　もし、(音長さ＝無限大)または(音長さ＝非数)または(音長さ＝未定義)ならば、
　　音長さ＝音のオーディオ長取得。
　　もし、(音長さ＝無限大)または(音長さ＝非数)または(音長さ＝未定義)ならば、
　　　　シークバーラベルに「〔 {オーディオ再生位置を時間計算} / --:-- 〕」をテキスト設定。
　　　　戻る。
　　違えば、
　　　　音長さ＝音長さを切捨て。
　　　　シークバーの「max」に音長さをDOM属性設定。
　　ここまで。
　ここまで。
　　シークバーラベルに「〔 {オーディオ再生位置を時間計算} / {音長を時間計算} 〕」をテキスト設定。
ここまで。

●再生位置変更
　　オーディオ再生位置はシークバーのテキスト取得。
　　シークバーラベルに「〔 {オーディオ再生位置を時間計算} / {音長を時間計算} 〕」をテキスト設定。
　　音をオーディオ再生位置にオーディオ再生位置設定。
ここまで。

●（Aを）時間計算
　　hh＝(A/3600)を切捨を2でゼロ埋め。
　　mm＝((A-(hh*3600))/60)を切捨を2でゼロ埋め。
　　ss＝A-(hh*3600)-(mm*60)を切捨を2でゼロ埋め。
　　もし、hh＝０ならば
　　　　それは「{mm}:{ss}」。
　　違えば、
　　　　それは「{hh}:{mm}:{ss}」。
　　ここまで。
ここまで。

デバッグキャンバス: 幅 × 高

🍯 なでしこ3貯蔵庫

[編集モード] オーディオテスト

素材のアップロード