puppetboard/puppetboard/templates/_macros.html

{% macro facts_table(facts, autofocus=False, condensed=False, show_node=False, show_value=True, link_facts=False, margin_top=20, margin_bottom=20) -%}
<div class="ui fluid icon input hide" style="margin-bottom:20px">
  <input {% if autofocus %} autofocus="autofocus" {% endif %} class="filter-table" placeholder="Type here to filter...">
</div>
<table class="filter-table facts ui basic table facts {% if condensed %}compact{% endif%}" style="table-layout: fixed;">
  <thead>
    <tr>
      {% if show_node %}
      <th>Node</th>
      {% else %}
      <th>Fact</th>
      {% endif %}
      {% if show_value %}
      <th>Value</th>
      {% endif %}
    </tr>
  </thead>
  <tbody class="searchable">
    {% for fact in facts %}
    <tr>
      {% if show_node %}
        <td><a href="{{url_for('node', node_name=fact.node)}}">{{fact.node}}</a></td>
      {% else %}
        <td><a href="{{url_for('fact', fact=fact.name)}}">{{fact.name}}</a></td>
      {% endif %}
      {% if show_value %}
      <td style="word-wrap:break-word">
        {% if link_facts %}
          <a href="{{url_for('fact_value', fact=fact.name, value=fact.value)}}">{{fact.value}}</a>
        {% else %}
          {{fact.value}}
        {% endif %}
      </td>
      {% endif %}
    </tr>
    {% endfor %}
  </tbody>
</table>
{%- endmacro %}
{% macro facts_graph(facts, autofocus=False, condensed=False, show_node=False, margin_top=20, margin_bottom=20) -%}
<script src="{{url_for('static', filename='js/Chart.js')}}"></script>
<canvas id="factChart" width="300" height="300"></canvas>
<script type="text/javascript">
  var colors = ["#9B59B6", "#3498DB", "#2ECC71", "#1ABC9C", "#F1C40F", "#E67E22", "#E74C3C"];
  var len_colors = colors.length;
  var data = [
{% for fact in facts|groupby('value') %}
    {
    label: "{{ fact.grouper }}",
    value: {{ fact.list|length }}
    },
{% endfor %}
    {
    value: 0,
    }
  ]
  for (var i = 0; i < data.length; i++) {
    data[i].color = colors[i % len_colors];
  }
  var sorted_data = data.sort(function(a,b) { return parseFloat(b.value) - parseFloat(a.value)});
  var top7 = sorted_data.slice(0,7);
  var bottom = data.slice(7, -1);
  var bottom_sum = 0;
  for (var i = 0; i < bottom.length; i++) {
    bottom_sum += bottom[i].value;
  }
  top7.push({ label: "Other", value: bottom_sum, color: "#B30202" });
  var ctx = document.getElementById("factChart").getContext("2d");
  new Chart(ctx).Pie(top7, {'animation': false});
</script>
{%- endmacro %}
{% macro facts_graph_value(facts, autofocus=False, condensed=False, show_node=False, margin_top=20, margin_bottom=20) -%}
<script src="{{url_for('static', filename='js/Chart.js')}}"></script>
<canvas id="factChart_value" width="300" height="300"></canvas>
<script type="text/javascript">
  var colors = ["#9B59B6", "#3498DB", "#2ECC71", "#1ABC9C", "#F1C40F", "#E67E22", "#E74C3C"];
  var len_colors = colors.length;
  var data = [
{% for fact in facts|groupby('value') %}
    {
    label: "{{ fact.grouper }}",
    value: {{ fact.list|length }}
    },
{% endfor %}
    {
    value: 0,
    }
  ]

  for (var i = 0; i < data.length; i++) {
    data[i].color = colors[i % len_colors];
  }
  var ctx = document.getElementById("factChart_value").getContext("2d");
  new Chart(ctx).Pie(data.sort(function(a,b) { return parseInt(a.label) - parseInt(b.label)}), {'animation':false});
</script>
{%- endmacro %}



{% macro reports_table(reports, nodename, reports_count, condensed=False, hash_truncate=False, show_conf_col=True, show_agent_col=True, show_host_col=True) -%}
<div class="ui info message">

  Only showing the last {{reports_count}} reports.

</div>
<table class='ui table basic {% if condensed %}compact{% endif %}'>
  <thead>
    <tr>
      <th>Start time</th>
      <th>Run time</th>
      <th>Full report</th>
      {% if show_conf_col %}
        <th>Configuration version</th>
      {% endif %}
      {% if show_agent_col %}
        <th>Agent version</th>
      {% endif %}
      {% if show_host_col %}
        <th>Hostname</th>
      {% endif %}
    <tr>
  </thead>
  <tbody>
  {% for report in reports %}
    {% if hash_truncate %}
    {% set rep_hash = "%s&hellip;"|format(report.hash_[0:10])|safe %}
    {% else %}
    {% set rep_hash = report.hash_ %}
    {% endif %}
    {% if report.failed %}
    <tr class="error">
    {% else %}
    <tr>
    {% endif %}
    <td rel="utctimestamp">{{report.start}}</td>
      <td>{{report.run_time}}</td>

      <td><a href="{{url_for('report', node=nodename, report_id=report.hash_)}}">{{rep_hash}}</a></td>
      {% if show_conf_col %}
        <td>{{report.version}}</td>
      {% endif %}
      {% if show_agent_col %}
        <td>{{report.agent_version}}</td>
      {% endif %}
      {% if show_host_col %}
        <td><a href="{{url_for('node', node_name=report.node)}}">{{ report.node }}</a></td>
      {% endif %}
    </tr>
    {% endfor %}
  </tbody>
</table>
{%- endmacro %}