--- a/app/soc/content/css/soc.css	Sun Oct 26 21:26:35 2008 +0000
+++ b/app/soc/content/css/soc.css	Sun Oct 26 21:36:29 2008 +0000
@@ -137,37 +137,37 @@
   text-align: left;
 }
 
-  /* FORM TABLE FIELDS */ 
-  td.formfieldrequired {
-    font-style: italic;
-    font-size: small;
-  }
+/* FORM TABLE FIELDS */ 
+td.formfieldrequired {
+  font-style: italic;
+  font-size: small;
+}
 
-  td.formfieldhelptext {
-    font-style: italic;
-    font-size: small;
-  }
+td.formfieldhelptext {
+  font-style: italic;
+  font-size: small;
+}
 
-  td.formfielderror {
-    color: #FF0000;
-    font-size: small;
-  }
+td.formfielderror {
+  color: #FF0000;
+  font-size: small;
+}
 
-  td.formfieldheading {
-    font-weight: bold;
-    font-size: small;
-  }
-  
-  td.formfieldlabel {
-    font-weight: bold;
-    font-size: small;
-  }
-  
-  td.formfielderrorlabel {
-    font-weight: bold;
-    color: #FF0000;
-    font-size: small;
-  }
+td.formfieldheading {
+  font-weight: bold;
+  font-size: small;
+}
+
+td.formfieldlabel {
+  font-weight: bold;
+  font-size: small;
+}
+
+td.formfielderrorlabel {
+  font-weight: bold;
+  color: #FF0000;
+  font-size: small;
+}
 
 /* TABLE QUEUES (used with .list) */
 table#queues {
@@ -175,13 +175,13 @@
   width: 100%;
 }
 
-  table#queues tr {
-    border-bottom: thin solid lightgray;
-  }
+table#queues tr {
+  border-bottom: thin solid lightgray;
+}
 
-  table#queues td {
-    padding: 2px;
-  }  
+table#queues td {
+  padding: 2px;
+}  
 
 /* 
  * PAGE ELEMENTS 
@@ -233,26 +233,26 @@
   padding-bottom: 25px;
 }
 
-  #body .buttons {
-    margin-right: 4px;
-    margin-top: 20px;
-  }
-    
-  #body a.button, input[type^="submit"], input[type^="button"] {
-    margin: 0;
-    padding: 2px 5px 2px 5px;
-    font-family: Arial, Sans-serif;
-    font-size: 12px;
-    text-decoration: none;
-    color: #222;
-    cursor: default;
-    background: #ddd url("/soc/content/images/button-background.gif") repeat-x 0 0;
-    border: 1px solid #aaa;
-  }
+#body .buttons {
+  margin-right: 4px;
+  margin-top: 20px;
+}
+  
+#body a.button, input[type^="submit"], input[type^="button"] {
+  margin: 0;
+  padding: 2px 5px 2px 5px;
+  font-family: Arial, Sans-serif;
+  font-size: 12px;
+  text-decoration: none;
+  color: #222;
+  cursor: default;
+  background: #ddd url("/soc/content/images/button-background.gif") repeat-x 0 0;
+  border: 1px solid #aaa;
+}
 
-  #body a.button:hover, input[type^="submit"]:hover, input[type^="button"]:hover {
-    border-color: #9cf #69e #69e #7af;
-  }
+#body a.button:hover, input[type^="submit"]:hover, input[type^="button"]:hover {
+  border-color: #9cf #69e #69e #7af;
+}
 
 #header {
   height: 50px;
@@ -271,9 +271,9 @@
   background-position: left center;
 }
 
-  #footer .text {
-    padding-top: 20px;
-  }
+#footer .text {
+  padding-top: 20px;
+}
 
 #lastmodified {
   text-align: right;
@@ -306,15 +306,29 @@
   font-size: 95%;
 }
 
-  #menu ul ul {
-    margin-left: 10px;
-    margin-bottom: 0;
-  }
+#menu ul ul {
+  margin-left: 10px;
+  margin-bottom: 0;
+}
 
 #menu li {
   margin-top: 4px;
 }
 
+#menu li.leaf {
+  list-style-type: none;
+  list-style-image: none;
+}
+
+#menu li.expandable {
+  list-style-type: disc;
+  list-style-image: url(../images/opentriangle.gif);
+}
+
+#menu li.closed {
+  list-style-image: url(../images/triangle.gif);
+}
+
 #menu h4 {
   margin: 0;
   padding: 0;
@@ -327,19 +341,19 @@
   margin-top: 2em;
 }
 
-  #search .header {
-    font-weight: bold;
-    font-size: 90%;
-    margin-bottom: 1px;
-  }
+#search .header {
+  font-weight: bold;
+  font-size: 90%;
+  margin-bottom: 1px;
+}
 
-  #search .button {
-    margin-top: 1px;
-  }
+#search .button {
+  margin-top: 1px;
+}
 
-  #search .input input {
-    width: 125px;
-  }
+#search .input input {
+  width: 125px;
+}
 
 /* BLOG FEEDS */
 .blog {
@@ -352,15 +366,15 @@
   background-color: #e5ecf9;
 }
 
-  .blog h2 a {
-    text-decoration: none;
-    color: black;
-  }
+.blog h2 a {
+  text-decoration: none;
+  color: black;
+}
 
-  .blog h2 a:visited {
-    text-decoration: none;
-    color: black;
-  }
+.blog h2 a:visited {
+  text-decoration: none;
+  color: black;
+}
 
 
 .blog .entry {
@@ -389,36 +403,36 @@
   -moz-border-radius: 5px 5px 0px 0px;
 }
 
-  .list .pagination {
-    text-align: right;
-    padding: 3px;
-  }
+.list .pagination {
+  text-align: right;
+  padding: 3px;
+}
+
+.list table{
+  background-color: white;
+}
   
-  .list table{
-    background-color: white;
-  }
-  
-    .list table th {
-      background-color: #eeeeec;
-      border-right: 1px solid lightgray;
-      border-top: 1px solid lightgray;
-    }
+.list table th {
+  background-color: #eeeeec;
+  border-right: 1px solid lightgray;
+  border-top: 1px solid lightgray;
+}
 
-    .list table tr.on {
-      background-color: #ff9;
-    }
+.list table tr.on {
+  background-color: #ff9;
+}
 
-    .list table tr.off {
-      background-color: #fff;
-    }
+.list table tr.off {
+  background-color: #fff;
+}
 
-    .list table td.last {
-      border-right: 1px solid lightgray;
-    }
+.list table td.last {
+  border-right: 1px solid lightgray;
+}
 
-    .list table .first {
-      border-left: 1px solid lightgray;
-    }
+.list table .first {
+  border-left: 1px solid lightgray;
+}
 
 /* 
  * CUSTOM CLASSES 
@@ -455,3 +469,4 @@
   color: gray;
 }
 
+

Binary file app/soc/content/images/opentriangle.gif has changed

Binary file app/soc/content/images/triangle.gif has changed

--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/app/soc/content/js/menu.js	Sun Oct 26 21:36:29 2008 +0000
@@ -0,0 +1,27 @@
+$(function() {
+  var li = $('#side #menu span').parents('li').filter(':has(ul)');
+  li.children('a').dblclick(function() {
+    window.location = $(this).attr('href');
+  }).add(li.children('span')).click(function() {
+    $($(this).parents('li')[0]).toggleClass('closed').children("ul").toggle();
+    return false;
+  });
+});
+$(function() {
+  var li = $('#side #menu span').parents('li').filter(':has(ul)');
+  li.children('a').dblclick(function() {
+    window.location = $(this).attr('href');
+  }).add(li.children('span')).click(function() {
+    $($(this).parents('li')[0]).toggleClass('closed').children("ul").toggle();
+    return false;
+  });
+});
+$(function() {
+  var li = $('#side #menu span').parents('li').filter(':has(ul)');
+  li.children('a').dblclick(function() {
+    window.location = $(this).attr('href');
+  }).add(li.children('span')).click(function() {
+    $($(this).parents('li')[0]).toggleClass('closed').children("ul").toggle();
+    return false;
+  });
+});

--- a/app/soc/templates/soc/base.html	Sun Oct 26 21:26:35 2008 +0000
+++ b/app/soc/templates/soc/base.html	Sun Oct 26 21:36:29 2008 +0000
@@ -27,6 +27,8 @@
       {% endif %}
     {% endblock %}
   </title>
+	<script src="/jquery/jquery-1.2.6.js"></script>
+	<script src="/soc/content/js/menu.js"></script>
 	{% block scripts %}{% endblock %}
  </head>
 

--- a/app/soc/views/helper/html_menu.py	Sun Oct 26 21:26:35 2008 +0000
+++ b/app/soc/views/helper/html_menu.py	Sun Oct 26 21:36:29 2008 +0000
@@ -216,10 +216,10 @@
 
     if not self._item.value:
       # if no URL, then not a link, so just display item.name as text
-      return [self._item.name]
+      return ['%s<span>%s</span>' % (indent, self._item.name)]
   
     # URL supplied, so make an <a href="item.value">item.name</a> link
-    return ['%s<a href="%s">%s</a>' % (indent, self._item.value, self._item.name)]
+    return ['%s<a href="%s"><span>%s</span></a>' % (indent, self._item.value, self._item.name)]
 
 class LiMenuItem(AHrefMenuItem):
   """Provides HTML menu item properties as attributes as an <li> list item.
@@ -241,6 +241,11 @@
     
     See also AHrefMenuItem.getHtmlTags().
     """
-    return (['%s<li>' % indent]
+    if self._item.sub_menu:
+      css_class = 'expandable'
+    else:
+      css_class = 'leaf'
+    
+    return (['%s<li class="%s">' % (indent, css_class)]
             + AHrefMenuItem.getHtmlTags(self, indent + ' ')
             + ['%s</li>' % indent])