ztimson/homefront
ztimson/homefront
1
0
Fork 0
Code Issues Pull Requests Actions Releases Activity

Added placeholder security screen

Browse Source
This commit is contained in:
Zakary Timson 2019-01-01 22:11:03 -05:00
parent c73fa88cda
commit d388e8b73d
2 changed files with 45 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/app/security/security.component.html
View File

@ -1 +1,31 @@
<h3 class="mt-3 text-center">Coming Soon</h3>
<div class="desktop-height p-3">
<div style="max-width: 1000px">
<mat-card>
<mat-card-content>
<div class="d-flex align-items-center">
<div class="mr-2">
<button mat-icon-button (click)="toggle()">
<mat-icon style="font-size: 36px" [ngClass]="{'text-primary': armed}">power_settings_new</mat-icon>
</button>
</div>
<div>
<h1 *ngIf="armed" class="d-inline mb-0">Armed</h1>
<h1 *ngIf="!armed" class="d-inline mb-0">Standby</h1>
</div>
</div>
</mat-card-content>
</mat-card>
<mat-card class="mt-3">
<mat-card-content>
<h3>Log</h3>
<mat-divider></mat-divider>
<div class="pt-2">
<div *ngFor="let l of log">
<span class="text-muted">{{l.timestamp | date: 'short'}}:</span>
<span class="ml-2">{{l.message}}</span>
</div>
</div>
</mat-card-content>
</mat-card>
</div>
</div>

14
src/app/security/security.component.ts
View File

@ -1,14 +1,20 @@
import { Component, OnInit } from '@angular/core';
import {Component} from '@angular/core';
@Component({
selector: 'app-security',
templateUrl: './security.component.html'
})
export class SecurityComponent implements OnInit {
export class SecurityComponent {
armed: boolean = false;
log = [
{timestamp: new Date(), message: 'Currently under construction'},
{timestamp: new Date(), message: 'Give the power button a flick!'},
];
constructor() { }
ngOnInit() {
toggle() {
this.armed = !this.armed;
this.log = [{timestamp: new Date(), message: this.armed ? 'Arming Security' : 'Disengaged'}].concat(this.log);
}
}