From aa43f1a7cb8dad987371456405791f5e3b89ce65 Mon Sep 17 00:00:00 2001
From: Thibault Cohen <thibault.cohen@savoirfairelinux.com>
Date: Wed, 18 Feb 2015 19:41:21 -0500
Subject: [PATCH 1/4] Test html replace

---
 app/components/config/config.json             |  5 +--
 app/components/table/cell_host/cell_host.html |  4 +--
 app/components/table/cell_host/cell_host.js   | 11 ++++++
 app/components/table/table.html               |  3 +-
 app/components/table/table.js                 | 34 +++++++++++++------
 5 files changed, 39 insertions(+), 18 deletions(-)

diff --git a/app/components/config/config.json b/app/components/config/config.json
index d511277..53856b6 100644
--- a/app/components/config/config.json
+++ b/app/components/config/config.json
@@ -9,10 +9,7 @@
                 "Last check"
             ],
             "name": [
-                "host",
-                "service_check",
-                "duration",
-                "last_check"
+                "host"
             ]
         },
         "apiName": "services",
diff --git a/app/components/table/cell_host/cell_host.html b/app/components/table/cell_host/cell_host.html
index a63408f..f19d4b0 100644
--- a/app/components/table/cell_host/cell_host.html
+++ b/app/components/table/cell_host/cell_host.html
@@ -1,3 +1,3 @@
-<span class="data-table__host {{state}}" ng-controller="CellHostCtrl">
+<td class="data-table__{{ cell }} {{entry.state}}">
   <a class="data-table__data" href="#">{{entry.host_name}}</a>
-</span>
+</td>
diff --git a/app/components/table/cell_host/cell_host.js b/app/components/table/cell_host/cell_host.js
index 0497256..ee8fa48 100644
--- a/app/components/table/cell_host/cell_host.js
+++ b/app/components/table/cell_host/cell_host.js
@@ -14,4 +14,15 @@ angular.module('adagios.table.cell_host', ['adagios.table'])
 
     .run(['tableConfig', function (tableConfig) {
         tableConfig.cellToFieldsMap.host = [ 'host_state', 'host_name' ];
+
+        tableConfig.cellToFunctionsMap.host = function(data) {
+            if (data.host_state === 0) {
+                data.state = 'state--ok';
+            } else if (data.host_state === 1) {
+                data.state = 'state--warning';
+            } else {
+                data.state = 'state--error';
+            }
+            return data
+        };
     }]);
diff --git a/app/components/table/table.html b/app/components/table/table.html
index 493421b..c3fcae7 100644
--- a/app/components/table/table.html
+++ b/app/components/table/table.html
@@ -12,8 +12,7 @@
   <tbody class="" ng-repeat="entry in entries">
     <tr>
       <td><input type="checkbox"></td>
-      <td class="data-table__{{ cell }}" adg-cell type="{{cell}}" ng-repeat="cell in cellsName">
-      </td>
+      <td adg-cell type="{{cell}}" ng-repeat="cell in cellsName"> </td >
     </tr>
   </tbody>
 
diff --git a/app/components/table/table.js b/app/components/table/table.js
index 440c14b..79bfce3 100644
--- a/app/components/table/table.js
+++ b/app/components/table/table.js
@@ -14,6 +14,7 @@ angular.module('adagios.table', ['adagios.live',
     .value('tableConfig', { cells: { 'text': [], 'name': [] },
                             apiName: '',
                             filters: {},
+                            cellToFunctionsMap: {},
                             cellToFieldsMap: {} })
 
     .controller('TableCtrl', ['$scope', 'getServices', 'readConfig', 'tableConfig', function ($scope, getServices, readConfig, tableConfig) {
@@ -38,6 +39,11 @@ angular.module('adagios.table', ['adagios.live',
 
         getServices(requestFields, filters, tableConfig.apiName)
             .success(function (data) {
+                angular.forEach(data, function (d) {
+                    angular.forEach($scope.cellsName, function (key, value) {
+                        d = tableConfig.cellToFunctionsMap[key](d)
+                    })
+                })
                 $scope.entries = data;
             });
     }])
@@ -66,17 +72,25 @@ angular.module('adagios.table', ['adagios.live',
         };
     }])
 
-    .directive('adgCell', function () {
+    .directive('adgCell', function ($http, $compile, $templateCache) {
+
         return {
-            restrict: 'A',
-            link: function (scope, element, attrs) {
-                scope.getTemplateUrl = function () {
-                    if (!!attrs.type) {
-                        return 'components/table/cell_' + attrs.type + '/cell_' + attrs.type + '.html';
+            restrict:'A',
+
+            transclude: 'element',
+            compile: function() {
+                    return function postCompile(scope, element, attrs) {
+                            var template = 'components/table/cell_' + attrs.type + '/cell_' + attrs.type + '.html'
+                            var toto = $templateCache.get(template)
+                            $http.get(template)
+                              .success(function(data) {
+                                 $templateCache.put(template, data);
+                                 var titi = $compile(data)(scope)
+                                 console.log(titi)
+                                 element.replaceWith(titi)
+                               });
+                        }
                     }
-                    console.error('<adg-cell> "type" attribute is undefined');
-                };
-            },
-            template: '<div ng-include="getTemplateUrl()"></div>'
+//            template: '<span ></span>'
         };
     });

From 0e92ad2e5d255f24470040d47ad19ee1e3e6f376 Mon Sep 17 00:00:00 2001
From: Thibault Cohen <thibault.cohen@savoirfairelinux.com>
Date: Wed, 18 Feb 2015 19:51:21 -0500
Subject: [PATCH 2/4] Test2 html replace

---
 app/components/config/config.json                      |  5 ++++-
 app/components/table/cell_duration/cell_duration.html  |  2 +-
 app/components/table/cell_host/cell_host.html          |  2 +-
 app/components/table/cell_host/cell_host.js            | 10 ----------
 .../table/cell_last_check/cell_last_check.html         |  2 +-
 .../table/cell_service_check/cell_service_check.html   |  4 ++--
 app/components/table/table.js                          |  9 ---------
 7 files changed, 9 insertions(+), 25 deletions(-)

diff --git a/app/components/config/config.json b/app/components/config/config.json
index 53856b6..d511277 100644
--- a/app/components/config/config.json
+++ b/app/components/config/config.json
@@ -9,7 +9,10 @@
                 "Last check"
             ],
             "name": [
-                "host"
+                "host",
+                "service_check",
+                "duration",
+                "last_check"
             ]
         },
         "apiName": "services",
diff --git a/app/components/table/cell_duration/cell_duration.html b/app/components/table/cell_duration/cell_duration.html
index ad877fa..9e0a6b4 100644
--- a/app/components/table/cell_duration/cell_duration.html
+++ b/app/components/table/cell_duration/cell_duration.html
@@ -1 +1 @@
-<div class="data-table__duration">{{entry.last_state_change | timeElapsed}}</div>
+<td class="data-table__duration">{{entry.last_state_change | timeElapsed}}</td>
diff --git a/app/components/table/cell_host/cell_host.html b/app/components/table/cell_host/cell_host.html
index f19d4b0..9ffffe7 100644
--- a/app/components/table/cell_host/cell_host.html
+++ b/app/components/table/cell_host/cell_host.html
@@ -1,3 +1,3 @@
-<td class="data-table__{{ cell }} {{entry.state}}">
+<td class="data-table__{{ cell }} {{state}}" ng-controller="CellHostCtrl">
   <a class="data-table__data" href="#">{{entry.host_name}}</a>
 </td>
diff --git a/app/components/table/cell_host/cell_host.js b/app/components/table/cell_host/cell_host.js
index ee8fa48..5ec23c2 100644
--- a/app/components/table/cell_host/cell_host.js
+++ b/app/components/table/cell_host/cell_host.js
@@ -15,14 +15,4 @@ angular.module('adagios.table.cell_host', ['adagios.table'])
     .run(['tableConfig', function (tableConfig) {
         tableConfig.cellToFieldsMap.host = [ 'host_state', 'host_name' ];
 
-        tableConfig.cellToFunctionsMap.host = function(data) {
-            if (data.host_state === 0) {
-                data.state = 'state--ok';
-            } else if (data.host_state === 1) {
-                data.state = 'state--warning';
-            } else {
-                data.state = 'state--error';
-            }
-            return data
-        };
     }]);
diff --git a/app/components/table/cell_last_check/cell_last_check.html b/app/components/table/cell_last_check/cell_last_check.html
index 55add3f..5436017 100644
--- a/app/components/table/cell_last_check/cell_last_check.html
+++ b/app/components/table/cell_last_check/cell_last_check.html
@@ -1 +1 @@
-<div class="data-table__lastcheck">{{entry.last_check * 1000 | date: medium}}</div>
+<td class="data-table__lastcheck">{{entry.last_check * 1000 | date: medium}}</td>
diff --git a/app/components/table/cell_service_check/cell_service_check.html b/app/components/table/cell_service_check/cell_service_check.html
index a5f501c..793dc91 100644
--- a/app/components/table/cell_service_check/cell_service_check.html
+++ b/app/components/table/cell_service_check/cell_service_check.html
@@ -1,6 +1,6 @@
-<div class="data-table__service {{state}}" ng-controller="CellServiceCheckCtrl">
+<td class="data-table__service {{state}}" ng-controller="CellServiceCheckCtrl">
   <dl class="data-table__data">
     <dt class="data-table__service__name">{{entry.description}}</dt>
     <dd class="data-table__service__summary">{{entry.plugin_output}}</dd>
   </dl>
-</div>
+</td>
diff --git a/app/components/table/table.js b/app/components/table/table.js
index 79bfce3..4945baa 100644
--- a/app/components/table/table.js
+++ b/app/components/table/table.js
@@ -14,7 +14,6 @@ angular.module('adagios.table', ['adagios.live',
     .value('tableConfig', { cells: { 'text': [], 'name': [] },
                             apiName: '',
                             filters: {},
-                            cellToFunctionsMap: {},
                             cellToFieldsMap: {} })
 
     .controller('TableCtrl', ['$scope', 'getServices', 'readConfig', 'tableConfig', function ($scope, getServices, readConfig, tableConfig) {
@@ -39,11 +38,6 @@ angular.module('adagios.table', ['adagios.live',
 
         getServices(requestFields, filters, tableConfig.apiName)
             .success(function (data) {
-                angular.forEach(data, function (d) {
-                    angular.forEach($scope.cellsName, function (key, value) {
-                        d = tableConfig.cellToFunctionsMap[key](d)
-                    })
-                })
                 $scope.entries = data;
             });
     }])
@@ -77,7 +71,6 @@ angular.module('adagios.table', ['adagios.live',
         return {
             restrict:'A',
 
-            transclude: 'element',
             compile: function() {
                     return function postCompile(scope, element, attrs) {
                             var template = 'components/table/cell_' + attrs.type + '/cell_' + attrs.type + '.html'
@@ -86,11 +79,9 @@ angular.module('adagios.table', ['adagios.live',
                               .success(function(data) {
                                  $templateCache.put(template, data);
                                  var titi = $compile(data)(scope)
-                                 console.log(titi)
                                  element.replaceWith(titi)
                                });
                         }
                     }
-//            template: '<span ></span>'
         };
     });

From 956c3499237bc07cb6bdbe506be8708116375755 Mon Sep 17 00:00:00 2001
From: Thibault Cohen <thibault.cohen@savoirfairelinux.com>
Date: Wed, 18 Feb 2015 19:56:34 -0500
Subject: [PATCH 3/4] Add comments

---
 app/components/table/table.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/app/components/table/table.js b/app/components/table/table.js
index 4945baa..449adcc 100644
--- a/app/components/table/table.js
+++ b/app/components/table/table.js
@@ -74,11 +74,15 @@ angular.module('adagios.table', ['adagios.live',
             compile: function() {
                     return function postCompile(scope, element, attrs) {
                             var template = 'components/table/cell_' + attrs.type + '/cell_' + attrs.type + '.html'
+                            // TODO: Manage a true caching
                             var toto = $templateCache.get(template)
                             $http.get(template)
                               .success(function(data) {
                                  $templateCache.put(template, data);
                                  var titi = $compile(data)(scope)
+                                 // We do this HACK because we are in a "table" element
+                                 // Which accept only td element :(
+                                 // Don't do this anywhere else
                                  element.replaceWith(titi)
                                });
                         }

From b4390253ad3537d8488ee5650411f1ac12180fc3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20Vachon?= <fredvac@gmail.com>
Date: Thu, 19 Feb 2015 13:43:27 -0500
Subject: [PATCH 4/4] Table DOM cleaning

---
 app/components/live/get_services.js           |  2 +-
 .../cell_host_address/cell_host_address.html  |  2 +-
 .../cell_host_status/cell_host_status.html    |  2 +-
 .../cell_hosts_host/cell_hosts_host.html      |  2 +-
 app/components/table/table.html               |  2 +-
 app/components/table/table.js                 | 71 ++++++++++---------
 app/dashboard/dashboard.html                  |  2 +-
 app/hosts/hosts.html                          |  2 +-
 app/services/services.html                    |  2 +-
 9 files changed, 46 insertions(+), 41 deletions(-)

diff --git a/app/components/live/get_services.js b/app/components/live/get_services.js
index 3375a8d..8d4da49 100644
--- a/app/components/live/get_services.js
+++ b/app/components/live/get_services.js
@@ -37,7 +37,7 @@ angular.module('adagios.live')
 
                 return $http.get('/rest/status/json/' + apiName + '/?fields=' + columns + filtersQuery)
                     .error(function (data, status, headers, config) {
-                        console.error('getServices : GET Request failed');
+                        throw new Error('getServices : GET Request failed');
                     });
             };
         }]);
diff --git a/app/components/table/cell_host_address/cell_host_address.html b/app/components/table/cell_host_address/cell_host_address.html
index 6c161f0..6e4bf83 100644
--- a/app/components/table/cell_host_address/cell_host_address.html
+++ b/app/components/table/cell_host_address/cell_host_address.html
@@ -1 +1 @@
-<div ng-controller="CellHostAddressCtrl">{{entry.address}}</div>
+<td ng-controller="CellHostAddressCtrl">{{entry.address}}</td>
diff --git a/app/components/table/cell_host_status/cell_host_status.html b/app/components/table/cell_host_status/cell_host_status.html
index 8da8ea2..a7f2ed4 100644
--- a/app/components/table/cell_host_status/cell_host_status.html
+++ b/app/components/table/cell_host_status/cell_host_status.html
@@ -1 +1 @@
-<div class="{{alert_level}}" ng-controller="CellHostStatusCtrl">{{entry.host_status}}</div>
+<td class="{{alert_level}}" ng-controller="CellHostStatusCtrl">{{entry.host_status}}</td>
diff --git a/app/components/table/cell_hosts_host/cell_hosts_host.html b/app/components/table/cell_hosts_host/cell_hosts_host.html
index c7f91ba..5820cae 100644
--- a/app/components/table/cell_hosts_host/cell_hosts_host.html
+++ b/app/components/table/cell_hosts_host/cell_hosts_host.html
@@ -1 +1 @@
-<div ng-controller="CellHostsHostCtrl">{{entry.name}}</div>
+<td ng-controller="CellHostsHostCtrl">{{entry.name}}</td>
diff --git a/app/components/table/table.html b/app/components/table/table.html
index c3fcae7..136fcbb 100644
--- a/app/components/table/table.html
+++ b/app/components/table/table.html
@@ -12,7 +12,7 @@
   <tbody class="" ng-repeat="entry in entries">
     <tr>
       <td><input type="checkbox"></td>
-      <td adg-cell type="{{cell}}" ng-repeat="cell in cellsName"> </td >
+      <td adg-cell cell-name="{{cell}}" ng-repeat="cell in cellsName"></td>
     </tr>
   </tbody>
 
diff --git a/app/components/table/table.js b/app/components/table/table.js
index 449adcc..32488cd 100644
--- a/app/components/table/table.js
+++ b/app/components/table/table.js
@@ -42,50 +42,55 @@ angular.module('adagios.table', ['adagios.live',
             });
     }])
 
-    .directive('adgTable', ['tableConfig', function (tableConfig) {
+    .directive('adgTable', ['$http', '$compile', 'tableConfig',  function ($http, $compile, tableConfig) {
         return {
             restrict: 'E',
-            link: function (scope, element, attrs) {
-                scope.generateTable = function () {
+            compile: function () {
+                return function (scope, element, attrs) {
 
-                    if (!!attrs.cellsText && !!attrs.cellsName && !!attrs.apiName) {
-                        tableConfig.cells.text = attrs.cellsText.split(',');
-                        tableConfig.cells.name = attrs.cellsName.split(',');
-                        tableConfig.apiName = attrs.apiName;
-
-                        if (!!attrs.filters) {
-                            tableConfig.filters = attrs.filters;
-                        }
-
-                        return 'components/table/table.html';
+                    if (!attrs.cellsText || !attrs.cellsName || !attrs.apiName) {
+                        throw new Error('<adg-table> "cells-text", "cells-name" and "api-name" attributes must be defined');
                     }
-                    console.error('<adg-table> "cells" and "api-name" attributes must be defined');
+
+                    tableConfig.cells.text = attrs.cellsText.split(',');
+                    tableConfig.cells.name = attrs.cellsName.split(',');
+                    tableConfig.apiName = attrs.apiName;
+
+                    if (!!attrs.filters) {
+                        tableConfig.filters = attrs.filters;
+                    }
+
+                    var template = 'components/table/table.html';
+
+                    $http.get(template, { cache: true })
+                        .success(function (data) {
+                            var elem = $compile(data)(scope);
+                            element.append(elem);
+                        });
                 };
-            },
-            template: '<div ng-include="generateTable()"></div>'
+            }
         };
     }])
 
     .directive('adgCell', function ($http, $compile, $templateCache) {
 
         return {
-            restrict:'A',
-
-            compile: function() {
-                    return function postCompile(scope, element, attrs) {
-                            var template = 'components/table/cell_' + attrs.type + '/cell_' + attrs.type + '.html'
-                            // TODO: Manage a true caching
-                            var toto = $templateCache.get(template)
-                            $http.get(template)
-                              .success(function(data) {
-                                 $templateCache.put(template, data);
-                                 var titi = $compile(data)(scope)
-                                 // We do this HACK because we are in a "table" element
-                                 // Which accept only td element :(
-                                 // Don't do this anywhere else
-                                 element.replaceWith(titi)
-                               });
-                        }
+            restrict: 'A',
+            compile: function () {
+                return function (scope, element, attrs) {
+                    if (!attrs.cellName) {
+                        throw new Error('<adg-cell> "cell-name" attribute must be defined');
                     }
+
+                    var template = 'components/table/cell_' + attrs.cellName + '/cell_' + attrs.cellName + '.html';
+
+                    $http.get(template, { cache: true })
+                        .success(function (data) {
+                            var td = $compile(data)(scope);
+                            // HACK : replaceWith is a necessary hack because <tr> only accepts <td> as a child
+                            element.replaceWith(td);
+                        });
+                };
+            }
         };
     });
diff --git a/app/dashboard/dashboard.html b/app/dashboard/dashboard.html
index 01f7165..2727493 100644
--- a/app/dashboard/dashboard.html
+++ b/app/dashboard/dashboard.html
@@ -139,7 +139,7 @@
         <adg-table cells-text="{{dashboardCellsText}}"
                    cells-name="{{dashboardCellsName}}" 
                    api-name="{{dashboardApiName}}" 
-                   filters="{{dashboardFilters}}">
+                   filters="{{dashboardFilters}}"></adg-table>
 
       </div>
     </div>
diff --git a/app/hosts/hosts.html b/app/hosts/hosts.html
index 9ca9bf3..5e38764 100644
--- a/app/hosts/hosts.html
+++ b/app/hosts/hosts.html
@@ -13,7 +13,7 @@
     <adg-table cells-name="{{hostsCellsName}}"
                cells-text="{{hostsCellsText}}"
                api-name="{{hostsApiName}}" 
-               filters="{{hostsFilters}}">
+               filters="{{hostsFilters}}"></adg-table>
 
   </section>
 </article>
diff --git a/app/services/services.html b/app/services/services.html
index c2061f5..6e26f0e 100644
--- a/app/services/services.html
+++ b/app/services/services.html
@@ -13,7 +13,7 @@
     <adg-table cells-name="{{servicesCellsName}}"
                cells-text="{{servicesCellsText}}" 
                api-name="{{servicesApiName}}" 
-               filters="{{servicesFilters}}">
+               filters="{{servicesFilters}}"></adg-table>
 
   </section>
 </article>