general.component.html

<div class="mat-typography">
  <form #general="ngForm" name="GeneraSetting">
    <h2>Display Modes</h2>
    <mat-checkbox class="full-width" [(ngModel)]="autoNightModeConfig" [ngModelOptions]="{standalone: false}" name="autoNightMode" (change)="isAutoNightPathSupported($event)">Automatically change between Day and Night Modes based on sun phases preserving your night vision</mat-checkbox>
    <mat-checkbox class="full-width" [(ngModel)]="enableHighContrast" [ngModelOptions]="{standalone: false}" name="enableHighContrast" (change)="setTheme($event)">Enable full sunlight High Contrast, black and white display</mat-checkbox>
    <h2>Notifications</h2>
    <p class="mat-card-subtitle">Notifications are a special type of data sent from Signal K and displayed in the
      notification menu. They are meant to alert or inform operators. Set server
      notification preferences such as types of messages to display and audio prompts.</p>
    <mat-slide-toggle
      name="disableNotifications"
      [(ngModel)]="notificationConfig.disableNotifications"
      [ngModelOptions]="{standalone: true}"
      color="primary">
        Disable All Notifications</mat-slide-toggle>
    <mat-accordion>
      <mat-expansion-panel expanded="true">
        <mat-expansion-panel-header>
          <mat-panel-title>
            Messages
          </mat-panel-title>
          <mat-panel-description>
            Control what messages the server will send
          </mat-panel-description>
        </mat-expansion-panel-header>
        <mat-checkbox [(ngModel)]="notificationConfig.devices.showNormalState" [ngModelOptions]="{standalone: true}">Show Devices Informational notifications</mat-checkbox>
      </mat-expansion-panel>
      <mat-expansion-panel expanded="false">
        <mat-expansion-panel-header>
          <mat-panel-title>
            Audio
          </mat-panel-title>
          <mat-panel-description>
            Configure sound options
          </mat-panel-description>
        </mat-expansion-panel-header>
        <mat-checkbox [(ngModel)]="notificationConfig.sound.disableSound" [ngModelOptions]="{standalone: true}">Disable All Audio notification</mat-checkbox>
        <br/>
        <mat-checkbox [(ngModel)]="notificationConfig.sound.muteNormal" [ngModelOptions]="{standalone: true}">Disable <b>Information</b> notifications</mat-checkbox>
        <br/>
        <mat-checkbox [(ngModel)]="notificationConfig.sound.muteAlert" [ngModelOptions]="{standalone: true}">Disable <b>Alert Severity</b> notifications</mat-checkbox>
        <br/>
        <mat-checkbox [(ngModel)]="notificationConfig.sound.muteWarning" [ngModelOptions]="{standalone: true}">Disable <b>Warning</b> notifications</mat-checkbox>
        <br/>
        <mat-checkbox [(ngModel)]="notificationConfig.sound.muteAlarm" [ngModelOptions]="{standalone: true}">Disable <b>Alarm Severity</b> notifications</mat-checkbox>
        <br/>
        <mat-checkbox [(ngModel)]="notificationConfig.sound.muteEmergency" [ngModelOptions]="{standalone: true}">Disable <b>Emergency Severity</b> notifications</mat-checkbox>
      </mat-expansion-panel>
    </mat-accordion>
    <div class="formActionFooter">
      <mat-divider class="formActionDivider"></mat-divider>
      <button mat-raised-button color="accent" class="formActionButton" (click)='saveAllSettings()'>Save</button>
    </div>
  </form>
</div>