mirror of
https://github.com/balena-io/etcher.git
synced 2025-04-24 23:37:18 +00:00

It lets you be sure that the auto-selected drive is the one you intended to write to. Fixes: https://github.com/resin-io/etcher/issues/192
74 lines
3.4 KiB
HTML
74 lines
3.4 KiB
HTML
<div class="row around-xs">
|
|
<div class="col-xs">
|
|
<div class="box text-center">
|
|
<hero-icon path="images/image.svg" label="SELECT IMAGE"></hero-icon>
|
|
<hero-badge class="block space-vertical-medium">1</hero-badge>
|
|
|
|
<div class="space-vertical-large">
|
|
<div ng-hide="app.selection.hasImage()">
|
|
<hero-button ng-click="app.selectImage()">Select image</hero-button>
|
|
<p class="step-footer tiny">*supported files: .img, .iso, .zip</p>
|
|
</div>
|
|
<div ng-show="app.selection.hasImage()">
|
|
<span ng-bind="app.selection.getImage() | basename" ng-click="app.reselectImage()"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-xs">
|
|
<div class="box text-center relative">
|
|
<div class="step-border-left" ng-disabled="!app.selection.hasImage()"></div>
|
|
<div class="step-border-right" ng-disabled="!app.selection.hasImage() || !app.selection.hasDrive()"></div>
|
|
|
|
<hero-icon path="images/drive.svg" ng-disabled="!app.selection.hasImage()" label="SELECT DRIVE"></hero-icon>
|
|
<hero-badge class="block space-vertical-medium" ng-disabled="!app.selection.hasImage()">2</hero-badge>
|
|
|
|
<div class="space-vertical-large">
|
|
<div ng-hide="app.selection.hasDrive()">
|
|
|
|
<div ng-show="app.scanner.hasAvailableDrives() || !app.selection.hasImage()">
|
|
<div class="btn-group" uib-dropdown>
|
|
<hero-button ng-disabled="!app.selection.hasImage()"
|
|
uib-dropdown-toggle>Select drive</hero-button>
|
|
|
|
<ul class="dropdown-menu">
|
|
<li ng-repeat="drive in app.scanner.drives">
|
|
<a href="#" ng-click="app.selectDrive(drive)" ng-bind="drive.name + ' - ' + drive.size"></a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div ng-hide="app.scanner.hasAvailableDrives() || !app.selection.hasImage()">
|
|
<hero-button type="danger">Connect a drive</hero-button>
|
|
</div>
|
|
|
|
</div>
|
|
<div ng-show="app.selection.hasDrive()" ng-bind="app.selection.getDrive().name + ' - ' + app.selection.getDrive().size" ng-click="app.reselectDrive()"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-xs">
|
|
<div class="box text-center">
|
|
<hero-icon path="images/burn.svg" ng-disabled="!app.selection.hasImage() || !app.selection.hasDrive()" label="BURN IMAGE"></hero-icon>
|
|
<hero-badge class="block space-vertical-medium" ng-disabled="!app.selection.hasImage() || !app.selection.hasDrive()">3</hero-badge>
|
|
|
|
<div class="space-vertical-large">
|
|
<hero-progress-button percentage="{{ app.state.progress }}" ng-attr-active="{{ app.writer.isBurning() }}"
|
|
ng-click="app.burn(app.selection.getImage(), app.selection.getDrive())"
|
|
ng-disabled="!app.selection.hasImage() || !app.selection.hasDrive()">
|
|
<span ng-show="app.state.progress == 100 && app.writer.isBurning()">Finishing...</span>
|
|
<span ng-show="app.state.progress == 0 && !app.writer.isBurning()">Burn!</span>
|
|
<span ng-show="app.state.progress == 0 && app.writer.isBurning() && !app.state.speed">Starting...</span>
|
|
<span ng-show="app.state.speed && app.state.progress != 100"
|
|
ng-bind="app.state.progress + '% '"></span>
|
|
</hero-progress-button>
|
|
|
|
<p class="step-footer" ng-bind="app.state.speed.toFixed(2) + ' MB/s'" ng-show="app.state.speed && app.state.progress != 100"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|