azkaban-aplcache

diff --git a/src/java/azkaban/webapp/AzkabanWebServer.java b/src/java/azkaban/webapp/AzkabanWebServer.java
index 89ead27..7e93afe 100644
--- a/src/java/azkaban/webapp/AzkabanWebServer.java
+++ b/src/java/azkaban/webapp/AzkabanWebServer.java
@@ -82,7 +82,7 @@ public class AzkabanWebServer {
     private static final String DEFAULT_TIMEZONE_ID = "default.timezone.id";
     //private static final int DEFAULT_PORT_NUMBER = 8081;
     private static final int DEFAULT_SSL_PORT_NUMBER = 8443;
-    private static final int DEFAULT_THREAD_NUMBER = 10;
+    private static final int DEFAULT_THREAD_NUMBER = 20;
     private static final String VELOCITY_DEV_MODE_PARAM = "velocity.dev.mode";
     private static final String USER_MANAGER_CLASS_PARAM = "user.manager.class";
     private static final String PROJECT_MANAGER_CLASS_PARAM = "project.manager.class";

diff --git a/src/java/azkaban/webapp/servlet/ProjectManagerServlet.java b/src/java/azkaban/webapp/servlet/ProjectManagerServlet.java
index 1c964ff..d8d0645 100644
--- a/src/java/azkaban/webapp/servlet/ProjectManagerServlet.java
+++ b/src/java/azkaban/webapp/servlet/ProjectManagerServlet.java
@@ -155,6 +155,7 @@ public class ProjectManagerServlet extends LoginAbstractAzkabanServlet {
 				nodeList.add(nodeObj);
 			}
 			
+			ret.put("flowId", flowId);
 			ret.put("nodes", nodeList);
 		}
 		

diff --git a/src/java/azkaban/webapp/servlet/velocity/projectpage.vm b/src/java/azkaban/webapp/servlet/velocity/projectpage.vm
index 9749363..baa05fd 100644
--- a/src/java/azkaban/webapp/servlet/velocity/projectpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/projectpage.vm
@@ -80,6 +80,15 @@
 							</td>
 						</tr>
 						<tr class="childrow" id="${flow.id}-child" style="display: none;">
+							<td class="expandedFlow">
+								<table class="innerTable">
+									<thead>
+										<tr><th class="tb-name">Jobs</th></tr>
+									</thead>
+									<tbody id="${flow.id}-tbody">
+									</tbody>
+								</table>
+							</td>
 						</tr>
 #end
 #else

diff --git a/src/web/css/azkaban.css b/src/web/css/azkaban.css
index ee429a9..9a47586 100644
--- a/src/web/css/azkaban.css
+++ b/src/web/css/azkaban.css
@@ -179,13 +179,16 @@ tr:hover td {
   background-color: #E1E3E2;
 }
 
+
 .all-jobs .tb-name {
   padding-left: 2.7272727%;
   width: 64.818182%;
+  border-bottom-width: 0;
+  border-bottom-style: none;
 }
 
 .all-jobs .tb-up-date {
-  width: 14.090909%;
+  width: 160px;
 }
 
 .all-jobs .tb-owner {
@@ -536,6 +539,10 @@ tr:hover td {
 	background-position: 0 -16px;
 }
 
+.collapse tr {
+	border-bottom: none;
+}
+
 .expand .state-icon {
 	background-position: -32px -16px;
 }
@@ -550,6 +557,10 @@ tr:hover td {
 	color: #000;
 }
 
+.tb-name a:hover {
+	color: #009FC9;
+}
+
 .azkaban-charts,
 .azkaban-charts td {
 	width: 100%;
@@ -784,6 +795,80 @@ tr:hover td {
 	border-style: none;
 }
 
+/* Style for job display table */
+.childrow td.innerTd {
+	padding: 0px;
+	height: 100px;
+	width: 100%;
+}
+
+/* Style for job display table */
+.childrow {
+	padding: 0px;
+	width: 100%;
+}
+
+.childrow .innerTable {
+	margin-left:auto;
+	margin-right: auto;
+	text-align: center;
+	width: 80%;
+}
+
+.childrow .expandedFlow {
+	border-style: none;
+	background-color: #FFF;
+}
+
+.childrow:hover td {
+	background-color: #FFF;
+}
+
+.childrow .expandedFlow:hover {
+	border-style: none;
+	background-color: #FFF;
+}
+
+.childrow .expandedFlow td{
+	border-style: solid solid none none;
+}
+
+.childrow .innerTable {
+	border-style: none none solid solid;
+	border-width: 1px;
+	border-color: #CDCDCD;
+}
+
+.childrow .innerTable tr {
+}
+
+.childrow .innerTable td {
+	border-style: solid solid none none;
+	border-width: 1px 1px medium medium;
+	border-color: CDCDCD;
+}
+
+.childrow .innerTable a {
+	cursor: pointer;
+}
+
+.childrow .innerTable a:hover {
+	color: #009FC9;
+}
+
+.childrow .innerTable a.dependent {
+	color: #3B8194;
+}
+
+.childrow .innerTable a.dependency {
+	color: #005066;
+}
+
+.childrow .innerJobRow {
+	border-top: none;
+	height: 100px;
+}
+
 /* old styles */
 
 .azkaban-charts .hitarea {

diff --git a/src/web/js/azkaban.project.view.js b/src/web/js/azkaban.project.view.js
index 7168a20..6616e4a 100644
--- a/src/web/js/azkaban.project.view.js
+++ b/src/web/js/azkaban.project.view.js
@@ -46,9 +46,11 @@ azkaban.UploadProjectView= Backbone.View.extend({
 var flowTableView;
 azkaban.FlowTableView= Backbone.View.extend({
   events : {
-    "click .jobfolder": "expandFlowProject"
+    "click .jobfolder": "expandFlowProject",
+    "hover .expandedFlow a": "highlight"
   },
   initialize : function(settings) {
+  	_.bindAll(this, 'createJobListTable');
   },
   expandFlowProject : function(evt) {
     var target = evt.currentTarget;
@@ -56,6 +58,9 @@ azkaban.FlowTableView= Backbone.View.extend({
     var requestURL = contextURL + "/manager";
 
     var targetExpanded = $('#' + targetId + '-child');
+    var targetTBody = $('#' + targetId + '-tbody');
+    
+    var createJobListFunction = this.createJobListTable;
     
     if (target.loading) {
     	console.log("Still loading.");
@@ -63,17 +68,18 @@ azkaban.FlowTableView= Backbone.View.extend({
     else if (target.loaded) {
     	if($(targetExpanded).is(':visible')) {
     		$(target).addClass('expand').removeClass('collapse');
-    		$(targetExpanded).slideUp("fast");
+    		$(targetExpanded).fadeOut("fast");
     	}
     	else {
     	    $(target).addClass('collapse').removeClass('expand');
-    		$(targetExpanded).slideDown("fast");
+    		$(targetExpanded).fadeIn();
     	}
     }
     else {
 	    // projectId is available
 	    $(target).addClass('wait').removeClass('collapse').removeClass('expand');
 	    target.loading = true;
+	    
 	    $.get(
 	      requestURL,
 	      {"project": projectId, "json":"expandflow", "flow":targetId},
@@ -81,13 +87,64 @@ azkaban.FlowTableView= Backbone.View.extend({
 	        console.log("Success");
 	        target.loaded = true;
 	        target.loading = false;
+	        
+	        createJobListFunction(data, targetTBody);
+	        
 			$(target).addClass('collapse').removeClass('wait');
-	    	$(targetExpanded).slideDown("fast");
+	    	$(targetExpanded).fadeIn("fast");
 	      },
 	      "json"
 	    );
     }
   },
+  createJobListTable : function(data, innerTable) {
+  	var nodes = data.nodes;
+  	var flowId = data.flowId;
+  	
+  	for (var i = 0; i < nodes.length; i++) {
+		var job = nodes[i];
+		var name = job.id;
+		var level = job.level;
+		var nodeId = flowId + "-" + name;
+		
+		var tr = document.createElement("tr");
+		var idtd = document.createElement("td");
+		$(idtd).addClass("tb-name");
+		
+		var ida = document.createElement("a");
+		ida.dependents = job.dependents;
+		ida.dependencies = job.dependencies;
+		ida.flowid = flowId;
+		$(ida).text(name);
+		$(ida).attr("id", nodeId);
+		$(ida).css("margin-left", level * 20);
+		
+		$(idtd).append(ida);
+		$(tr).append(idtd);
+		$(innerTable).append(tr);
+  	}
+  },
+  highlight: function(evt) {
+ 	var currentTarget = evt.currentTarget;
+ 	var dependents = currentTarget.dependents;
+ 	var dependencies = currentTarget.dependencies;
+ 	var flowid = currentTarget.flowid;
+ 	
+ 	if (dependents) {
+	 	for (var i = 0; i < dependents.length; ++i) {
+	 		var depId = flowid + "-" + dependents[i];
+	 		$("#"+depId).toggleClass("dependent");
+	 	}
+ 	}
+ 	
+ 	if (dependencies) {
+	 	for (var i = 0; i < dependencies.length; ++i) {
+	 		var depId = flowid + "-" + dependencies[i];
+	 		$("#"+depId).toggleClass("dependency");
+	 	}
+
+ 	}
+  },
   render: function() {
   }
 });