<script type="text/javascript" src="<%= root_path %>javascripts/chart.min.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/chartjs-plugin-annotation.min.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/base-charts.js"></script>
<script type="text/javascript" src="<%= root_path %>javascripts/metrics.js"></script>

<%
  job_result = @query_result.job_results[@name]
  hist_totals = job_result.hist.values.first.zip(*job_result.hist.values[1..-1]).map(&:sum)
  bucket_labels =Sidekiq::Metrics::Histogram::LABELS
  bucket_intervals =Sidekiq::Metrics::Histogram::BUCKET_INTERVALS.reverse

  # Replace INFINITY since it can't be represented as JSON
  bucket_intervals[0] = bucket_intervals[1] * 2
%>

<% if job_result.totals["s"] > 0 %>
  <div class="header-container">
    <h1>
      <a href="<%= root_path %>metrics"><%= t(:metrics).to_s.titleize %></a> /
      <%= h @name %>
    </h1>

    <div>
      <a target="blank" href="https://github.com/mperham/sidekiq/wiki/Metrics"><span class="info-circle" title="Click to learn more about metrics">?</span></a>
    </div>
  </div>

  <canvas id="hist-totals-chart"></canvas>

  <script>
    window.histTotalsChart = new HistTotalsChart(
      document.getElementById("hist-totals-chart"),
      <%= Sidekiq.dump_json({
        series: hist_totals,
        labels: bucket_labels,
        xLabel: t('ExecutionTime'),
        yLabel: t('Jobs'),
        units: t('Jobs').downcase,
      }) %>
    )
  </script>

  <canvas id="hist-bubble-chart"></canvas>

  <script>
    window.histBubbleChart = new HistBubbleChart(
      document.getElementById("hist-bubble-chart"),
      <%= Sidekiq.dump_json({
        hist: job_result.hist,
        marks: @query_result.marks.map { |m| [m.bucket, m.label] },
        labels: @query_result.buckets,
        histIntervals: bucket_intervals,
        yLabel: t('ExecutionTime'),
        markLabel: t('Deploy'),
        yUnits: t('Seconds').downcase,
        zUnits: t('Jobs').downcase,
      }) %>
    )
  </script>

  <p><small>Data from <%= @query_result.starts_at %> to <%= @query_result.ends_at %></small></p>
<% else %>
  <h1>
    <a href="<%= root_path %>/metrics"><%= t(:metrics).to_s.titleize %></a> /
    <%= h @name %>
  </h1>

  <div class="alert alert-success"><%= t('NoJobMetricsFound') %></div>
<% end %>
