// 멀티존 플레이어 — 화면을 여러 존으로 나눠 각각 독립 재생.
// 메인 존은 스케줄/포스터(directive)를, 보조 존은 지정된 미디어를 반복 재생한다.
// 플레이어와 CMS 미리보기가 공용으로 사용한다.
import { PlaybackEngine } from './engine.js';

export const LAYOUTS = {
  'single':      { main: { x: 0, y: 0, w: 100, h: 100 }, sub: null },
  'split-lr':    { main: { x: 0, y: 0, w: 70, h: 100 }, sub: { x: 70, y: 0, w: 30, h: 100 } },
  'split-tb':    { main: { x: 0, y: 0, w: 100, h: 75 }, sub: { x: 0, y: 75, w: 100, h: 25 } },
  'main-bottom': { main: { x: 0, y: 0, w: 100, h: 82 }, sub: { x: 0, y: 82, w: 100, h: 18 } },
};

export class ZonePlayer {
  constructor(stage, opts = {}) {
    this.stage = stage;
    this.opts = opts;
    this.preset = null;
    this.main = null;
    this.sub = null;
  }

  _rectStyle(r) {
    return `position:absolute;left:${r.x}%;top:${r.y}%;width:${r.w}%;height:${r.h}%;overflow:hidden;background:#000`;
  }

  _build(preset) {
    const L = LAYOUTS[preset] || LAYOUTS.single;
    this.stage.innerHTML = '';
    const md = document.createElement('div');
    md.style.cssText = this._rectStyle(L.main);
    this.stage.appendChild(md);
    this.main = new PlaybackEngine(md, this.opts); // 메인 존만 onNowPlaying 보고
    if (L.sub) {
      const sd = document.createElement('div');
      sd.style.cssText = this._rectStyle(L.sub);
      this.stage.appendChild(sd);
      this.sub = new PlaybackEngine(sd, { muted: true });
    } else {
      this.sub = null;
    }
    this.preset = preset;
  }

  apply(directive) {
    const preset = (directive.layout && directive.layout.preset) || 'single';
    if (preset !== this.preset) this._build(preset);
    this.main.apply(directive);
    if (this.sub) {
      const pl = (directive.layout && directive.layout.subPlaylist) || [];
      this.sub.apply({
        mode: pl.length ? 'schedule' : 'idle',
        playlist: pl,
        brightness: directive.brightness,
        scaleMode: directive.scaleMode || 'contain',
        resolution: directive.resolution,
        idleMode: 'black',
        overlay: {}, // 오버레이는 메인 존에만
        serverTime: directive.serverTime,
      });
    }
  }

  setMuted(m) { if (this.main) this.main.setMuted(m); }
  captureFrame(w) { return this.main ? this.main.captureFrame(w) : { unavailable: true }; }
}
