<div class="modal-header">
  <h3 class="modal-title">Import From URL</h3>
</div>
<div class="modal-body">
  <div class="form-group">
    <label for="url">URL</label>
    <input type="text" class="form-control" autofocus="true" ng-model="url" ng-change="fetch(url)" auto-focus="200">
    <p>
      <label>
        <input value="{{opts.useProxy}}" type="checkbox" ng-model="opts.useProxy" ng-change="fetch(url)">Use CORS proxy
      </label>
    </p>
  </div>
  <p class="error" ng-if="error">
    <i class="fa fa fa-times"></i>
    Error loading URL:
    <pre ng-if="error">{{error | json}}</pre>
  </p>
  <p ng-if="fetching"><i class="fa fa-spinner fa-pulse"></i> Fetching</p>
  <p class="can-import" ng-if="canImport"><i class="fa fa-check"></i> Valid URL</p>
</div>
<div class="modal-footer">
  <button class="btn btn-warning" ng-click="cancel()">Cancel</button>
  <button class="btn btn-primary" ng-click="ok()" ng-disabled="!canImport">Import</button>
</div>
