Add triangle icons to flip open and close the inline bundle details
and open just the single bundle with details when clicking on the
bundle name

git-svn-id: https://svn.apache.org/repos/asf/felix/trunk@667571 13f79535-47bb-0310-9956-ffa450edef68
diff --git a/webconsole/src/main/resources/res/ui/bundles.js b/webconsole/src/main/resources/res/ui/bundles.js
index 07efab4..35ff677 100644
--- a/webconsole/src/main/resources/res/ui/bundles.js
+++ b/webconsole/src/main/resources/res/ui/bundles.js
@@ -91,8 +91,10 @@
    
 /* String */ function bundleInternal( /* Bundle */ bundle )
 {
+    var icon = (bundle.props) ? "down" : "right";
     var theBundle = "<td class='content right'>" + bundle.bundleId + "</td>";
-    theBundle += "<td class='content'><a href='javascript:showDetails(" + bundle.bundleId + ")'>" + bundle.name + "</a></td>";
+    theBundle += "<td class='content'><img src='" + appRoot + "/res/imgs/" + icon + ".gif' onClick='showDetails(" + bundle.bundleId + ")' id='bundle" + bundle.bundleId + "_inline' />";
+    theBundle += " <a href='" + appRoot + "/bundles/" + bundle.bundleId + "'>" + bundle.name + "</a></td>";
     theBundle += "<td class='content center'>" + bundle.state + "</td>";
 
     // no buttons for system bundle
@@ -202,10 +204,12 @@
         if (span.innerHTML)
         {
             span.innerHTML = '';
+            newLinkValue(bundleId, appRoot + "/res/imgs/right.gif");
         }
         else
         {
-            sendRequest('GET', "bundles/" + bundleId + ".json", displayBundleDetails);
+            sendRequest('GET', appRoot + "/bundles/" + bundleId + ".json", displayBundleDetails);
+            newLinkValue(bundleId, appRoot + "/res/imgs/down.gif");
         }
     }
 }
@@ -220,6 +224,17 @@
 }
 
 
+function newLinkValue(bundleId, newLinkValue)
+{
+    
+    var link = document.getElementById("bundle" + bundleId + "_inline");
+    if (link)
+    {
+        link.src = newLinkValue;
+    }
+}
+
+
 /* String */ function bundleDetails( props )
 {
         var innerHtml = '<td class=\"content\">&nbsp;</td><td class=\"content\" colspan=\"6\"><table broder=\"0\">';