feat: enhance device firmware page (#588)

* feat: enhance device firmware page

* remove confirmation dialog from firmware upgrade buttons
This commit is contained in:
Róbert Kiss
2018-03-15 12:20:35 +01:00
committed by László Monda
parent e8fe0f8d3e
commit 2f00a5eaf4
6 changed files with 30 additions and 40 deletions

View File

@@ -15,22 +15,20 @@
</i></p>
<p>
Flash firmware {{ (getAgentVersionInfo$ | async).firmwareVersion }} (bundled with Agent)
<button class="btn btn-primary"
[disabled]="flashFirmwareButtonDisbabled$ | async"
(click)="onUpdateFirmware()">Flash firmware
</button>
</p>
<p>
Flash firmware file <input id="firmware-file-select"
type="file"
[disabled]="flashFirmwareButtonDisbabled$ | async"
(change)="changeFile($event)">
<button class="btn btn-primary"
[disabled]="flashFirmwareButtonDisbabled$ | async"
(click)="onUpdateFirmwareWithFile()">Flash firmware
(click)="onUpdateFirmware()">
Flash firmware {{ (getAgentVersionInfo$ | async).firmwareVersion }} (bundled with Agent)
</button>
<label class="btn btn-primary btn-file"
[class.disabled]="flashFirmwareButtonDisbabled$ | async">
Choose firmware file and flash it
<input id="firmware-file-select"
type="file"
accept=".tar.bz2"
[disabled]="flashFirmwareButtonDisbabled$ | async"
(change)="changeFile($event)">
</label>
</p>
</div>

View File

@@ -23,7 +23,6 @@ export class DeviceFirmwareComponent implements OnDestroy {
getAgentVersionInfo$: Observable<VersionInformation>;
firmwareOkButtonDisabled$: Observable<boolean>;
arrayBuffer: Uint8Array;
@ViewChild('scrollMe') divElement: ElementRef;
constructor(private store: Store<AppState>) {
@@ -48,14 +47,6 @@ export class DeviceFirmwareComponent implements OnDestroy {
this.store.dispatch(new UpdateFirmwareAction());
}
onUpdateFirmwareWithFile(): void {
if (!this.arrayBuffer) {
return;
}
this.store.dispatch(new UpdateFirmwareWithAction(Array.prototype.slice.call(this.arrayBuffer)));
}
onOkButtonClick(): void {
this.store.dispatch(new UpdateFirmwareOkButtonAction());
}
@@ -64,14 +55,13 @@ export class DeviceFirmwareComponent implements OnDestroy {
const files = event.srcElement.files;
if (files.length === 0) {
this.arrayBuffer = null;
return;
}
const fileReader = new FileReader();
fileReader.onloadend = function () {
this.arrayBuffer = new Uint8Array(fileReader.result);
const arrayBuffer = new Uint8Array(fileReader.result);
this.store.dispatch(new UpdateFirmwareWithAction(Array.prototype.slice.call(arrayBuffer)));
}.bind(this);
fileReader.readAsArrayBuffer(files[0]);
}

View File

@@ -128,12 +128,14 @@
<ul [@toggler]="animation['agent']">
<li class="sidebar__level-2--item">
<div class="sidebar__level-2" [routerLinkActive]="['active']">
<a [routerLink]="['/settings']">Settings</a>
<a [routerLink]="['/settings']"
[class.disabled]="updatingFirmware$ | async">Settings</a>
</div>
</li>
<li class="sidebar__level-2--item">
<div class="sidebar__level-2" [routerLinkActive]="['active']">
<a [routerLink]="['/about']">About</a>
<a [routerLink]="['/about']"
[class.disabled]="updatingFirmware$ | async">About</a>
</div>
</li>
</ul>

View File

@@ -9,6 +9,10 @@
a {
color: #333;
&.disabled {
opacity: 0.65;
}
}
// General list styles for the sidebar-menu.
@@ -112,6 +116,10 @@ ul {
&:focus {
text-decoration: none;
}
&.disabled {
opacity: 0.65;
}
}
}
}