# HG changeset patch # User Augie Fackler # Date 1225056989 0 # Node ID 25665d645fa85ede077d2b17efe00cd906a9ec5a # Parent 93f9ead45dae8080b118971aa08007ddc9c78f40 Add javascript expandable menus. Patch by: Dmitri Gaskin Review by: Augie Fackler diff -r 93f9ead45dae -r 25665d645fa8 app/soc/content/css/soc.css --- 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; } + diff -r 93f9ead45dae -r 25665d645fa8 app/soc/content/images/opentriangle.gif Binary file app/soc/content/images/opentriangle.gif has changed diff -r 93f9ead45dae -r 25665d645fa8 app/soc/content/images/triangle.gif Binary file app/soc/content/images/triangle.gif has changed diff -r 93f9ead45dae -r 25665d645fa8 app/soc/content/js/menu.js --- /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; + }); +}); diff -r 93f9ead45dae -r 25665d645fa8 app/soc/templates/soc/base.html --- 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 %} + + {% block scripts %}{% endblock %} diff -r 93f9ead45dae -r 25665d645fa8 app/soc/views/helper/html_menu.py --- 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%s' % (indent, self._item.name)] # URL supplied, so make an item.name link - return ['%s%s' % (indent, self._item.value, self._item.name)] + return ['%s%s' % (indent, self._item.value, self._item.name)] class LiMenuItem(AHrefMenuItem): """Provides HTML menu item properties as attributes as an
  • list item. @@ -241,6 +241,11 @@ See also AHrefMenuItem.getHtmlTags(). """ - return (['%s
  • ' % indent] + if self._item.sub_menu: + css_class = 'expandable' + else: + css_class = 'leaf' + + return (['%s
  • ' % (indent, css_class)] + AHrefMenuItem.getHtmlTags(self, indent + ' ') + ['%s
    • ' % indent])