音楽プレーヤーのコード生成

機能

• 1行に1曲「タイトル|URL」。全角の縦棒やタブも区切りとして扱います（入力方式・表からの貼り付け）
• 自己完結した出力：`<audio>` 1つ、`<ol>` の再生リスト、`<style>`、`<script>`。依存なし
• スクリプトはページ上のすべての `.mp` を初期化。2つ貼っても共存します
• 1曲終わると次へ進み、最後で停止（または1曲リピート）
• タイトルと URL は `data-` 属性にのみ入る —— データが JS のソースを通らないぶん、エスケープが1層減ります
• タイトルと URL の引用符・山括弧・& は HTML エスケープします
• アクセント色は選択行に使い、その文字色はコントラストから計算して黒か白を選びます
• javascript: などの擬似プロトコルは拒否します（生成されるページにそのまま書き込まれるため）

使い方

1. 1行に1曲「タイトル|音声URL」を書きます（URL だけでも可）
2. 再生リスト・自動再生・リピートを切り替え、先読み方法を選びます
3. アクセント色を選びます
4. 生成された HTML をコピーし、ページの好きな場所に貼ります

よくある質問

自動再生が動かないことが多いのはなぜですか？

ブラウザが音声つきの自動再生を既定でブロックするからです —— 操作なしに音を出すのは迷惑行為と見なされます（だからこの項目は既定でオフです）。生成されるコードは `audio.play().catch(() => {})` と書いてあり、ブロックされたときに NotAllowedError をコンソールに出さずに握りつぶします。本当に自動再生したい場合は `<audio>` に `muted` を付けてください（ミュートなら許可されます）。

audio 要素の複数ファイル対応を使わず、リストを自作するのはなぜですか？

そんな機能がないからです —— `<audio>` が再生するのは1つの `src` だけです。HTML に再生リストを作れるネイティブ要素はありません（`<video>` にもありません）。そこで短いスクリプトがリストを駆動します：行をクリックすると `src` を差し替えて再生し、終われば次の曲へ進みます。出力にタグだけでなくスクリプトが必要な理由です。

同じページに2つ置くと干渉しますか？

しません。生成されるスクリプトは `document.querySelectorAll(".mp")` を走査し、見つかった各プレーヤーが自分の `<audio>` とリストを保持するため、2つでも10個でもそれぞれ動きます。ただし片方が再生を始めても他方は止まりません（相互排他はしません）—— それが欲しい場合は数行ご自身で追加してください。生成器がその判断を代行することはしません。

音声ファイルに条件はありますか？

ネイティブの `<audio>` は MP3・AAC/M4A・WAV・FLAC・Opus を再生します（ブラウザ差が少しあり、MP3 と M4A が最も安全です）。ストリーミング配信（HLS / DASH）には対応しません —— それは `<video>` と JS ライブラリの領域です。URL は http(s)://、`//` で始まるもの、または同一サイトの相対パスに限ります。クロスオリジンの音声は再生できますが、波形表示のような処理には相手側の CORS 許可が必要です。