<div ng-controller="RestoreWizardController" class="restorewizard">
    
    <div class="page-title">
        <h2 translate>Where do you want to restore from?</h2>
    </div>

    <ul>
        <li class="card checkbox-container" ng-repeat="item in backups"
            ng-click="selection.backupid = item.Backup.ID"
            ng-class="{selected: selection.backupid == item.Backup.ID}"
            >
            <input type="radio" name="direct" id="backup-{{item.Backup.ID}}" ng-model="selection.backupid" value="{{item.Backup.ID}}">
            <label class="checkbox-label" for="backup-{{item.Backup.ID}}">
                <span class="checkbox" ng-class="{checked: selection.style == 'importfile'}">
                    <i class="ic-checkbox-check"></i>
                </span>
                <div>
                    <div>{{item.Backup.Name}}</div>
                    <div ng-hide="item.Backup.Metadata == null || item.Backup.Metadata.TargetSizeString == null" class="subtext" translate translate-n="parseInt(item.Backup.Metadata.BackupListCount)" translate-plural="{{item.Backup.Metadata.TargetSizeString}} / {{$count}} Versions">{{item.Backup.Metadata.TargetSizeString}} / {{$count}} Version</div>

                    <div ng-show="item.Backup.Metadata == null || item.Backup.Metadata.TargetSizeString == null" class="subtext" translate>Unknown backup size and versions</div>

                    <div ng-hide="item.Backup.Metadata == null || item.Backup.Metadata.LastRestoreFinished == null"
                    class="subtext"
                    translate translate-params-time="item.Backup.Metadata.LastRestoreFinished | parseDate:forceActualDate "
                    translate-params-duration="formatDuration(item.Backup.Metadata.LastRestoreDuration)">Last successful restore: {{time}} (took {{duration || '0 seconds'}})
                    </div>
                </div>
            </label>
        </li>
        <li ng-if="backups && backups.length > 0" style="cursor: initial;"><h3 translate>Or</h3></li>      
        <li class="card checkbox-container"
            ng-click="selection.backupid = 'direct'"
            ng-class="{selected: selection.backupid == 'direct'}"
            >
            <input type="radio" name="direct" id="direct" ng-model="selection.backupid" value="direct">
            <label class="checkbox-label" for="direct">
                <span class="checkbox" ng-class="{checked: selection.style == 'importfile'}">
                    <i class="ic-checkbox-check"></i>
                </span>
                <div>
                    <div translate>Direct restore from backup files ...</div>
                    <div class="subtext" translate>Point to your backup files and restore from there</div>
                </div>
            </label>
        </li>
        <!-- <li class="card checkbox-container"
            ng-click="selection.backupid = 'import'"
            ng-class="{selected: selection.backupid == 'import'}"
            >
            <input type="radio" name="import" id="import" ng-model="selection.backupid" value="import">
            
            <label class="checkbox-label" for="import">
                <span class="checkbox" ng-class="{checked: selection.style == 'importfile'}">
                    <i class="ic-checkbox-check"></i>
                </span>
                <div>
                    <div translate>Restore from configuration ...</div>
                    <div class="subtext" translate>Load destination from an exported job or a storage provider</div>
                </div>
            </label>
        </li> -->

    </ul>

    <div class="actions-container">
        <a href class="ekup-button" ng-click="nextPage()">
            <span translate>Next</span>
            <i class="ic-chevron-right"></i>
        </a>       
    </div>
</div>
