'use strict';

const MiniChart = (() => {
  function draw(canvas, series, opts) {
    const o = opts || {};
    const dpr = window.devicePixelRatio || 1;
    canvas.width = canvas.clientWidth * dpr;
    canvas.height = 140 * dpr;
    const ctx = canvas.getContext('2d');
    ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
    const w = canvas.clientWidth, h = 140;
    ctx.clearRect(0, 0, w, h);
    const max = Math.max(o.max || 10, ...series.map((s) => Math.max(...s.points, 0)), 1);
    const pad = 8;
    ctx.strokeStyle = o.grid || '#e0e0e0';
    ctx.lineWidth = 1;
    for (let g = 0; g <= 4; g++) {
      const y = pad + (h - pad * 2) * g / 4;
      ctx.beginPath(); ctx.moveTo(0, y); ctx.lineTo(w, y); ctx.stroke();
    }
    series.forEach((s) => {
      const pts = s.points;
      if (!pts || pts.length < 2) return;
      ctx.strokeStyle = s.color || '#1976d2';
      ctx.lineWidth = 2;
      ctx.beginPath();
      let started = false;
      pts.forEach((v, i) => {
        if (v == null) { started = false; return; }
        const x = pad + (w - pad * 2) * i / Math.max(pts.length - 1, 1);
        const y = h - pad - (h - pad * 2) * (v / max);
        if (!started) { ctx.moveTo(x, y); started = true; } else ctx.lineTo(x, y);
      });
      ctx.stroke();
      const last = pts[pts.length - 1];
      if (last != null) {
        const x = pad + (w - pad * 2) * (pts.length - 1) / Math.max(pts.length - 1, 1);
        const y = h - pad - (h - pad * 2) * (last / max);
        ctx.fillStyle = s.color || '#1976d2';
        ctx.beginPath(); ctx.arc(x, y, 3, 0, Math.PI * 2); ctx.fill();
      }
    });
  }

  function doughnut(canvas, segments, opts) {
    const o = opts || {};
    const dpr = window.devicePixelRatio || 1;
    const legendH = o.legend ? 22 : 0;
    const H = (o.height || 160) + legendH;
    canvas.width = canvas.clientWidth * dpr;
    canvas.height = H * dpr;
    const ctx = canvas.getContext('2d');
    ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
    const w = canvas.clientWidth, h = o.height || 160;
    ctx.clearRect(0, 0, w, H);
    const cx = w / 2, cy = h / 2;
    const r = Math.min(w, h) / 2 - 8;
    const hole = (o.hole == null ? 0.65 : o.hole) * r;
    const total = segments.reduce((s, x) => s + x.value, 0);
    if (!total) {
      ctx.strokeStyle = '#e0e0e0';
      ctx.lineWidth = 1;
      ctx.beginPath(); ctx.arc(cx, cy, r, 0, Math.PI * 2); ctx.stroke();
      ctx.beginPath(); ctx.arc(cx, cy, hole, 0, Math.PI * 2); ctx.stroke();
      return;
    }
    let a0 = -Math.PI / 2;
    segments.forEach((seg) => {
      const a1 = a0 + (seg.value / total) * Math.PI * 2;
      ctx.fillStyle = seg.color;
      ctx.beginPath();
      ctx.arc(cx, cy, r, a0, a1);
      ctx.arc(cx, cy, hole, a1, a0, true);
      ctx.closePath();
      ctx.fill();
      a0 = a1;
    });
    ctx.strokeStyle = o.stroke || '#ffffff';
    ctx.lineWidth = 1;
    ctx.beginPath(); ctx.arc(cx, cy, r, 0, Math.PI * 2); ctx.stroke();
    ctx.beginPath(); ctx.arc(cx, cy, hole, 0, Math.PI * 2); ctx.stroke();
    if (o.legend) {
      ctx.font = '11px Roboto, "Segoe UI", Arial, sans-serif';
      const dots = segments.filter((s) => s.value > 0);
      let tw = 0;
      dots.forEach((s) => { tw += 16 + ctx.measureText(s.label).width + 8; });
      tw = Math.max(tw - 8, 0);
      let x = (w - tw) / 2;
      const ly = h + 13;
      dots.forEach((s) => {
        ctx.fillStyle = s.color;
        ctx.beginPath(); ctx.arc(x + 4, ly - 3, 4, 0, Math.PI * 2); ctx.fill();
        ctx.fillStyle = '#686868';
        ctx.textAlign = 'left';
        ctx.fillText(s.label, x + 12, ly);
        x += 16 + ctx.measureText(s.label).width + 8;
      });
    }
  }

  function bar(canvas, items, opts) {
    const o = opts || {};
    const dpr = window.devicePixelRatio || 1;
    const H = o.height || 160;
    canvas.width = canvas.clientWidth * dpr;
    canvas.height = H * dpr;
    const ctx = canvas.getContext('2d');
    ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
    const w = canvas.clientWidth, h = H;
    ctx.clearRect(0, 0, w, h);
    if (!items || !items.length) return;
    const max = Math.max(1, ...items.map((i) => i.value));
    const padB = 16, padT = 8, padL = 6, padR = 6;
    const plotW = w - padL - padR, plotH = h - padT - padB;
    const bw = plotW / items.length;
    ctx.strokeStyle = o.grid || '#e0e0e0';
    ctx.lineWidth = 1;
    for (let g = 0; g <= 4; g++) {
      const y = padT + plotH * g / 4;
      ctx.beginPath(); ctx.moveTo(padL, y); ctx.lineTo(w - padR, y); ctx.stroke();
    }
    items.forEach((it, i) => {
      const bh = it.value / max * plotH;
      const x = padL + bw * i + bw * 0.15;
      const wd = bw * 0.7;
      const y = padT + plotH - bh;
      ctx.fillStyle = it.color;
      ctx.fillRect(x, y, wd, bh);
      ctx.fillStyle = '#686868';
      ctx.font = '10px Roboto, "Segoe UI", Arial, sans-serif';
      ctx.textAlign = 'center';
      ctx.fillText(String(it.label), padL + bw * i + bw / 2, h - 4);
    });
  }

  return { draw, doughnut, bar };
})();