Adding new UX design for Raspberry Pi device details page.

components/device-types/raspberrypi-plugin/org.wso2.carbon.device.mgt.iot.raspberrypi.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.raspberrypi.device-view/device-view.hbs

@@ -24,14 +24,37 @@
 {{/zone}}
 
 {{#zone "device-thumbnail"}}
-    <img src="{{@unit.publicUri}}/images/respberry-icon.png"/>
+    <img src="{{@unit.publicUri}}/images/respberry-icon.png" class="img-responsive"/>
+{{/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}}">
+    {{device.enrolmentInfo.owner}}'s {{device.name}}
+      <a id="device-info-tooltip" href="#" data-toggle="tooltip" title="Device Identifier: {{device.deviceIdentifier}}">
+        <i class="fw fw-info"></i>
+      </a>
+    </h1>
+    <h4>Ownership - <strong>{{device.enrolmentInfo.ownership}}</strong></h4>
+    <h4>Device is
+      <strong>
+        {{#equal device.enrolmentInfo.status "ACTIVE"}}Active{{/equal}}
+        {{#equal device.enrolmentInfo.status "INACTIVE"}}Inactive{{/equal}}
+        {{#equal device.enrolmentInfo.status "BLOCKED"}}Blocked{{/equal}}
+        {{#equal device.enrolmentInfo.status "REMOVED"}}Removed{{/equal}}
+        {{#equal device.enrolmentInfo.status "UNREACHABLE"}}Unreachable{{/equal}}
+      </strong>
+    </h4>
 {{/zone}}
 
 {{#zone "device-opetations"}}
-    <div style="background: #11375B; color: #fff; padding: 10px; margin-bottom: 5px">
-        Operations
+    <div class="operation-container">
+      <div class="operation-title">
+          <h4>Device Operations</h4>
       </div>
-    <div class="add-margin-top-4x">
       {{unit "cdmf.unit.device.operation-bar" device=device autoCompleteParams=autoCompleteParams
         encodedFeaturePayloads=encodedFeaturePayloads}}
     </div>
@@ -42,10 +65,6 @@
                           data-toggle="tab" aria-controls="device_statistics">Device
                                                                               Statistics</a>
     </li>
-    <li><a class="list-group-item" href="#event_log" role="tab" data-toggle="tab"
-           aria-controls="event_log">Operations Log</a></li>
-    <li><a class="list-group-item" href="#geo_dashboard" role="tab" data-toggle="tab"
-           aria-controls="geo_dashboard">Map</a></li>
 {{/zone}}
 
 {{#zone "device-view-tab-contents"}}
@@ -54,43 +73,4 @@
         <div class="panel-heading">Device Statistics</div>
         {{unit "cdmf.unit.device.type.raspberrypi.realtime.analytics-view" device=device}}
     </div>
-    <div class="panel panel-default tab-pane" id="event_log" role="tabpanel"
-         aria-labelledby="event_log">
-        <div class="panel-heading">Operations Log <span><a href="#"
-                                                           id="refresh-operations"><i
-                class="fw fw-refresh"></i></a></span></div>
-        <div class="panel-body">
-            <div id="operations-spinner" class="wr-advance-operations-init hidden">
-                <br>
-
-                <i class="fw fw-settings fw-spin fw-2x"></i>
-
-                Loading Operations Log . . .
-                <br>
-                <br>
-            </div>
-            <div id="operations-log-container">
-                <div class="panel-body">
-                    Not available yet
-                </div>
-                <br class="c-both"/>
-            </div>
-        </div>
-    </div>
-    <div class="panel panel-default tab-pane"
-         id="geo_dashboard" role="tabpanel" aria-labelledby="geo_dashboard">
-        <div class="panel-heading">Map</div>
-
-        <div id="chartWrapper">
-        </div>
-
-        <a class="padding-left"
-           href="{{portalUrl}}/portal/dashboards/geo-dashboard/?GLOBAL-STATE={{anchor}}">
-
-            <span class="fw-stack">
-                <i class="fw fw-circle-outline fw-stack-2x"></i>
-                <i class="fw fw-statistics fw-stack-1x"></i>
-            </span> View Device Location
-        </a>
-    </div>
 {{/zone}}

components/mobile-plugins/android-plugin/org.wso2.carbon.device.mgt.mobile.android.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android.device-view/device-view.hbs

@@ -50,6 +50,7 @@
         {{/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>
@@ -69,6 +70,7 @@
               <p>Battery, RAM and Storage related information are not
               available yet.</p>
             {{/if}}
+          </div>
         {{/zone}}
 
         {{#zone "device-details-tab-injected"}}

components/mobile-plugins/windows-plugin/org.wso2.carbon.device.mgt.mobile.windows.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.windows.device-view/device-view.hbs

@@ -52,6 +52,7 @@
         {{/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>
@@ -67,6 +68,7 @@
               <p>Battery, RAM and Storage related information are not
               available yet.</p>
             {{/if}}
+        </div>
         {{/zone}}
 
         {{#zone "device-details-tab-injected"}}