前項でAD-BOOK WINDについて紹介しましたが、実際にはその前段階としてAD-SoundPlayerのHTML5対応化とサウンド機能の復活にトライしています。前者はCSSとの兼ね合いがあるため短期集中で学習し、カットアンドトライで改訂作業に反映させました。後者は出力部分だけを新たなコマンドに置き換えています。オリジナルの設計が古いために、自分でもコードのフローがよくわからない部分もあり、いずれはコード全体を再設計する必要があると感じています。とりあえず今は動作すれば良しと考え、最低限の変更で済ませることにしました。

実は単に曲を再生するだけならJavascriptで簡単に実現できます。長らく放置していたのはその事実を単に知らなかったからで、トライするまではもっと大変かと思っていました。簡単にAD-SoundPlayerの動作を説明すると、再生コマンドで目的の曲を再生し、曲が終わるまでの時間をタイマーで待った上で、停止コマンドで止めるわけです。実際はリピートコマンドを発行しない限り、わざわざ止めなくても再生は終わるのですが、次の曲を再生するための時間待ちとしてタイマーを利用するわけです。従来のAD-SoundPlayerでは曲ことに再生時間をあらかじめ測定し、変数に時間をセットしていました。HTML5で実装されているサウンド機能では、曲の再生時間を取得するコマンドが用意されているため、これを読み出して待ち時間にセットしてやれば良いわけです。

ただし、曲の再生時間を取得できるのは曲が完全にロードされた後です。そのため再生前に読み出そうとしても値が取得できません。実験したところ再生が始まれば値が取得できることがわかり、再生後に所得することにしました。しかし、AD-SoundPlayerでは曲再生の前に時間待ちタイマーをセットするため、このままでは実現することができません。大掛かりな変更を避けるために考えたのは、曲データをあらかじめ全て読み込んで配列にセットしておくことです。AD-SoundPlayerは最大20曲まで登録できますが、これを初期設定時に全て読み込んでおくわけです。そうすれば再生前に曲の時間がわかり、事前にタイマーをセットすることができます。

実際、ローカルの環境では無事に成功して動作させることができました。ところがサイト上にアップしてネット経由で再度動作を確認したところ、初期のロードにかなり長い時間がかかり、フリーズしたようになったり突然曲を再生してコントロール不能になる等の障害が発生しました。どうやらブラウザ側のセキュリティによって動作を阻害されているようなのです。最新のブラウザでは転送データが大きくてCPUに過負荷がかかる等した場合に、セキュリティ上問題があると判定して動作を禁止する等の機能が搭載されています。Microsoft Edgeではサウンドデータを広告データと判定して、ご丁寧に警告を表示してデータのロードを停止します。これではローカルでは使えてもネット上では使用できません。この問題を回避するためには、一度にデータをロードするのをあきらめるしかありません。つまり、必要な時だけ最小限のデータをロードするわけです。どうやらAD-SoundPlayerでは、指定の曲を再生する時点で、その曲だけを直前にロードするしか方法は無さそうです。

では、どのようにして問題を回避したのでしょうか。前述したように再生を始めれば曲の時間を取得できるため、仮の値をセットしてとりあえず再生を始めることにしたのです。次に再生後一定時間待って曲の時間を取得します。この時間からそこまでの待ち時間を引いた上で、停止タイマーの時間を改めてセットします。手動で停止しない限りは、このタイマー時間が停止タイミングや次の曲の再生につなげるため、これまでのような再生が可能になります。先読みをしないためにブラウザのセキュリティにも抵触せず、うまく機能することが実証されました。

AD-SoundPlayerの画面自体は従来とさほど変わりませんが、テーブルレイアウトは使用していません。CSSだとシンプルにレイアウトを実現できるため、メンテナンスもしやすくなることがわかりました。

準備中・・・

---