- GanttEditor:

  - Timeline is there and integrates with main panel
  - Fixed zoom-in/zoom-out

www/controller/gantt/GanttButtonController.js

@@ -37,11 +37,10 @@ Ext.define('PO.controller.gantt.GanttButtonController', {
             '#buttonDelete': { click: { fn: me.ganttTreePanel.onButtonDelete, scope: me.ganttTreePanel }},
             '#buttonReduceIndent': { click: { fn: me.ganttTreePanel.onButtonReduceIndent, scope: me.ganttTreePanel }},
             '#buttonIncreaseIndent': { click: { fn: me.ganttTreePanel.onButtonIncreaseIndent, scope: me.ganttTreePanel }},
-            '#buttonDependencies': { click: this.onButton },
             '#buttonAddDependency': { click: this.onButton },
             '#buttonBreakDependency': { click: this.onButton },
-            '#buttonZoomIn': { click: { fn: me.ganttDrawComponent.onZoomIn, scope: me.ganttDrawComponent }},
-            '#buttonZoomOut': { click: { fn: me.ganttDrawComponent.onZoomOut, scope: me.ganttDrawComponent }},
+            '#buttonZoomIn': { click: this.onZoomIn },
+            '#buttonZoomOut': { click: this.onZoomOut },
             '#buttonSettings': { click: this.onButton },
             scope: me.ganttTreePanel
         });
@@ -64,11 +63,23 @@ Ext.define('PO.controller.gantt.GanttButtonController', {
     },
 
     onButtonLoad: function() {
-        console.log('ButtonLoad');
+        console.log('GanttButtonController.ButtonLoad');
     },
 
     onButtonSave: function() {
-        console.log('ButtonSave');
+        console.log('GanttButtonController.ButtonSave');
+    },
+
+    onZoomIn: function() {
+        console.log('GanttButtonController.onZoomIn');
+	this.ganttDrawComponent.onZoomIn();
+	this.ganttTimeline.onZoomIn();
+    },
+
+    onZoomOut: function() {
+        console.log('GanttButtonController.onZoomOut');
+	this.ganttDrawComponent.onZoomOut();
+	this.ganttTimeline.onZoomOut();
     },
 
     /**
@@ -77,7 +88,8 @@ Ext.define('PO.controller.gantt.GanttButtonController', {
      */
     onTimelineMove: function(dist) {
         // console.log('GanttButtonController.onTimelineMove: dist='+dist);
-        this.ganttDrawComponent.translate(dist * 3);	// Move the DrawComponent multiplied
+	var axisFactor = this.ganttTimeline.axisFactor;
+        this.ganttDrawComponent.translate(dist * axisFactor);	// Move the DrawComponent multiplied
 
 	// ToDo: There are still some break when switching between the surfaces
 	// this.ganttDrawComponent.dndBase[0] = -dist;
@@ -89,7 +101,8 @@ Ext.define('PO.controller.gantt.GanttButtonController', {
      */
     onDrawComponentMove: function(dist) {
         console.log('GanttButtonController.onDrawComponentMove: dist='+dist);
-        this.ganttTimeline.translate(dist / 3.0);	// Move the Timeline by a fraction
+	var axisFactor = this.ganttTimeline.axisFactor;
+        this.ganttTimeline.translate(dist / axisFactor);	// Move the Timeline by a fraction
 
 	// ToDo: There are still some break when switching between the surfaces
 	// this.ganttTimeline.dndBase[0] = -dist;

www/view/gantt/GanttButtonPanel.js

@@ -53,10 +53,6 @@ Ext.define('PO.view.gantt.GanttButtonPanel', {
 	    id: 'buttonIncreaseIndent'
 	}, {
 	    xtype: 'tbseparator'
-	}, {
-	    icon: '/intranet/images/navbar_default/link.png',
-	    tooltip: 'Dependencies',
-	    id: 'buttonDependencies'
 	}, {
 	    icon: '/intranet/images/navbar_default/link_add.png',
 	    tooltip: 'Add dependency',

www/view/gantt/GanttTimeline.js

@@ -70,14 +70,21 @@ Ext.define('PO.view.gantt.GanttTimeline', {
         // Draw the top axis
         me.drawAxis();
 
+	var panelY = me.ganttTreePanel.getY();
+
+
         // Iterate through all children of the root node and check if they are visible
+	var maxDepth = 2;
+	var y = 0;
         rootNode.cascadeBy(function(model) {
+	    if (model.getDepth() > maxDepth) { return; }
+	    if (!model.isVisible()) { return; }
+
             var viewNode = ganttTreeView.getNode(model);
+	    if (viewNode == null) { return; }	                        // hidden nodes/models don't have a viewNode, so we don't need to draw a bar.
 
-            // hidden nodes/models don't have a viewNode, so we don't need to draw a bar.
-            if (viewNode == null) { return; }
-            if (!model.isVisible()) { return; }
-            me.drawBar(model, viewNode);
+	    me.drawBar(model, viewNode, {'y': y});
+	    y = y + me.barHeight + 2;
         });
 
         console.log('PO.class.GanttTimeline.redraw: Finished');
@@ -101,8 +108,9 @@ Ext.define('PO.view.gantt.GanttTimeline', {
     /**
      * Draw a single bar for a project or task
      */
-    drawBar: function(project, viewNode) {
+    drawBar: function(project, viewNode, overrideParams) {
         var me = this;
+	var params = overrideParams || {};
         if (me.debug) { console.log('PO.class.GanttTimeline.drawBar: Starting'); }
         var ganttTreeStore = me.ganttTreePanel.store;
         var ganttTreeView = me.ganttTreePanel.getView();
@@ -124,12 +132,13 @@ Ext.define('PO.view.gantt.GanttTimeline', {
 
         var projectY = ganttTreeView.getNode(project).getBoundingClientRect().top;
         var x = me.date2x(startTime);
-        var y = projectY - panelY;
+        var y = (projectY - panelY) / 6.0;   // smaller bars in preview
         var w = Math.floor( me.ganttWidth * (endTime - startTime) / (me.axisEndTime - me.axisStartTime));
         var h = me.barHeight; 							// Height of the bars
         var d = Math.floor(h / 2.0) + 1;    				// Size of the indent of the super-project bar
 
-	y = y / 6.0;  // smaller bars in preview
+	var overrideY = params.y;
+	if (overrideY != undefined) { y = params.y; }
 
         var spriteBar = surface.add({
             type: 'rect',