<div class="statusBox">
    <h2>{{ 'dashboard.status.mach.title' | translate }}</h2>
    <div *ngIf="machineinfo; else noMachineInfo">
        <div>
            <p>{{ 'dashboard.status.mach.load' | translate }}</p>
            <ul>
                <li>1 {{ 'dashboard.status.mach.minute' | translate }}: {{ machineinfo.LoadAvg1.toLocaleString() }}</li>
                <li>5 {{ 'dashboard.status.mach.minutes' | translate }}: {{ machineinfo.LoadAvg2.toLocaleString() }}</li>
                <li>15 {{ 'dashboard.status.mach.minutes' | translate }}: {{ machineinfo.LoadAvg3.toLocaleString() }}</li>
            </ul>
        </div>
        <div *ngIf="getStorageGroupTotal(machineinfo.StorageGroups) as sg; else noDiskInfo">
            <p>{{ 'dashboard.status.mach.disk_summ' | translate }}:</p>
            <ul>
                <!-- pretty print values in MB/GB -->
                <li>{{ 'dashboard.status.mach.disk_total' | translate }}:</li>
                <ul>
                    <li>{{ 'dashboard.status.mach.total_space' | translate }}: {{ sg.Total.toLocaleString() }} MiB</li>
                    <li>{{ 'dashboard.status.mach.space_used' | translate }}: {{ sg.Used.toLocaleString() }} MiB</li>
                    <li>{{ 'dashboard.status.mach.space_free' | translate }}: {{ sg.Free.toLocaleString() }} MiB</li>
                    <li>{{ 'dashboard.status.mach.space_after_expire' | translate }}: {{ (sg.Free + sg.Expirable).toLocaleString() }}</li>
                    <ul>
                        <li>{{ 'dashboard.status.mach.space_livetv' | translate }}: {{ sg.LiveTV.toLocaleString() }} MiB</li>
                        <li>{{ 'dashboard.status.mach.space_deleted' | translate }}: {{ sg.Deleted.toLocaleString() }} MiB</li>
                        <li>{{ 'dashboard.status.mach.space_expirable' | translate }}: {{ sg.Expirable.toLocaleString() }} MiB</li>
                    </ul>
                </ul>
            </ul>
        </div>
        <div>
            <p>{{ 'dashboard.status.mach.disk_details' | translate }}:</p>
            <div *ngFor="let sg of getStorageGroupDetails(machineinfo.StorageGroups)">
                <ng-container *ngTemplateOutlet="printStorageGroup; context: sg"></ng-container>
            </div>
        </div>
        <div>
            <p>{{ 'dashboard.status.mach.backendver' | translate }}:
                {{status?.SourcePath}} {{status?.SourceVer}}<br>
                {{ 'dashboard.status.mach.hostname' | translate }}: {{status?.HostName}}</p>
            <p>{{ 'dashboard.status.mach.mythfill_last'
                | translate: {GuideStart: utility.formatDateTime(machineinfo.GuideStart),
                GuideEnd: utility.formatDateTime(machineinfo.GuideEnd),
                GuideStatus: machineinfo.GuideStatus} }}<br>
                {{ 'dashboard.status.mach.mythfill_next'
                | translate: {GuideNext: utility.formatDateTime(machineinfo.GuideNext)} }}<br>
                {{ 'dashboard.status.mach.mythfill_until'
                | translate: {GuideThru: utility.formatDateTime(machineinfo.GuideThru),
                GuideDays: machineinfo.GuideDays} }}
            </p>

        </div>
    </div>
</div>

<ng-template #noMachineInfo>
    <p>{{ 'dashboard.status.mach.none' | translate }}</p>
</ng-template>
<ng-template #noDiskInfo>
    <p>{{ 'dashboard.status.mach.disk_none' | translate }}</p>
</ng-template>
<ng-template #printStorageGroup let-Id=Id let-Directory=Directory let-Total=Total let-Used=Used let-Free=Free>
    <ul>
        <li>{{ 'dashboard.status.mach.myth_drive' | translate }} #{{ Id }}</li>
        <ul>
            <li>{{ 'dashboard.status.mach.disk_dirs' | translate }}: {{ Directory }}</li>
            <li>{{ 'dashboard.status.mach.total_space' | translate }}: {{ Total.toLocaleString() }}  MiB</li>
            <li>{{ 'dashboard.status.mach.space_used' | translate }}: {{ Used.toLocaleString() }}  MiB</li>
            <li>{{ 'dashboard.status.mach.space_free' | translate }}: {{ Free.toLocaleString() }}  MiB</li>
        </ul>
    </ul>
</ng-template>