<div class="lt-home" ng-controller="HomeController as vm">
    <div class="lt-home__container">
        <span ng-show="false">{{'Home' | translate}}</span>
        <h1 class="remove-top-margin">Welcome, {{User.name}}</h1>
        <p class="lt-home__description">Take control of your intranet and configure your components here.</p>

        <div ng-controller="PowerpanelAccelerateController as ppAccelerateController"
             ng-show="!vm.hasAdmins || (ppAccelerateController.pageIsReady && !ppAccelerateController.isAlreadyInstalled) || !vm.teamsAppIsDownloaded">
            <h2>To get you started</h2>
            <ul class="lt-tiles">
                <li class="lt-tiles__item"
                    ng-show="!vm.hasAdmins"
                    ng-click='setContent("Administration.html", "Permissions")'>
                    <div class="lt-tiles__icon">
                        <img src="/Base/Content/images/admins.png" />
                    </div>
                    <div class="lt-tiles__title lt-tiles-title">
                        <div class="lt-tiles-title__text lt-tiles-title__text--left">Setup Admins</div>
                        <div class="lt-tiles-title__action"><i class="streamline icon-arrow-right-1"></i></div>
                    </div>
                </li>
                <li class="lt-tiles__item"                    
                    ng-show="ppAccelerateController.pageIsReady && !ppAccelerateController.isAlreadyInstalled"
                    ng-click='setContent("Modules.html", "Everywhere", "Accelerate")'>
                    <div class="lt-tiles__icon">
                        <img src="/Base/Content/images/accelerate.png" />
                    </div>
                    <div class="lt-tiles__title lt-tiles-title">
                        <div class="lt-tiles-title__text lt-tiles-title__text--left">Accelerate Everywhere</div>
                        <div class="lt-tiles-title__action"><i class="streamline icon-arrow-right-1"></i></div>
                    </div>
                </li>
                <li class="lt-tiles__item"
                    ng-show="!vm.teamsAppIsDownloaded"
                    ng-click='setContent("Modules.html", "Everywhere", "Teams app")'>
                    <div class="lt-tiles__icon">
                        <img src="/Base/Content/images/install.png" />
                    </div>
                    <div class="lt-tiles__title lt-tiles-title">
                        <div class="lt-tiles-title__text lt-tiles-title__text--left">Install Everywhere for Teams</div>
                        <div class="lt-tiles-title__action"><i class="streamline icon-arrow-right-1"></i></div>
                    </div>
                </li>
            </ul>
        </div>

        <div ng-controller="Wizdom365LicenseController">
            <h2>Your Info</h2>
            <div class="lt-license">
                <div class="lt-license__container" ng-if="checkingLicenseServer">
                    <div class="lt-license__row">
                        {{'Checking license server...' | translate}}
                    </div>
                </div>
                <div class="lt-license__container" ng-if="!checkingLicenseServer">
                    <h2 class="lt-license__title">License</h2>

                    <div class="lt-license__row">

                        <div class="lt-license-row__name">{{"Status:" | translate}}</div>
                        <div class="lt-license-row__value"><span class="{{wizdomLicense.licenseClass}}">{{wizdomLicense.licenseStatusMessage | translate}}</span></div>

                    </div>

                    <!--<div class="lt-license__row">

                        <div class="lt-license-row__name">{{"Company:" | translate}}</div>
                        <div class="lt-license-row__value">{{wizdomLicense.companyName}}</div>

                    </div>-->

                    <div class="lt-license__row">

                        <div class="lt-license-row__name">{{"Expiration date:" | translate}}</div>
                        <div class="lt-license-row__value">{{wizdomLicense.expiryDate | date}}</div>

                    </div>

                    <div class="lt-license__row">

                        <div class="lt-license-row__name">{{"Number of users:" | translate}}</div>
                        <div class="lt-license-row__value">{{wizdomLicense.numberOfUsers}}</div>

                    </div>

                    <div class="lt-license__row">

                        <div class="lt-license-row__name">{{"Time to live:" | translate}}</div>
                        <div class="lt-license-row__value">{{wizdomLicense.timeToLive | date: 'medium'}}</div>

                    </div>

                    <div class="lt-license__row">

                        <div class="lt-license-row__name">{{"Issued:" | translate}}</div>
                        <div class="lt-license-row__value">{{wizdomLicense.issued | date:'medium'}}</div>

                    </div>
                    <div ng-if="wizdomLicense.modules.length > 0">
                        <h2 class="lt-license__title">{{"Modules" | translate}}</h2>


                        <div class="lt-license__row" ng-repeat-start="module in wizdomLicense.modules">

                            <div class="lt-license-row__name">{{module.name}}</div>
                            <div class="lt-license-row__value"><span class="{{module.licenseClass}}">{{module.licenseStatusMessage | translate}}</span></div>

                        </div>
                        <div class="lt-license__row" ng-repeat-end>

                            <div class="lt-license-row__name">{{"Expiration date:" | translate}}</div>
                            <div class="lt-license-row__value">{{module.expiryDate | date: 'shortDate'}}</div>

                        </div>

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

    </div>
</div>
