From 9fc79868aa625446811f5846072edbca9ff914a7 Mon Sep 17 00:00:00 2001
From: Dulitha Wijewantha <dulithaz@gmail.com>
Date: Tue, 20 Jan 2015 18:48:07 +0530
Subject: [PATCH] Added a tabbed layout for the device list UI

---
 .../jaggeryapps/cdm/pages/dashboard.jag       | 50 +++++++++++++------
 1 file changed, 34 insertions(+), 16 deletions(-)

diff --git a/product/modules/distribution/src/repository/jaggeryapps/cdm/pages/dashboard.jag b/product/modules/distribution/src/repository/jaggeryapps/cdm/pages/dashboard.jag
index 35d2f255b5..7231b35304 100644
--- a/product/modules/distribution/src/repository/jaggeryapps/cdm/pages/dashboard.jag
+++ b/product/modules/distribution/src/repository/jaggeryapps/cdm/pages/dashboard.jag
@@ -14,25 +14,43 @@ var title="WSO2 CDM";
             <div class="row">
                 <div class="col-sm-9 main col-centered">
                     <h2 class="sub-header">Devices list</h2>
+                    <!--
                     <div class="row">
                         <div class="col-md-1"><button type="button" class="btn btn-primary">Execute</button></div>
                     </div>
-                    <div class="table-responsive">
-                        <table id="table-pagination" data-toggle="table" data-url="data2.json"  data-query-params="queryParams" data-height="400" data-pagination="true" data-search="true">
-                            <thead>
-                                <tr>
-                                    <th data-field="state" data-checkbox="true"></th>
-                                    <th data-field="identifier" data-align="right" data-sortable="true"  data-formatter="identifierFormatter">Identifier</th>
-                                    <th data-field="name" data-align="center" data-sortable="true">Name</th>
-                                    <th data-field="owner" data-align="center" data-sortable="true">Owner</th>
-                                    <th data-field="ownership" data-align="center" data-sortable="true">Ownership</th>
-                                    <th data-field="deviceType" data-align="center" data-sortable="true">Device Type</th>
-                                    <th data-field="vendor" data-align="center" data-sortable="true">Vendor</th>
-                                    <th data-field="model" data-align="center" data-sortable="true">Model</th>
-                                    <th data-field="osVersion" data-align="center" data-sortable="true">OS Version</th>
-                                </tr>
-                            </thead>
-                        </table>
+                    -->
+                    <div role="devicepanel">
+
+                      <!-- Nav tabs -->
+                      <ul class="nav nav-tabs" role="tablist">
+                        <li role="presentation" class="active"><a href="#mobile" aria-controls="home" role="tab" data-toggle="tab">Mobile</a></li>
+                        <li role="presentation"><a href="#raspberrypi" aria-controls="profile" role="tab" data-toggle="tab">RaspberryPi</a></li>
+                      </ul>
+
+                      <!-- Tab panes -->
+                      <div class="tab-content">
+                        <div role="devicepanel" class="tab-pane active" id="mobile">
+                            <div class="table-responsive">
+                                <table id="table-pagination" data-toggle="table" data-url="data2.json"  data-query-params="queryParams" data-height="400" data-pagination="true" data-search="true">
+                                    <thead>
+                                        <tr>
+                                            <th data-field="state" data-checkbox="true"></th>
+                                            <th data-field="identifier" data-align="right" data-sortable="true"  data-formatter="identifierFormatter">Identifier</th>
+                                            <th data-field="name" data-align="center" data-sortable="true">Name</th>
+                                            <th data-field="owner" data-align="center" data-sortable="true">Owner</th>
+                                            <th data-field="ownership" data-align="center" data-sortable="true">Ownership</th>
+                                            <th data-field="deviceTypeId" data-align="center" data-sortable="true">Device Type</th>
+                                            <th data-field="vendor" data-align="center" data-sortable="true">Vendor</th>
+                                            <th data-field="model" data-align="center" data-sortable="true">Model</th>
+                                            <th data-field="osVersion" data-align="center" data-sortable="true">OS Version</th>
+                                        </tr>
+                                    </thead>
+                                </table>
+                            </div>
+                        </div>
+                        <div role="devicepanel" class="tab-pane" id="raspberrypi">sdfweroiweuroi</div>
+                      </div>
+
                     </div>
                 </div>
             </div>