{% extends "baseprojectpage.html" %}
{% load projecttags %}
{% load humanize %}
{% load static %}
{% block localbreadcrumb %}
<li>All compatible machines</li>
{% endblock %}

{% block projectinfomain %}
<script src="{% static 'js/machines.js' %}"></script>
<script>

  $(document).ready(function (){
    var ctx = {
      projectPageUrl : "{% url 'project' project.id %}",
      projectName : "{{project.name}}",
      xhrEditProjectUrl : "{% url 'xhr_projectedit' project.id %}",
      projectId : {{project.id}},
      xhrDataTypeaheadUrl : "{% url 'xhr_datatypeahead' %}",
    };

    try {
      machinesPageInit(ctx);
    } catch (e) {
      document.write("Sorry, An error has occurred loading this page");
      console.warn(e);
    }
  });
</script>
{% include "layers_dep_modal.html" %}
<div class="page-header">
  <h1>
    {% if request.GET.search or request.GET.filter %}
      {% if objects.paginator.count != 0 %}
        {{objects.paginator.count}} machines found
       {% else %}
        No machines found
       {% endif %}
    {% else %}

    All machines
    <i class="icon-question-sign get-help heading-help" title="This page lists all the machines compatible with the current project that Toaster knows about. They include community-created targets suitable for use on top of OpenEmbedded Core and any targets you have imported"></i>
    {% endif %}
  </h1>
</div>
<div class="alert alert-info lead" id="alert-area" style="display:none">
  <button type="button" class="close" id="dismiss-alert">&times;</button>
  <span id="alert-msg"></span>
</div>
{% if objects.paginator.count == 0 %}
    {% if request.GET.search %}
          <div class="alert row-fluid">
            <form class="navbar-search input-append pull-left" id="searchform">
              <input class="input-xxlarge" id="search" name="search" type="text" placeholder="Search machines" value="{{request.GET.search}}"><a href="javascript:$('#search').val('');searchform.submit()" class="add-on btn" tabindex="-1"><i class="icon-remove"></i></a>
              <input type="hidden" name="orderby" value="">
              <input type="hidden" name="page" value="1">
              <button class="btn" type="submit" value="Search">Search</button>
              <button type="submit" class="btn btn-link" id="show-all-btn">Show all machines</button>
            </form>
          </div>
    {% else %}
            <div class="alert alert-info lead">
               Toaster has no machine information. To generate machine information you should <a href="http://www.yoctoproject.org/docs/latest/toaster-manual/toaster-manual.html#layer-source">configure a layer source</a>
            </div>
    {% endif %}

{% else %}
  {% include "basetable_top.html" %}
  {% for o in objects %}
  <tr class="data">
    <td class="machine">{{o.name}}</td>
    <td class="description">{{o.description}}</td>
    <td class="layer"><a href="{%url "layerdetails" o.layer_version.id %}">{{o.layer_version.layer.name}}</a></td>
    <td class="branch">{{o.layer_version.get_vcs_reference}}</td>
    <td class="machinefile"><code>/machine/conf/{{o.name}}.conf</code><a href="{{o.get_vcs_machine_file_link_url}}" target="_blank"><i class="icon-share get-info"></i></a></td>
    <td class="select-or-add">
      <a href="#" class="btn btn-block select-machine-btn" data-machine-name="{{o.name}}" data-layer-version-id="{{o.layer_version.id}}"
          {%if o.layer_version.id not in project_layers %}style="display:none" {%endif%}  >Select machine</a>
      <a  href="#" class="btn btn-block nopop add-layer" data-layer-version-id="{{o.layer_version.id}}" data-layer-name="{{o.layer_version.layer.name}}" {%if o.layer_version.id in project_layers %}style="display:none" {%endif%}
          >
        <i class="icon-plus"></i>
        Add layer
        <i class="icon-question-sign get-help" title="To build this machine, you must first add the {{o.layer_version.layer.name}} layer to your project"></i>
      </a>
    </td>
  </tr>
  {% endfor %}

  {% include "basetable_bottom.html" %}
{% endif %}

{% endblock %}