diff --git a/pylons_app/templates/summary/summary.html b/pylons_app/templates/summary/summary.html
--- a/pylons_app/templates/summary/summary.html
+++ b/pylons_app/templates/summary/summary.html
@@ -126,7 +126,10 @@ E.onDOMReady(function(e){
     
     <div class="table">
         <div id="commit_history" style="width:560px;height:300px;float:left"></div>
-    	<div id="legend_data" style="clear:both;margin-top:10px">
+        <div style="clear: both;height: 10px"></div>
+        <div id="overview" style="width:560px;height:100px;float:left"></div>
+        
+    	<div id="legend_data" style="clear:both;margin-top:10px;">
 	    	<div id="legend_container"></div>
 	    	<div id="legend_choices">
 				<table id="legend_choices_tables" style="font-size:smaller;color:#545454"></table>
@@ -135,7 +138,9 @@ E.onDOMReady(function(e){
 		<script type="text/javascript">
 		
 		(function () {
-			var datasets = {${c.commit_data|n}};
+			var datasets = ${c.commit_data|n};
+			var overview_data = ${c.overview_data|n};
+						
 			var i = 0;
 		    var choiceContainer = YAHOO.util.Dom.get("legend_choices");
 		    var choiceContainerTable = YAHOO.util.Dom.get("legend_choices_tables");
@@ -147,8 +152,7 @@ E.onDOMReady(function(e){
 		        +datasets[key].label+
 		        '</td></tr>';
 		    };
-		    
-
+			
 		    function plotAccordingToChoices() {
 		        var data = [];
 
@@ -162,23 +166,50 @@ E.onDOMReady(function(e){
 			            else{
 			            	data.push(datasets[key]);
 			            }
-		                
 		            }
-		            
 		        };
 
 		        if (data.length > 0){
+		            var options = { 
+				            bars: {show:true,align:'center',lineWidth:4},
+				            legend: {show:true, container:"legend_container"},
+			    			points: {show:true,radius:0,fill:false},
+			    	        yaxis: {tickDecimals:0,},
+				            xaxis: {mode: "time", 
+					            	timeformat: "%d/%m",
+					            	min:${c.ts_min},
+					            	max:${c.ts_max},
+					            	
+					        }, 
+				            grid: {hoverable: true, 
+					               clickable: true,
+					               autoHighlight:true,
+					               color: "#999"},
+				            selection: {mode: "x"}
+					};
 
-				    var plot = YAHOO.widget.Flot("commit_history", data,
-					        { bars: { show: true, align:'center',lineWidth:4 },
-			    			  points: { show: true, radius:0,fill:true },
-			    			  legend:{show:true, container:"legend_container"},
-			    	          selection: { mode: "xy" },
-			    	          yaxis: {tickDecimals:0},
-				              xaxis: { mode: "time", timeformat: "%d",tickSize:[1, "day"],min:${c.ts_min},max:${c.ts_max} }, 
-				              grid: { hoverable: true, clickable: true,autoHighlight:true },
-					        });
-			        
+					//main plot
+				    var plot = YAHOO.widget.Flot("commit_history",data,options);
+
+					//overview
+				    var overview = YAHOO.widget.Flot("overview", [overview_data], {
+				    	legend:{show:false},
+				        bars: {show:true,
+					           barWidth: 2,
+					    },
+				        shadowSize: 0,
+			            xaxis: {mode: "time", 
+			            		timeformat: "%d/%m/%y",
+			            },
+				        yaxis: {ticks: 3, min: 0,},
+				        grid: {color: "#999",},
+				        selection: {mode: "x"}
+				    });
+
+					var ranges = {"xaxis":{"from":${c.ts_min},
+										   "to":${c.ts_max},},}
+					overview.setSelection(ranges);
+					
 				    function showTooltip(x, y, contents) {
 				        var div=document.getElementById('tooltip');
 				        if(!div) {
@@ -198,9 +229,10 @@ E.onDOMReady(function(e){
 				        var anim = new YAHOO.util.Anim(div, {opacity: {to: 0.8}}, 0.2);
 				        anim.animate();
 				    }
-
+				    
 			        var previousPoint = null;
-			        plot.subscribe("plothover", function (o) {
+
+					function plothover(o) {
 				        var pos = o.pos;
 				        var item = o.item;
 				        
@@ -221,7 +253,7 @@ E.onDOMReady(function(e){
 		                            item.series.label = 'commits';
 			                    }
 		                        var d = new Date(x*1000);
-		                        var fd = d.getFullYear()+'-'+(d.getMonth()+1)+'-'+d.getDate();
+		                        var fd = d.toDateString()
 		                        var nr_commits = parseInt(y);
 		                        
 		                        var cur_data = datasets[item.series.label].data[item.dataIndex];
@@ -256,8 +288,31 @@ E.onDOMReady(function(e){
 					          }
 		                    previousPoint = null;
 		                }
-			        });
+			        }
+			        
+			        plot.subscribe("plothover", plothover);
+			        
+				    function plotselected(ranges) {
+				        // do the zooming
+				        plot = YAHOO.widget.Flot("commit_history", data,
+				                      YAHOO.lang.merge(options, {
+				                          xaxis: { min: ranges.xaxis.from, 
+				                          		   max: ranges.xaxis.to,
+				                          		   mode:"time",
+				                          		   timeformat: "%d/%m",
+				                          		 }
+				                      }));
+				        plot.subscribe("plotselected", plotselected);
+				        plot.subscribe("plothover", plothover);
 
+				        // don't fire event on the overview to prevent eternal loop
+				        overview.setSelection(ranges, true);
+				    }
+				    plot.subscribe("plotselected", plotselected);
+				    
+				    overview.subscribe("plotselected", function (ranges) {
+				        plot.setSelection(ranges);
+				    });
 			    }
 		    }