<div ng-controller="ImportController" class="importpage">

    <div class="page-title">
        <h2 ng-hide="restoremode" translate>Import backup configuration</h2>
        <h2 ng-show="restoremode" translate>Restore from backup configuration</h2>
    </div>

    <div class="card">
        <iframe style="display:none" id="submit-target" name="submit-target"></iframe>

        <form enctype="multipart/form-data" id="import-form" class="styled" method="POST" action="{{ImportURL}}" target="submit-target">
            <input type="hidden" name="direct" id="direct" value="true" />
            <input type="hidden" name="import_metadata" id="import_metadata" value="false" />

            <div class="input text">
                <label translate>Configuration file:</label>
                <div class="file-input">
                    <label class="ekup-button "  for="file">
                        <i class="ic-upload"></i>
                        <span ng-if="!UploadDownloads" translate>Choose a file</span>                        
                        <span ng-if="UploadDownloads" translate>Change file</span>                        
                    </label>
                    <input type="file" fd-input file-name="UploadDownloads" name="config"  id="file" />
                    <span ng-if="UploadDownloads">
                        <i class="ic-file"></i>
                        {{UploadDownloads}}
                    </span>
                    <button type="button" ng-if="UploadDownloads" class="ekup-icon-button ekup-icon-error-button" ng-click="cleanFile()">
                        <i class="ic-x"></i>
                    </button>
                </div>
            </div>

            <input type="hidden" name="callback" value="{{CallbackMethod}}" />
        </form>
    </div>

    <div class="actions-container">
            <button class="ekup-button" ng-disabled="!UploadDownloads" ng-hide="Connecting" ng-click="doSubmit()">
                <i class="ic-log-in"></i>
                <span translate>Import</span>
            </button>
            <button class="ekup-button" ng-show="Connecting" translate>
                <i class="ic-log-in"></i>
                <span translate>Importing …</span>
            </button>
    </div>

</div>
