<h1><span translate>OCA</span>: {{task.title}} <span class="text-as-button" ng-click="showTaskDetails()" translate>Details / Sign-offs</span></h1>

<div class="error" ng-if="errMessage" >{{errMessage | translate}}</div>

<div class="loadingIndicator" style="width: 1200px; height: 500px;" ng-if="loading" translate>Loading OCA data...</div>

<div ng-if="!loading" ui-grid="gridOptions" ui-grid-edit ui-grid-resize-columns ui-grid-auto-resize ui-grid-pinning class="mainGrid"></div>

<div ng-show="machineEnabled">
  <div class="calcButton"><button ng-click="requestUpdate(true)" translate>Update all elements</button></div> <div class="calcIndicator" ng-show="calcStatus && calcStatus !== 'done'"><img src="assets/loadingIndicator.gif" width="20" height="20"> {{calcStatus}}</div>
</div>

<div ng-show="machineEnabled">
  <button ng-click="updatePercentageSort()" translate>Update sort</button>
  <button ng-click="iterateTraining()" translate>Iterate training</button>
</div>

<div ng-if="!readOnly">
  <button ng-click="saveResults()" translate>Save results</button>
  <label><input type="checkbox" ng-model="autoSaveEnabled"> <span translate>Auto-save</span></label>
  <span ng-show="resultsAreSaving" translate>Saving...</span>
</div>

<div ng-if="excelEnabled">
  <button ng-click="downloadExcel()" translate>Download Task as Excel</button> <br>
  <label ng-if="!readOnly"><span translate>Load Results from Excel:</span>   <input type="file" onchange="angular.element(this).scope().excelFileChanged(this)" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"></label>
</div>

<div>
  <button ng-click="printWork()" translate>Export results with details</button>
</div>
