added placeholder statechanges for faults/statuses

SeniorDesignGroup5 · Apr 10, 2019 · f37f56a · f37f56a
1 parent 23ffc34
commit f37f56a
Showing 1 changed file with 65 additions and 17 deletions.
diff --git a/src/app/statistics/statistics.component.html b/src/app/statistics/statistics.component.html
@@ -107,57 +107,105 @@
           <h3 class = "p-3">Faults</h3>
         </div>
         <div class = "col-md-6">
-          <h5><span class="badge badge-danger">Overcrank</span></h5>
+          <h5 *ngIf = "1 == 2; else emptyOvercrank"><span class="badge badge-danger">Overcrank</span></h5>
+          <ng-template #emptyOvercrank>
+             <h5><span class="badge badge-secondary">Overcrank</span></h5> 
+          </ng-template>
         </div>
         <div class = "col-md-6">  
-          <h5><span class="badge badge-danger">High Engine<br>Temperature</span></h5>   
+          <h5 *ngIf = "1 == 2; else emptyEngine"><span class="badge badge-danger">High Engine<br>Temperature</span></h5>
+          <ng-template #emptyEngine>
+             <h5><span class="badge badge-secondary">High Engine<br>Temperature</span></h5> 
+          </ng-template>   
         </div>
         <div class = "col-md-6">
-          <h5><span class="badge badge-danger">Low Oil<br>Pressure</span></h5>
+          <h5 *ngIf = "1 == 2; else emptyOil"><span class="badge badge-danger">Low Oil<br>Pressure</span></h5>
+          <ng-template #emptyOil>
+             <h5><span class="badge badge-secondary">Low Oil<br>Pressure</span></h5> 
+          </ng-template> 
         </div>
         <div class = "col-md-6">  
-           <h5><span class="badge badge-danger">Overspeed</span></h5>  
+           <h5 *ngIf = "1 == 2; else emptyOverspeed"><span class="badge badge-danger">Overspeed</span></h5> 
+           <ng-template #emptyOverspeed>
+             <h5><span class="badge badge-secondary">Overspeed</span></h5> 
+          </ng-template>  
         </div>
         <div class = "col-md-6">
-           <h5><span class="badge badge-danger">Emergency Stop</span></h5>
+           <h5 *ngIf = "1 == 2; else emptyEmergency"><span class="badge badge-danger">Emergency Stop</span></h5>
+           <ng-template #emptyEmergency>
+             <h5><span class="badge badge-secondary">Emergency Stop</span></h5> 
+          </ng-template> 
         </div>
         <div class = "col-md-6">  
-          <h5><span class="badge badge-danger">Low Fuel</span></h5>    
+          <h5 *ngIf = "1 == 1; else emptyLowFuel"><span class="badge badge-danger">Low Fuel</span></h5>
+          <ng-template #emptyLowFuel>
+             <h5><span class="badge badge-secondary">Low Fuel</span></h5> 
+          </ng-template>     
         </div>
         <div class = "col-md-6">
-          <h5><span class="badge badge-danger">Low Coolant<br>Level/Aux</span></h5>
+          <h5 *ngIf = "1 == 2; else emptyLowCoolant"><span class="badge badge-danger">Low Coolant<br>Level/Aux</span></h5>
+          <ng-template #emptyLowCoolant>
+             <h5><span class="badge badge-secondary">Low Coolant<br>Level/Aux</span></h5> 
+          </ng-template> 
         </div>
         <div class = "col-md-6">  
-          <h5><span class="badge badge-danger">Low Cranking<br>Voltage</span></h5> 
+          <h5 *ngIf = "1 == 1; else emptyLowCranking"><span class="badge badge-danger">Low Cranking<br>Voltage</span></h5>
+          <ng-template #emptyLowCranking>
+             <h5><span class="badge badge-secondary">Low Cranking<br>Voltage</span></h5> 
+          </ng-template>  
         </div>
         <div class = "col-md-6">
-          <h5><span class="badge badge-danger">Battery Voltage<br>(Hi/Lo)</span></h5>
+          <h5 *ngIf = "1 == 2; else emptyBatteryVolt"><span class="badge badge-danger">Battery Voltage<br>(Hi/Lo)</span></h5>
+          <ng-template #emptyBatteryVolt>
+             <h5><span class="badge badge-secondary">Battery Voltage<br>(Hi/Lo)</span></h5> 
+          </ng-template> 
         </div>
         <div class = "col-md-6">  
-          <h5><span class="badge badge-danger">Battery Charger<br>Fail</span></h5>     
+          <h5 *ngIf = "1 == 2; else emptyBatteryCharger"><span class="badge badge-danger">Battery Charger<br>Fail</span></h5>
+          <ng-template #emptyBatteryCharger>
+             <h5><span class="badge badge-secondary">Battery Charger<br>Fail</span></h5> 
+          </ng-template>      
         </div>
         <div class = "col-md-6">
-          <h5><span class="badge badge-danger">Common Fault</span></h5>
+          <h5 *ngIf = "1 == 1; else emptyCommon"><span class="badge badge-danger">Common Fault</span></h5>
+          <ng-template #emptyCommon>
+             <h5><span class="badge badge-secondary">Common Fault</span></h5> 
+          </ng-template> 
         </div>        
       </div>
       <div class = "row status ">
         <div class = "col-md-12 ">
-          <h3 class = "p-3">System Status</h3>
+          <h3 class = "p-3">System Status</h3>          
         </div>
         <div class = "col-md-6">
-          <h5><span class="badge badge-success">EPS Supplying<br>Load</span></h5>
+          <h5 *ngIf = "1 == 2; else emptyEPS"><span class="badge badge-success">EPS Supplying<br>Load</span></h5>
+          <ng-template #emptyEPS>
+             <h5><span class="badge badge-secondary">EPS Supplying<br>Load</span></h5> 
+          </ng-template> 
         </div>
         <div class = "col-md-6">  
-          <h5><span class="badge badge-success">Not-In-Auto</span></h5>    
+          <h5 *ngIf = "1 == 2; else emptyAuto"><span class="badge badge-success">Not-In-Auto</span></h5>
+          <ng-template #emptyAuto>
+             <h5><span class="badge badge-secondary">Not-In-Auto</span></h5> 
+          </ng-template>     
         </div>
         <div class = "col-md-6">
-          <h5><span class="badge badge-success">System Running</span></h5>  
+          <h5 *ngIf = "1 == 1; else emptySystem"><span class="badge badge-success">System Running</span></h5>
+          <ng-template #emptySystem>
+             <h5><span class="badge badge-secondary">System Running</span></h5> 
+          </ng-template>   
         </div>
         <div class = "col-md-6">  
-          <h5><span class="badge badge-success">Generator<br>Running</span></h5>   
+          <h5 *ngIf = "1 == 1; else emptyGenerator"><span class="badge badge-success">Generator<br>Running</span></h5>
+          <ng-template #emptyGenerator>
+             <h5><span class="badge badge-secondary">Generator<br>Running</span></h5> 
+          </ng-template>    
         </div>
         <div class = "col-md-6">
-          <h5><span class="badge badge-success">Communication<br>Status</span></h5> 
+          <h5 *ngIf = "1 == 2; else emptyCommunication"><span class="badge badge-success">Communication<br>Status</span></h5>
+          <ng-template #emptyCommunication>
+             <h5><span class="badge badge-secondary">Communication<br>Status</span></h5> 
+          </ng-template>  
         </div>        
       </div>
   </div>