From a5d5fa0796e2c983da035be38d67476c44c7ebe7 Mon Sep 17 00:00:00 2001
From: Sarah Hale <sarahlauhale@gmail.com>
Date: Tue, 23 Jun 2015 11:37:57 -0700
Subject: [PATCH] [Events] Table height detection

Created an mct-data-table directive. We are able to detect changes in
the height of the table now, which will be used to determine
any corresponding scrolling. #18.
---
 platform/features/events/bundle.json          |  7 ++++
 .../events/res/templates/messages.html        | 38 +++++++++----------
 2 files changed, 24 insertions(+), 21 deletions(-)

diff --git a/platform/features/events/bundle.json b/platform/features/events/bundle.json
index 495d06b235..549dda7d36 100644
--- a/platform/features/events/bundle.json
+++ b/platform/features/events/bundle.json
@@ -19,6 +19,13 @@
                 "implementation": "EventListController.js",
                 "depends": [ "$scope", "telemetryFormatter" ]
             }
+        ],
+        "directives": [
+            {
+                "key": "mctDataTable",
+                "implementation": "MCTDataTable.js",
+                "depends": [ "$anchorScroll" ]
+            }
         ]
     }
 
diff --git a/platform/features/events/res/templates/messages.html b/platform/features/events/res/templates/messages.html
index 727ab09a79..a549b3530d 100644
--- a/platform/features/events/res/templates/messages.html
+++ b/platform/features/events/res/templates/messages.html
@@ -22,27 +22,23 @@
 <div class="w1" ng-controller="TelemetryController as telemetry">
 	<div class="w2"
 	     ng-controller="EventListController">
-		<table class="tabular">
-			<thead>
-			<tr>
-				<th ng-repeat="header in headers">
-					{{header}}
-				</th>
-			</tr>
-			<!--tr>
-				<th ng-repeat="header in headers">
-					<input type="text" />
-				</th>
-			</tr-->
-			</thead>
-			<tbody>
-			<tr ng-repeat="row in rows">
-				<td ng-repeat="cell in row">
-					{{cell}}
-				</td>
-			</tr>
-			</tbody>
-		</table>
+        <mct-data-table scroll-direction="descending" headers="headers" rows="rows"></mct-data-table>
+        <!--  <table class="tabular">
+            <thead>
+                <tr>
+                    <th ng-repeat="header in headers">
+                        {{header}}
+                    </th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr ng-repeat="row in rows">
+                    <td ng-repeat="cell in row">
+                        {{cell}}
+                    </td>
+                </tr>
+            </tbody>
+        </table> -->
 	</div>
 </div>