Several improvements

DepartureBoardWeb/ClientApp/src/app/Components/contact-us/contact-us.component.html

@@ -12,6 +12,7 @@
           <a href="mailto:[email protected]"
             >[email protected]</a
           >
+          <br /><em>Please note that this is just my side project so I may be slow to reply.</em>
         </li>
         <li>
           Or start an issue/discussion on

DepartureBoardWeb/ClientApp/src/app/Components/edit-custom-departure/edit-custom-departure.component.html

@@ -49,6 +49,8 @@
       </mat-list-item>
     </mat-list>
 
+    <mat-checkbox [(ngModel)]="departure.isCancelled" (ngModelChange)="changedData()">Mark as Cancelled</mat-checkbox><br />
+
     <button mat-flat-button color="primary" (click)="openStopDialog(index)">Add Stop</button><br /><br />
 
     <button mat-flat-button color="warn" type="button" (click)="removeDeparture(index)">

DepartureBoardWeb/ClientApp/src/app/Pages/boards/board/board.html

@@ -33,7 +33,7 @@ <h5 class="inline-row led">{{DepartureTime | date: 'HH:mm'}}</h5>
   </table>
   <div class="board-row bottom">
     <div
-      [ngClass]="{ 'ontime': Status=='On Time', 'late': Status?.includes('Exp'), 'arrived': Status=='Arrived', 'cancelled': Status=='Cancelled'}"
+      [ngClass]="{ 'ontime': Status=='On Time', 'late': (Status?.includes('Exp') || Status === 'Late'), 'arrived': Status=='Arrived', 'cancelled': Status=='Cancelled'}"
     >
       {{Status}}
     </div>

DepartureBoardWeb/ClientApp/src/app/Pages/boards/board/board.ts

@@ -115,6 +115,10 @@ export class Board {
     this.Length = data.length;
     this.information = this.Operator;
 
+    if (data.isCancelled === true) {
+      data.status = ServiceStatus.CANCELLED;
+    }
+
     if (!data.status || data.status < 0) {
       data.status = this.calculateStatus(data);
     }

DepartureBoardWeb/ClientApp/src/app/Pages/home/home.component.html

@@ -35,7 +35,7 @@ <h1 id="home-title" class="slider-title led-font" style="font-size: 3.3em">
               "
               class="led"
             >
-              Example: Euston
+              Euston
             </h4>
             <div class="board-example">
               <div></div>

DepartureBoardWeb/ClientApp/src/app/Pages/singleboard/singleboard.ts

@@ -369,7 +369,10 @@ export class SingleBoard implements OnDestroy, OnInit {
                 this.subscriptions.push(this.customDepartureSequence.subscribe(startIndex => {
                   // Calculates the Departure Status's
                   validDepartures.map(d => {
-                    if (d.expectedDeparture) {
+                    if (d.isCancelled) {
+                      d.status = ServiceStatus.CANCELLED;
+                    }
+                    else if (d.expectedDeparture) {
                       d.status = new Date(d.expectedDeparture) > new Date(d.aimedDeparture)
                         ? ServiceStatus.LATE
                         : ServiceStatus.ONTIME;

DepartureBoardWeb/ClientApp/src/app/models/departure.model.ts

@@ -12,6 +12,7 @@ export interface Departure {
   length: number;
   stops: StationStop[];
   extraDetails: Dictionary<object>;
+  isCancelled?: boolean | undefined;
 }
 
 export interface StationStop {