<!-- Error and Success templates -->

<script type="text/template" id="xos-error-response">
  <h5>Error</h5>
  <table>
  <tr><td>error:</td><td><%= error %></td></tr>
  <tr><td>check:</td><td><%= specific_error %></td></tr>
  </table>
  <h5>Details:</h5>
      <table>
      <tbody>
      <% _.each(reasons, function(element, index) { %>
          <tr><td><%= index %></td><td><%= element %></td></tr>
      <% }); %>
      </tbody>
      </table>
</script>

<script type="text/template" id="xos-error-rawresponse">
  <h5>Error</h5>
  <pre>The server returned:
"<%= responseText %>"</pre>
</script>

<script type="text/template" id="xos-error-template">
  <button id="close-error-box">Close Error Message</button>
  <h3>An error has occurred.</h3>
  <table class="test-error-table">
  <tr><td>Code:</td><td><%= status %></td></tr>
  <tr><td>Message:</td><td><%= statusText %></td></tr>
  </table>
</script>

<script type="text/template" id="xos-success-template">
  <button id="close-success-box">Close Success Message</button>
  <h3>Success!</h3>
  <table class="test-success-table">
  <tr><td>Code:</td><td><%= status %></td></tr>
  <tr><td>Message:</td><td><%= statusText %></td></tr>
  </table>
</script>

<script type="text/template" id="xos-navbutton-old">
  <button class="btn btn-default btn-xosnav" onclick="<%= router %>.navigate('<%= routeUrl %>', {trigger: true})"><%= name %></button><br>
</script>

<script type="text/template" id="xos-status-template">
  <div class="xos-status xos-<%= statusclass %>"><%= what %>: <%= statusText %> (<%= status %>)</div>
</script>

<script type="text/template" id="xos-tabs-template">
  <ul class="xos-nav-list">
  <% _.each(tabs, function(tab) { %>
      <li class="xos-nav-item" id="xos-nav-<%= tab["region"] %>"><%= tab["name"] %></li>
  <% }); %>
  </ul>
</script>

<script type="text/template" id="xos-title-list">
  <h3><img src="/static/img/brokencircle.gif" height=16 width=16 id="xos-list-title-spinner"> <%= title %></h3>
</script>

<script type="text/template" id="xos-title-detail">
  <h3><%= title %></h3>
</script>

<script type="text/template" id="xos-navbutton">
  <li>
      <a href="<%= routeUrl %>">
          <i class="<%= iconClass %>"></i>
          <%= name %>
      </a>
  </li>
</script>

<script type="text/template" id="xos-inline-detail-buttons-template">
    <tr>
       <td colspan=2><button class="btn js-submit btn-xos-detail btn-xos-save-leave">Save</button>
           <button class="btn js-submit btn-xos-detail btn-xos-save-continue">Save and Continue Editing</button>
           <button class="btn js-submit btn-xos-detail btn-xos-save-another">Save and Add Another</button>
           <button class="btn js-submit btn-xos-detail btn-xos-delete">Delete</button>
       </td>
    </tr>
</script>

<script type="text/template" id="xos-backend-status-icon-template">
    <% if (! ("enacted" in arguments) ) { %>
        <!-- enacted is undefined; this must be a new object -->
    <% } else if ((enacted) && (enacted >= updated)) { %>
        <span style="min-width:16px;"><img src="/static/admin/img/icon_success.gif"></span>
    <% } else { %>
        <% if ((backend_status == "Provisioning in progress") || (!backend_status)) { %>
            <span style="min-width:16px;" title="<%= _.escape(backend_status) %>"><img src="/static/admin/img/icon_clock.gif"></span>
        <% } else { %>
            <span style="min-width:16px;" title="<%= _.escape(backend_status) %>"><img src="/static/admin/img/icon_error.gif"></span>
        <% } %>
    <% } %>
</script>

<script type="text/template" id="xos-backend-status-text-template">
    <%= xosBackendStatusIconTemplate.apply(this,arguments) %>
    <% if (model.enacted === undefined) { %>
        <!-- enacted is undefined; this must be a new object -->
    <% } else if ((enacted) && (enacted >= updated)) { %>
        Successfully enacted
    <% } else { %>
        <%= _.escape(backend_status) %>
    <% } %>
</script>

<script type="text/template" id="xos-list-header-template">
    <button class="btn js-submit btn-xos-list btn-xos-add">Add</button>
    <button class="btn js-submit btn-xos-list btn-xos-refresh">Refresh</button>
</script>

<script type="text/template" id="xos-list-footer-template">
    <% if (addChildHash) { %>
        <a href="<%= addChildHash %>">Add...</a>
    <% } %>
</script>

<script type="text/template" id="xos-delete-button-template">
    <a href="#delete<%= firstCharUpper(modelName) %>/<%= id %>">delete</a>
</script>

<script type="text/template" id="xos-detail-link-template">
    <a href="#<%= collectionName %>/<%= id %>"><%= text %></a>
</script>

<script type="text/template" id="xos-add-template">
  <h3 class="xos-detail-title">Add Object: <%= modelName %></h3>
  <form>
  <table>
  <% args = arguments; %>
  <% _.each(addFields, function(fieldName) { %>
     <tr><td><%= fieldNameToHumanReadable(fieldName) %>:</td>
        <% readOnly = $.inArray(fieldName, model.readOnlyFields)>=0 ? " readonly" : "";  %>
        <% if (fieldName in foreignFields) { %>
            <td><%= idToSelect(fieldName, model.attributes[fieldName], foreignFields[fieldName], "humanReadableName", readOnly) %></td>
        <% } else if (inputType[fieldName] == "checkbox") { %>
            <td><input type="checkbox" name="<%= fieldName %>" <% if (model.attributes[fieldName]) print("checked"); %><%= readOnly %>></td>
        <% } else if (fieldName=="backend_status") { %>
            <td><%= xosBackendStatusTextTemplate.apply(this, args) %></td>
        <% } else { %>
            <td><input type="text" name="<%= fieldName %>" value="<%= model.attributes[fieldName] %>"<%= readOnly %>></td>
        <% } %>
     </tr>
  <% }); %>
  <%= xosInlineDetailButtonsTemplate() %>
  </table>
  </form>
</script>

<script type="text/template" id="xos-detail-template">
  <h3 class="xos-detail-title">Edit Object: <%= modelName %></h3>
  <form>
  <table class="xos-detail-table">
  <% args = arguments; %>
  <% _.each(detailFields, function(fieldName) { %>
     <tr><td class="xos-label-cell"><%= fieldName in fieldDisplayNames ? fieldDisplayNames[fieldName] : fieldNameToHumanReadable(fieldName) %>:</td>
        <% readOnly = $.inArray(fieldName, model.readOnlyFields)>=0 ? " readonly" : "";  %>
        <% if (fieldName in choices) { %>
            <td><%= choicesToSelect(fieldName, model.attributes[fieldName], choices[fieldName]) %></td>
        <% } else if (fieldName in foreignFields) { %>
            <td><%= idToSelect(fieldName, model.attributes[fieldName], foreignFields[fieldName], "humanReadableName", readOnly) %></td>
        <% } else if (inputType[fieldName] == "spinner") { %>
            <!-- note: I never finished working on this spinner stuff! -->
            <td><%= xosSpinnerTemplate({id: "spinner_" + fieldName, fieldName: fieldName, value: model.attributes[fieldName]}) %></td>
        <% } else if (inputType[fieldName] == "checkbox") { %>
            <td><input type="checkbox" name="<%= fieldName %>" <% if (model.attributes[fieldName]) print("checked"); %><%= readOnly %>></td>
        <% } else if (inputType[fieldName] == "picker") { %>
            <% lookupFunc = makeIdToName(model.m2mFields[fieldName], "humanReadableName"); %>
            <td><%= xosPickerTemplate({pickedItems: model.attributes[fieldName], unpickedItems: model.getChoices(fieldName,true), id: "picker_" + fieldName, fieldName: fieldName, detailView: detailView, lookupFunc: lookupFunc}) %></td>
        <% } else if (fieldName=="backend_status") { %>
            <td><%= xosBackendStatusTextTemplate.apply(this, args) %></td>
        <% } else { %>
            <td><input type="text" name="<%= fieldName %>" value="<%= model.attributes[fieldName] %>"<%= readOnly %>></td>
        <% } %>
        <td  class="xos-help-cell"><%= helpText[fieldName] %></td>
     </tr>
  <% }); %>
  <%= xosInlineDetailButtonsTemplate() %>
  </table>
  </form>
</script>

<script type="text/template" id="xos-list-template">
  <h3 class="xos-list-title"><%= title %></h3>
  <%= xosListHeaderTemplate() %>
  <table class="test-table">
  <thead>
  <tr>
  <% _.each(listFields, function(fieldName) { %>
      <th><%= fieldNameToHumanReadable(fieldName) %></th>
  <% }); %>
  <th>delete</th>
  </tr></thead>
  <tbody></tbody>
  </table>
  <%= xosListFooterTemplate({addChildHash: addChildHash}) %>
</script>

<script type="text/template" id="xos-listitem-template">
  <% _.each(listFields, function(fieldName) { %>
      <% if ($.inArray(fieldName, model.detailLinkFields)>=0) { %>
          <td><%= xosDetailLinkTemplate({collectionName: collectionName, id: id, text: model.attributes[fieldName]}) %></td>
      <% } else if (fieldName in foreignFields) { %>
          <td><%= idToName(model.attributes[fieldName], foreignFields[fieldName], "humanReadableName") %></td>
      <% } else { %>
      <td><%= model.attributes[fieldName] %></td>
      <% } %>
  <% }); %>
  <td><%= xosDeleteButtonTemplate({modelName: modelName, id: id}) %></td>
</script>

<script type="text/template" id="xos-savebuttons-template">
  <div class="box save-box">
    <button class="btn btn-high btn-info btn-xos-contentButtonPanel btn-xos-save-leave">Save</button>
    <button class="btn btn-high btn-xos-contentButtonPanel btn-xos-save-continue">Save and continue editing</button>
    <button class="btn btn-high btn-xos-contentButtonPanel btn-xos-save-another">Save and add another</button>
    <button class="btn btn-danger btn-xos-contentButtonPanel btn-xos-delete">Delete</button>
  </div>
</script>

<script type="text/template" id="xos-listbuttons-template">
  <div class="box save-box">
    <button class="btn btn-high btn-primary btn-xos-contentButtonPanel btn-xos-refresh">Refresh</button>
    <button class="btn btn-high btn-success btn-xos-contentButtonPanel btn-xos-add">Add</button>
  </div>
</script>

<script type="text/template" id="xos-datatable-spinner-template">
    <!-- arguments: value, id, collectionName, fieldName -->
    <%= value %> <img style="cursor: pointer;" src="/static/img/plus_circle.png" onclick='<%= app.varName %>.adjustCollectionField("<%= collectionName %>", <%= id %>, "<%= fieldName %>", 1)'>
                 <img style="cursor: pointer;" src="/static/img/minus_circle.png" onclick='<%= app.varName %>.adjustCollectionField("<%= collectionName %>", <%= id %>, "<%= fieldName %>", -1)'>
</script>

<script type="text/template" id="xos-datatable-spinner-template-old">
    <!-- arguments: value, id, collectionName, fieldName -->
    <%= value %> <a href="javascript:undefined" onclick='<%= app.varName %>.adjustCollectionField("<%= collectionName %>", <%= id %>, "<%= fieldName %>", 1)'> more </a>
                 <a href="javascript:undefined" onclick='<%= app.varName %>.adjustCollectionField("<%= collectionName %>", <%= id %>, "<%= fieldName %>", -1)'> less </a>
</script>

<script type="text/template" id="xos-spinner-template">
    <!-- arguments: fieldName, id, value -->
    <input name="<%= fieldName %>" class="xos-spinner" id="<%= id %>">
    <% detailView.viewInitializers.push( function() { init_spinner("#" + id, value); } ); %>
</script>

<script type="text/template" id="xos-picker-template">
    <!-- arguments: unpickedItems, pickedItems, fieldName, id -->
    <div id="<%= id %>">
    <div class="picker_row">
    <div class="picker_column">
    <div>Available</div>
    <select name="pickerfrom" class="select-picker-from" multiple size="5">
        <% _.each(unpickedItems, function(item) { %>
           <option value="<%= item %>"><%= lookupFunc? lookupFunc(item) : item %></option>
        <% });%>
    </select>
    </div>
    <div class="picker_column">
    <br>
    <div class="btn btn-success btn-picker-add">Add &raquo;</div><br><br>
    <div class="btn btn-success btn-picker-remove">&laquo; Remove</div>
    </div>
    <div class="picker_column">
    <div>Selected</div>
    <select name=<%= fieldName %> class="select-picker-to syphonall" multiple size="5">
        <% _.each(pickedItems, function(item) { %>
           <option value="<%= item %>"><%= lookupFunc ? lookupFunc(item) : item %></option>
        <% }); %>
    </select>
    </div>
    <div class="picker_column">
    <br>
    <div class="btn btn-success btn-picker-up">Up</div><br><br>
    <div class="btn btn-success btn-picker-down">Down</div>
    </div>
    </div>
    </div>
    <% detailView.viewInitializers.push( function() { init_picker("#" + id); } ); %>
</script>

<script type="text/template" id="xos-sliceselector-option">
   <%= name %>
</script>

<script type="text/template" id="xos-sliceselector-select">
    <% if (caption) { %>
    <table class="xos-detail-table"><tr><td class="xos-label-cell"><%= caption %>: </td><td><select></select></td></tr></table>
    <% } else { %>
    <select></select>
    <% } %>
</script>

<script>
xosInlineDetailButtonsTemplate = _.template($("#xos-inline-detail-buttons-template").html());
xosListHeaderTemplate = _.template($("#xos-list-header-template").html());
xosListFooterTemplate = _.template($("#xos-list-footer-template").html());
xosDeleteButtonTemplate = _.template($("#xos-delete-button-template").html());
xosDetailLinkTemplate = _.template($("#xos-detail-link-template").html());
xosBackendStatusIconTemplate = _.template($("#xos-backend-status-icon-template").html());
xosBackendStatusTextTemplate = _.template($("#xos-backend-status-text-template").html());
xosPickerTemplate = _.template($("#xos-picker-template").html());
xosSpinnerTemplate = _.template($("#xos-spinner-template").html());
xosDataTableSpinnerTemplate = _.template($("#xos-datatable-spinner-template").html());
</script>