{{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}}
            </h1>
            <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>
            {{#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"
                   data-lat="{{device.location.latitude}}"
                   data-long="{{device.location.longitude}}"
                   class="initGeoLocationLink">Location</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 ">
                {{#if device.location}}
                    <div class="tab-actions">
                        <div class="action-btn-container" id="location-action-bar">
                        </div>
                    </div>
                    <br/>
                    {{unit "cdmf.unit.geo-dashboard" device=device noGeoFencing=false hideSearch=true}}
                {{else}}
                    <div id="map-error" class="message message-warning">
                        <h4 class="remove-margin">
                            <i class="icon fw fw-warning"></i>
                            The device location information is not available right now! Please refresh the page in a few minutes.
                            The location details will not be available if the device’s “Location Services setting” is disabled
                            or if WSO2 IoT Server has not received the device’s location information from the device.
                        </h4>
                    </div>
                    <p class="add-padding-5x"></p>
                    <p class="add-padding-5x"></p>
                    <p class="add-padding-5x"></p>
                {{/if}}
            </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>
        {{js "js/device-detail.js"}}
    {{/if}}
{{/zone}}
