working on nested view inline expansion

git-svn-id: https://hudson.dev.java.net/svn/hudson/trunk/hudson/main@14053 71c3de6d-444a-0410-be80-ed276b4c234a

core/pom.xml

@@ -231,7 +231,7 @@
     <dependency>
       <groupId>org.kohsuke.stapler</groupId>
       <artifactId>stapler</artifactId>
-      <version>1.91</version>
+      <version>1.92</version>
     </dependency>
     <dependency>
       <groupId>org.jvnet.localizer</groupId>

core/src/main/java/hudson/model/TreeView.java

@@ -2,6 +2,7 @@ package hudson.model;
 
 import hudson.model.Descriptor.FormException;
 import hudson.util.CaseInsensitiveComparator;
+import hudson.Indenter;
 import org.kohsuke.stapler.DataBoundConstructor;
 import org.kohsuke.stapler.StaplerRequest;
 import org.kohsuke.stapler.StaplerResponse;
@@ -45,6 +46,17 @@ public class TreeView extends View implements ViewGroup {
         super(name);
     }
 
+    /**
+     * Returns {@link Indenter} that has the fixed indentation width.
+     * Used for assisting view rendering.
+     */
+    public Indenter createFixedIndenter(String d) {
+        final int depth = Integer.parseInt(d);
+        return new Indenter() {
+            protected int getNestLevel(Job job) { return depth; }
+        };
+    }
+
     /**
      * Returns a read-only view of all {@link Job}s in this view.
      *

core/src/main/resources/hudson/model/TreeView/ajaxRows.jelly

+<!--
+  Used to render the folder content through an AJAX call.
+-->
+<j:jelly xmlns:j="jelly:core" xmlns:st="jelly:stapler" xmlns:d="jelly:define" xmlns:l="/lib/layout" xmlns:t="/lib/hudson" xmlns:f="/lib/form" xmlns:i="jelly:fmt">
+  <l:ajax>
+    <t:setIconSize/>
+    <table><!-- throw away table tag to group rows together -->
+      <j:set var="indenter" value="${it.createFixedIndenter(request.getParameter('depth'))}" />
+      <j:forEach var="v" items="${it.views}">
+        <t:projectViewNested />
+      </j:forEach>
+      <j:forEach var="job" items="${it.items}">
+        <t:projectViewRow />
+      </j:forEach>
+    </table>
+  </l:ajax>
+</j:jelly>
\ No newline at end of file

core/src/main/resources/lib/hudson/projectView.jelly

@@ -37,16 +37,7 @@
         </tr>
 
         <j:forEach var="v" items="${attrs.views}">
-          <tr>
-            <td colspan="2" style="text-align: center">
-              <img src="${imagesURL}/${iconSize}/folder.gif" alt="" />
-            </td>
-            <td colspan="5">
-              <a href="${rootURL}/${v.url}">
-                ${v.viewName}
-              </a>
-            </td>
-          </tr>
+          <t:projectViewNested />
         </j:forEach>
 
         <j:forEach var="job" items="${jobs}">

core/src/main/resources/lib/hudson/projectViewNested.jelly

+<!--
+  Renders the nest view in <projectView />
+-->
+<j:jelly xmlns:j="jelly:core" xmlns:x="jelly:xml" xmlns:st="jelly:stapler" xmlns:d="jelly:define" xmlns:l="/lib/layout"
+         xmlns:t="/lib/hudson" xmlns:f="/lib/form">
+  <tr>
+    <td colspan="2" style="text-align: center">
+      <a href="#">
+        <img src="${imagesURL}/tree/plus.png" state="plus" width="14" height="14" alt="" class="fold-control treeview-fold-control" url="./ajaxRows?depth=1"/>
+        <st:adjunct includes="lib.hudson.projectViewNested" />
+      </a>
+      <img src="${imagesURL}/${iconSize}/folder.gif" style="margin-left:4px" alt="" />
+    </td>
+    <td colspan="5" style="${indenter.getCss(job)}">
+      <a href="${rootURL}/${v.url}">
+        ${v.viewName}
+      </a>
+    </td>
+  </tr>
+</j:jelly>

core/src/main/resources/lib/hudson/projectViewNested.js

+hudsonRules["IMG.treeview-fold-control"] = function(e) {
+  e.onexpanded = function() {
+    var img = this;
+    var tr = findAncestor(this, "TR");
+    var tail = tr.nextSibling;
+
+    img.oncollapsed = function() {
+      while(tr.nextSibling!=tail)
+        tr.nextSibling.remove();
+    };
+
+    new Ajax.Request(
+            this.getAttribute("url"),
+    {
+      method : 'post',
+      onComplete : function(x) {
+        var cont = document.createElement("div");
+        cont.innerHTML = x.responseText;
+        var rows = $A(cont.firstChild.rows);
+        rows.reverse().each(function(r) {
+          YAHOO.util.Dom.insertAfter(r, tr);
+          Behaviour.applySubtree(r);
+        });
+      }
+    });
+  };
+  e = null;
+};

war/resources/scripts/hudson-behavior.js

@@ -437,6 +437,36 @@ var hudsonRules = {
 
     "INPUT.yui-button" : function(e) {
         makeButton(e);
+    },
+
+    // image that shows [+] or [-], with hover effect.
+    // oncollapsed and onexpanded will be called when the button is triggered.
+    "IMG.fold-control" : function(e) {
+        function changeTo(e,img) {
+            var src = e.src;
+            e.src = src.substring(0,src.lastIndexOf('/'))+"/"+e.getAttribute("state")+img;
+        }
+        e.onmouseover = function() {
+            changeTo(this,"-hover.png");
+        };
+        e.onmouseout = function() {
+            changeTo(this,".png");
+        };
+        e.parentNode.onclick = function(event) {
+            var e = this.firstChild;
+            var s = e.getAttribute("state");
+            if(s=="plus") {
+                e.setAttribute("state","minus");
+                if(e.onexpanded)    e.onexpanded();
+            } else {
+                e.setAttribute("state","plus");
+                if(e.oncollapsed)    e.oncollapsed();
+            }
+            changeTo(e,"-hover.png");
+            YAHOO.util.Event.stopEvent(event);
+            return false;
+        };
+        e = null; // memory leak prevention
     }
 };