SimpleMetaViewer(同接・高評価表示、わんコメカスタムテンプレ)

simple_meta_viewer (Meta HUD)

「わんコメ(OneComme)」から送信される統計データ（同接・高評価）を、スタイリッシュなデザインで表示するための OBS 用 HUD テンプレートです。

## 構成ファイル

- `index.html`: メインの HUD および設定パネル。

- `viewer01.png`: 同接（VIEWER）用カスタムアイコン。

- `like01.png`: 高評価（LIKE）用カスタムアイコン。

## 主な機能

- **スタイリッシュなデザイン**: グラスモーフィズムを採用したモダンな外観。

- **2項目の表示**: 同接数（VIEWER）と高評価数（LIKE）を並べて表示。

- **コントロールパネル内蔵**:

- 色、透明度、角丸、ぼかし、間隔などをブラウザ上でリアルタイムに調整可能。

- アイコンの切り替え（絵文字 / 内蔵SVG / カスタム画像）。

- 設定の `localStorage` 保存に対応。

## 使い方

1. 本フォルダをわんコメの `templates/custom` ディレクトリ内に配置します。

2. わんコメのテンプレート一覧からOBSへD&Dで追加します。

3. 画面上に表示されるコントロールパネルを使ってデザインを調整します。

4. 調整が終わったら、OBS の「フィルタ」→「クロップ/パッド」を使用して、画面下部のコントロールパネル部分を隠して運用します。

## 技術仕様

### データ受信 (OneSDK)

本テンプレートは、わんコメの標準的な「カスタムテンプレート」として動作し、`onesdk.js` を介して直接統計情報を購読します。

- **接続方法**: `OneSDK.connect()`

- **受信アクション**: `meta`

- **利用項目**: `viewer`, `viewers`, `upVote`, `likes`, `likeCount`, `goodCount`

### その他の仕様

- **設定の保存**: コントロールパネルで変更した内容は `localStorage` に保存され、次回の読み込み時に自動で反映されます。

### ライセンス

- 改造・再配布自由。

- 配信スタイルに合わせて自由にカスタマイズしてください。

※わんコメの利用規約には準拠してください。