From cc73b3daa70e7db726e0c9b7626830413b5f991e Mon Sep 17 00:00:00 2001
From: Till Breuer <till.breuer@gmx.de>
Date: Wed, 4 Dec 2013 22:51:52 +0100
Subject: [PATCH] Move timelines table header generation to template

---
 .../controllers/timelines_controller.js       |  1 -
 app/assets/javascripts/timelines/ui.js        | 46 +++++--------------
 app/views/timelines/_chart_container.html.erb | 15 +++++-
 3 files changed, 26 insertions(+), 36 deletions(-)

diff --git a/app/assets/javascripts/angular/controllers/timelines_controller.js b/app/assets/javascripts/angular/controllers/timelines_controller.js
index 906051f58d..09afd3a59a 100644
--- a/app/assets/javascripts/angular/controllers/timelines_controller.js
+++ b/app/assets/javascripts/angular/controllers/timelines_controller.js
@@ -47,7 +47,6 @@ timelinesApp.controller('TimelinesController', ['$scope', '$window', 'TimelineSe
     if (outlineLevel !== formerLevel) {
       $scope.timeline.expansionIndex = Timeline.OUTLINE_LEVELS.indexOf(outlineLevel);
       $scope.timeline.expandToOutlineLevel(outlineLevel); // TODO replace event-driven adaption by bindings
-
     }
   });
 
diff --git a/app/assets/javascripts/timelines/ui.js b/app/assets/javascripts/timelines/ui.js
index 63fdb89422..782a4ec185 100644
--- a/app/assets/javascripts/timelines/ui.js
+++ b/app/assets/javascripts/timelines/ui.js
@@ -199,12 +199,15 @@ jQuery.extend(Timeline, {
     this.expandToOutlineLevel(Timeline.OUTLINE_LEVELS[index]);
   },
   expandToOutlineLevel: function(outlineLevel) {
-    var level = Timeline.OUTLINE_CONFIGURATIONS[outlineLevel].level;
-    if (this.options.hide_tree_root) {
-      level++;
+    var currentOutlineConfig = Timeline.OUTLINE_CONFIGURATIONS[outlineLevel];
+    if(currentOutlineConfig) {
+      var level = currentOutlineConfig.level;
+      if (this.options.hide_tree_root) {
+        level++;
+      }
+      level = this.getLefthandTree().expandTo(level);
+      this.rebuildAll();
     }
-    level = this.getLefthandTree().expandTo(level);
-    this.rebuildAll();
   },
   zoom: function(index) {
     if (index === undefined) {
@@ -538,43 +541,18 @@ jQuery.extend(Timeline, {
   rebuildTree: function() {
     var where = this.getUiRoot().find('.tl-left-main');
     var tree = this.getLefthandTree();
-    var table = jQuery('<table class="tl-main-table"></table>');
+
+    var table = jQuery('.tl-main-table');
+
     var body = jQuery('<tbody></tbody>');
-    var head = jQuery('<thead></thead>');
     var row, cell, link, span, text;
     var timeline = this;
     var rows = this.getAvailableRows();
     var first = true; // for the first row
     var previousGroup = -1;
-    var headerHeight = this.decoHeight();
-
-    // head
-    table.append(head);
-    row = jQuery('<tr></tr>');
-
-    // there is always a name.
-    cell = jQuery('<th class="tl-first-column"/>');
-    cell.append(timeline.i18n('timelines.filter.column.name'));
-
-    // only compensate for the chart decorations if we're actualy
-    // showing one.
-    if (timeline.options.hide_chart == null) {
-      cell.css({'height': headerHeight + 'px'});
-    }
-    row.append(cell);
-
-    // everything else.
-    var header = function(key) {
-      var th = jQuery('<th></th>');
-      th.append(timeline.i18n('timelines.filter.column.' + key));
-      return th;
-    };
-    jQuery.each(timeline.options.columns, function(i, e) {
-      row.append(header(e));
-    });
-    head.append(row);
 
     // body
+    where.find('tbody').remove();
     table.append(body);
 
     row = jQuery('<tr></tr>');
diff --git a/app/views/timelines/_chart_container.html.erb b/app/views/timelines/_chart_container.html.erb
index b405983baa..f98d3bf400 100644
--- a/app/views/timelines/_chart_container.html.erb
+++ b/app/views/timelines/_chart_container.html.erb
@@ -1,7 +1,20 @@
  <div ng-class="{timeline: true, 'tl-under-construction': underConstruction}">
   <div class="tl-left">
     <div class="tl-left-top tl-decoration"></div>
-    <div class="tl-left-main"></div>
+    <div class="tl-left-main">
+
+      <table class="tl-main-table" ng-show="!timeline.options.hide_chart">
+        <thead>
+          <tr>
+            <th class="tl-first-column" ng-style="{height: timeline.decoHeight()}">{{timeline.i18n('timelines.filter.column.name')}}</th>
+            <th ng-repeat="key in timeline.options.columns">
+              {{timeline.i18n('timelines.filter.column.' + key)}}
+            </th>
+          </tr>
+        </thead>
+      </table>
+
+    </div>
   </div>
   <div class="tl-right">
     <div class="tl-right-top tl-decoration"></div>