{# JavaScript for rendering individual talk feedback charts #}
{# Expects: feedback_data (dict with interesting, mastery, questions, material), chart_prefix #}
{# Requires: chart_helpers.js to be loaded first #}

<script>
(function() {
  // Use global helper functions from chart_helpers.js (scaleOrder, scaleLabels, makeColor)
  
  // Only serialize the chart data, not the whole object
  const feedbackData = {
    interesting: {{ feedback_data.interesting|tojson }},
    mastery: {{ feedback_data.mastery|tojson }},
    questions: {{ feedback_data.questions|tojson }},
    material: {{ feedback_data.material|tojson }}
  };
  const chartPrefix = '{{ chart_prefix }}';
  
  function renderChart(canvasId, counts) {
    const ctx = document.getElementById(canvasId);
    if (!ctx) return;

    const data = scaleOrder.map((s) => counts[s] || 0);

    new Chart(ctx, {
      type: 'bar',
      data: {
        labels: scaleOrder.map((s) => scaleLabels[s] + ' (' + s + ')'),
        datasets: [{
          label: 'Anzahl',
          data: data,
          backgroundColor: scaleOrder.map((_, i) => makeColor(i)),
        }]
      },
      options: {
        responsive: true,
        plugins: {
          legend: { display: false },
        },
        scales: {
          y: {
            beginAtZero: true,
            ticks: { precision: 0 }
          }
        }
      }
    });
  }

  // Render talk feedback charts
  if (feedbackData.interesting) {
    renderChart(`chart-${chartPrefix}-interesting`, feedbackData.interesting);
  }
  if (feedbackData.mastery) {
    renderChart(`chart-${chartPrefix}-mastery`, feedbackData.mastery);
  }
  if (feedbackData.questions) {
    renderChart(`chart-${chartPrefix}-questions`, feedbackData.questions);
  }
  if (feedbackData.material) {
    renderChart(`chart-${chartPrefix}-material`, feedbackData.material);
  }
})();
</script>