{{unit "cdmf.unit.device.type.windows.leaflet"}}
{{unit "cdmf.unit.lib.editable"}}
{{unit "cdmf.unit.lib.qrcode"}}
{{unit "cdmf.unit.device.type.qr-modal"}}

{{#if deviceFound}}
    {{#if isAuthorized}}

        {{#zone "device-thumbnail"}}
          <i class="fw fw-windows device-type fw-1x"></i>
        {{/zone}}

        {{#zone "device-details-header"}}
            <h1 class="device-id"
            data-deviceid="{{device.deviceIdentifier}}"
            data-type="{{device.type}}"
            data-ownership="{{device.ownership}}"
            data-owner="{{device.owner}}"
            data-status="{{device.status}}">
            {{device.owner}}'s {{device.name}}
              <a id="device-info-tooltip" href="#" data-toggle="tooltip" title="Device Identifier: {{device.deviceIdentifier}}
              Firmware Build Date: {{device.osBuildDate}}
              UDID: {{device.udid}}">
                <i class="fw fw-info"></i>
              </a>
            </h1>
            {{#if device.model}}
              <h4>{{device.vendor}} {{device.model}}</h4>
            {{/if}}
            <h4>Ownership - <strong>{{device.ownership}}</strong></h4>
            <h4>Device is
              <strong>
                {{#equal device.status "ACTIVE"}}Active{{/equal}}
                {{#equal device.status "INACTIVE"}}Inactive{{/equal}}
                {{#equal device.status "BLOCKED"}}Blocked{{/equal}}
                {{#equal device.status "REMOVED"}}Removed{{/equal}}
                {{#equal device.status "UNREACHABLE"}}Unreachable{{/equal}}
              </strong>
            </h4>
        {{/zone}}

        {{#zone "device-opetations"}}
            {{#if device.isNotRemoved}}
                <div class="operation-container">
                  <div class="operation-title">
                      <h4>Device Operations</h4>
                  </div>
                  {{unit "cdmf.unit.device.type.windows.new.operation-bar" device=device
                  backendApiUri=backendApiUri autoCompleteParams=autoCompleteParams}}
                </div>
            {{/if}}
        {{/zone}}

        {{#zone "device-details"}}
          <div class="vital-strip">
            {{#if device.deviceInfoAvailable}}
              {{#if device.BatteryLevel}}
                <p><i class="icon fw fw-battery fw-2x"></i> <span>{{device.BatteryLevel.value}}%</span></p>
              {{/if}}
              {{#if device.ramUsage}}
                <p><i class="icon fw fw-hardware fw-2x fw-rotate-90"></i> <span>{{device.ramUsage.value}} MB</span></p>
              {{/if}}
              {{#if device.internalMemory}}
                <p><i class="icon fw fw-hdd fw-2x fw-rotate-90"></i> <span>{{device.internalMemory.value}} GB</span>
                </p>
              {{/if}}
            {{else}}
              <p>Battery, RAM and Storage related information are not
              available yet.</p>
            {{/if}}
        </div>
        {{/zone}}

        {{#zone "device-details-tab-injected"}}
            <li><a data-toggle="tab" href="#location">Location</a></li>
            <li><a data-toggle="tab" href="#app">Applications</a></li>
            <li><a data-toggle="tab" href="#policy">Policy Compliance</a></li>
        {{/zone}}

        {{#zone "device-view-tab-injected-conents"}}
            <div id="location" class="tab-pane fade ">
                <iframe width="100%" height="100%" frameborder="0" style="border:0"
                    src="https://www.google.com/maps/embed/v1/place?q=place_id:ChIJk_gsqyVZ4joR4UxR7brwMnA&key=AIzaSyChgf100i4rBz6neCNRyK1D05g9VLY8jvo" allowfullscreen></iframe>
            </div>
            <div id="app" class="tab-pane fade">
              <div id="applications-list-container" data-public-uri="{{@unit.publicUri}}">
              </div>
            </div>
            <div id="policy" class="tab-pane fade">
              <div id="policy-list-container">
              </div>
            </div>

        {{/zone}}

        </div>
        </div>
    {{else}}
        <h1 class="page-sub-title">
            Permission Denied
        </h1>
        <br>
        You are not authorized to view specified device in the system.
    {{/if}}
{{else}}
    <h1 class="page-sub-title">
        Device not found
    </h1>
    <br>
    You have tried to access either a removed or non-existing device.
{{/if}}

{{#zone "bottomJs"}}
    {{#if isAuthorized}}
        <!--suppress HtmlUnknownTarget -->
        <script id="policy-view" src="{{@unit.publicUri}}/templates/policy-compliance.hbs"
                data-device-id="{{device.deviceIdentifier}}" data-device-type="{{device.type}}"
                type="text/x-handlebars-template"></script>
        <!--suppress HtmlUnknownTarget -->
        <script id="applications-list" src="{{@unit.publicUri}}/templates/applications-list.hbs"
                data-device-id="{{device.deviceIdentifier}}" data-device-type="{{device.type}}"
                type="text/x-handlebars-template"></script>
        <!--suppress HtmlUnknownTarget -->
        {{js "js/device-detail.js"}}
        <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
        {{js "js/load-map.js"}}
    {{/if}}
{{/zone}}
