/* ============================================================
   EFFECTS — immersive overlay layer, per player
   usePlayerEffects(playerId) → { rootClass, overlays }
   rootClass applies .is-dead / .fx-shake to the screen wrapper.
   overlays is a fixed-position JSX layer (flash, float numbers, DEAD/REVIVE).
   ============================================================ */
function usePlayerEffects(playerId){
  const game = useGame();
  const player = game.players.find(p=>p.id===playerId);
  const dead = !!(player && player.dead);

  const [shake, setShake] = useState(false);
  const [flashes, setFlashes] = useState([]);   // {id, kind}
  const [nums, setNums] = useState([]);          // {id, kind, text}
  const [revive, setRevive] = useState(false);
  const idRef = useRef(0);

  const addFlash = (kind, dur)=>{
    const id = ++idRef.current;
    setFlashes(f=>[...f,{id,kind}]);
    setTimeout(()=> setFlashes(f=>f.filter(x=>x.id!==id)), dur);
  };
  const addNum = (kind, text)=>{
    const id = ++idRef.current;
    setNums(n=>[...n,{id,kind,text}]);
    setTimeout(()=> setNums(n=>n.filter(x=>x.id!==id)), 1200);
  };

  useGameEvents((ev)=>{
    if(ev.playerId && ev.playerId!==playerId) return;
    if(ev.type==='damage'){
      const big = ev.amount>=5;
      addFlash(big?'dmg-big':'dmg', big?800:600);
      addNum('dmg', `-${ev.amount}`);
      setShake(true); setTimeout(()=>setShake(false), big?560:420);
      haptic(HAPTIC.damage);
      try{ audio.play('damage'); }catch(_){}
    } else if(ev.type==='heal'){
      addFlash('heal',1000);
      addNum('heal', `+${ev.amount}`);
      haptic(HAPTIC.heal);
    } else if(ev.type==='death'){
      haptic(HAPTIC.death);
    } else if(ev.type==='revive'){
      setRevive(true); setTimeout(()=>setRevive(false),1700);
    } else if(ev.type==='coins'){
      addFlash('coinfx', 900);
    }
  });

  const rootClass = `${dead?'is-dead':''} ${shake?'fx-shake':''}`.trim();

  const overlays = (
    <>
      {flashes.map(f=>{
        if(f.kind==='heal') return <div key={f.id} className="fx-heal"><span className="fx-heal-motes"></span></div>;
        if(f.kind==='coinfx') return <div key={f.id} className="fx-coinflash"></div>;
        if(f.kind==='dmg' || f.kind==='dmg-big') return (
          <div key={f.id} className={`fx-damage ${f.kind==='dmg-big'?'big':''}`}>
            <span className="fx-dmg-slash"></span>
            {f.kind==='dmg-big' && <span className="fx-dmg-crack"></span>}
          </div>
        );
        return <div key={f.id} className="fx-damage"></div>;
      })}
      {nums.map(n=> <div key={n.id} className={`fx-float-num ${n.kind}`}>{n.text}</div>)}
      {dead && (
        <div className="fx-dead-overlay">
          <div style={{textAlign:'center'}}>
            <div className="fx-dead-text">DEAD</div>
            <div className="fx-dead-sub">Await revival</div>
          </div>
        </div>
      )}
      {revive && (
        <div className="fx-revive-overlay">
          <div className="fx-revive-text">REVIVE</div>
        </div>
      )}
    </>
  );

  return { rootClass, overlays, dead };
}

/* ---------- floating ember particle layer (ambience) ---------- */
function Embers({ count=18 }){
  const specs = useRef(null);
  // on phones / low-core devices, cut particle count hard (heat + battery)
  const n = window.LOW_PERF ? Math.max(5, Math.round(count*0.4)) : count;
  if(!specs.current){
    specs.current = Array.from({length:n}).map(()=>({
      left: Math.random()*100,
      size: 1.5 + Math.random()*3,
      dur: 9 + Math.random()*12,
      delay: -Math.random()*16,
      drift: (Math.random()*2-1)*40,
      op: 0.25 + Math.random()*0.5,
    }));
  }
  return (
    <div className="embers" aria-hidden="true">
      {specs.current.map((s,i)=>(
        <span key={i} className="ember" style={{
          left: s.left+'%', width:s.size, height:s.size,
          animationDuration: s.dur+'s', animationDelay: s.delay+'s',
          '--drift': s.drift+'px', '--ember-op': s.op,
        }}></span>
      ))}
    </div>
  );
}

window.usePlayerEffects = usePlayerEffects;
window.Embers = Embers;