Add a menu functionality.

diff --git a/www/menu.json b/www/menu.json
index 1f3dfd9f532cef63aa91b801c05cdb86d034bf7a..134f3a1894706c7585cdf78e72cab9a9f638eb10 100644 (file)
--- a/www/menu.json
+++ b/www/menu.json
@@ -1,21 +1,18 @@
 [
-       { "name" : "Home",
-         "link" : "/",
-         "desc" : "The place where we start." },
-
-       { "name" : "Support",
-         "subs" : [
-               { "name" : "Forum",
-                 "link" : "http://forum.ipfire.org/",
-                 "desc" : "The IPFire Forum." },
-
-               { "name" : "Wiki",
-                 "link" : "http://wiki.ipfire.org/",
-                 "desc" : "Documentation" },
-
-               { "name" : "IRC",
-                 "link" : "/irc",
-                 "desc" : "Get help in a chat" }
-         ]
-       }
+       { "uri"  : "/index",
+         "name" : "Home" },
+       { "uri"  : "/download",
+         "name" : "Downloads" },
+       { "uri"  : "/screenshots",
+         "name" : "Screenshots" },
+       { "uri"  : "http://wiki.ipfire.org/",
+         "name" : { "de" : "Wiki", "en" : "Wiki" }},
+       { "uri"  : "http://forum.ipfire.org/",
+         "name" : "Forum" },
+       { "uri"  : "/development",
+         "name" : { "de" : "Entwicklung", "en" : "Development" }},
+       { "uri"  : "/links",
+         "name" : "Links" },
+       { "uri"  : "/cebit",
+         "name" : "<div style=\"color:#f90;\">CeBIT 2010</div>" }
 ]

diff --git a/www/static/js/jquery.megamenu.js b/www/static/js/jquery.megamenu.js
deleted file mode 100644 (file)
index 2d4ea16..0000000
--- a/www/static/js/jquery.megamenu.js
+++ /dev/null
@@ -1,120 +0,0 @@
-/*jQuery MegaMenu Plugin
- Author: Devadatta Sahoo
- Author URI: http://www.geektantra.com */
-var isIE6 = navigator.userAgent.toLowerCase().indexOf('msie 6') != -1;
-(function($){
-    $.fn.extend({
-        isChildOf: function(filter_string){
-            var parents = $(this).parents().get();
-            for (j = 0; j < parents.length; j++) {
-                if ($(parents[j]).is(filter_string)) 
-                    return true;
-            }
-            return false;
-        }
-    });
-})(jQuery);
-
-jQuery.fn.megamenu = function(ContentClass, Options){
-    var MenuClass = $(this).attr("class").split(" ")[0];
-    var ParentNodeNumber = 0;
-    Options = jQuery.extend({
-        width: "auto",
-        justify: "left"
-    }, Options);
-    $(ContentClass).after('  <div id="MegaMenuContentShadow" style="display: none;"></div><div id="MegaMenuContent" style="display: none;"></div>');
-    $(this).mouseover(function(){
-        var MenuContent = $(this).next(ContentClass).html();
-        ParentNodeNumber = $('.' + MenuClass).index(this);
-        MegaMenuMouseOver(ParentNodeNumber, MenuContent, "click", MenuClass, ContentClass, Options);
-        //setTimeout('MegaMenuMouseOver('+ParentNodeNumber+',"'+escape(MenuContent)+'","hover",\''+MenuClass+'\',\''+ContentClass+'\',\''+Options+'\')', 300);
-    });
-    $(this).click(function(){
-        var MenuContent = $(this).next('.MegaMenuContent').html();
-        ParentNodeNumber = $('.' + MenuClass).index(this);
-        MegaMenuMouseOver(ParentNodeNumber, MenuContent, "click", MenuClass, ContentClass, Options);
-    });
-    $(this).mouseout(function(){
-        MegaMenuMouseOut(ParentNodeNumber, MenuClass, ContentClass);
-    });
-    $(document).bind('click', function(e){
-        var $clicked = $(e.target);
-        if ($clicked.isChildOf('#MegaMenuContent') || $clicked.is('#MegaMenuContent') || $clicked.is('.' + MenuClass)) {
-        }
-        else 
-            MegaMenuMouseOut(ParentNodeNumber, MenuClass, ContentClass);
-    });
-};
-
-function MegaMenuMouseOver(ParentNodeNumber, MenuContent, state, MenuLinkClass, MenuContentClass, Options){
-    var MenuLinkClass = (typeof(MenuLinkClass) == 'undefined') ? ".MegaMenuLink" : MenuLinkClass;
-    var MenuContentClass = (typeof(MenuContentClass) == 'undefined') ? ".MegaMenuContent" : MenuContentClass;
-    
-    //var Options = eval('(' + Options + ')');
-    if (state == "hover") 
-        $('.' + MenuLinkClass).removeClass(MenuLinkClass + 'Active');
-    $('.' + MenuLinkClass).eq(ParentNodeNumber).addClass(MenuLinkClass + 'Active');
-    
-    var selfNode = new Array();
-    selfNode['width'] = $('.' + MenuLinkClass).eq(ParentNodeNumber).width();
-    selfNode['padding-left'] = parseInt($('.' + MenuLinkClass).eq(ParentNodeNumber).css('padding-left').replace(/px/g, ''));
-    selfNode['padding-right'] = parseInt($('.' + MenuLinkClass).eq(ParentNodeNumber).css('padding-right').replace(/px/g, ''));
-    selfNode['border-left-width'] = parseInt($('.' + MenuLinkClass).eq(ParentNodeNumber).css('border-left-width').replace(/px/g, ''));
-    selfNode['border-right-width'] = parseInt($('.' + MenuLinkClass).eq(ParentNodeNumber).css('border-right-width').replace(/px/g, ''));
-    if (isIE6) 
-        selfNode['width'] = selfNode['width'] + 10;
-    
-    if (Options['justify'] == "left") {
-        var LeftPos = $('.' + MenuLinkClass).eq(ParentNodeNumber).parent().position().left;
-        if (Options['width'] == 'auto') 
-            LeftPos = $('.' + MenuLinkClass).eq(ParentNodeNumber).position().left - 10;
-    }
-    else {
-        var RightPos = $('.' + MenuLinkClass).eq(ParentNodeNumber).parent().position().left;
-        if (Options['width'] == 'auto') 
-            RightPos = $(document).width() - 10 - $('.' + MenuLinkClass).eq(ParentNodeNumber).position().left - selfNode['width'] - selfNode['padding-left'] - selfNode['padding-right'] - selfNode['border-left-width'] - selfNode['border-right-width'];
-    }
-    
-    var TopPos = $('.' + MenuLinkClass).eq(ParentNodeNumber).height() + $('.' + MenuLinkClass).eq(ParentNodeNumber).position().top + parseInt($('.' + MenuLinkClass).eq(ParentNodeNumber).css("padding-top").replace(/px/g, '')) + parseInt($('.' + MenuLinkClass).eq(ParentNodeNumber).css("padding-bottom").replace(/px/g, '')) + parseInt($('.' + MenuLinkClass).eq(ParentNodeNumber).css("border-top-width").replace(/px/g, ''));
-    
-    MenuContent = unescape(MenuContent);
-    
-    if (LeftPos) {
-        $("#MegaMenuContent").css('left', LeftPos + 'px');
-        $("#MegaMenuContentShadow").css('left', (LeftPos) + 'px');
-    }
-    else {
-        $("#MegaMenuContent").css('right', RightPos + 'px');
-        $("#MegaMenuContentShadow").css('right', (RightPos - 4) + 'px');
-    }
-    $("#MegaMenuContent").css('top', TopPos + 'px');
-    $("#MegaMenuContentShadow").css('top', TopPos + 'px');
-    if (Options['width']) {
-        $("#MegaMenuContent").css('width', Options['width']);
-        $("#MegaMenuContentShadow").css('width', Options['width']);
-    }
-    $("#MegaMenuContent").html('' + MenuContent);
-    $("#MegaMenuContent").slideDown("fast");
-    $("#MegaMenuContentShadow").html('' + MenuContent);
-    $("#MegaMenuContentShadow").slideDown("fast");
-    
-    $("#MegaMenuContent,#MegaMenuContentShadow").mouseover(function(){
-        $('#MegaMenuContent').show();
-        $('#MegaMenuContentShadow').show();
-        
-        $('.' + MenuLinkClass).removeClass(MenuLinkClass + 'Active');
-        $('.' + MenuLinkClass).eq(ParentNodeNumber).addClass(MenuLinkClass + 'Active');
-    });
-    $("#MegaMenuContent,#MegaMenuContentShadow").mouseout(function(){
-        $("#MegaMenuContent").hide()
-        $("#MegaMenuContentShadow").hide()
-        $('.' + MenuLinkClass).removeClass(MenuLinkClass + 'Active');
-    });
-}
-
-function MegaMenuMouseOut(ParentNodeNumber, MenuLinkClass, MenuContentClass){
-    $('#MegaMenuContent').hide();
-    $('#MegaMenuContentShadow').hide();
-    var MenuLinkClass = (typeof(MenuLinkClass) == 'undefined') ? ".MegaMenuLink" : MenuLinkClass;
-    $('.' + MenuLinkClass).eq(ParentNodeNumber).removeClass(MenuLinkClass + 'Active');
-}

diff --git a/www/templates/modules/menu-item.html b/www/templates/modules/menu-item.html
index 637a456eeb9f9f0bff80463801bdaffd21e50ea5..f3833a2f5ec7dc2760f6206ad056d21af3b8ff40 100644 (file)
--- a/www/templates/modules/menu-item.html
+++ b/www/templates/modules/menu-item.html
@@ -1,65 +1,3 @@
-<a class="MegaMenuLink{% if not item.args.has_key("items") %}Off {% end %}" href="{{ item.link }}">{{ item.name }}</a>
-{% if item.args.has_key("items") %}
-<div class="MegaMenuContent">
-       <table class="MegaMenuTable">
-           <tr>
-               {% for item2 in item.items %}
-               <th>
-                   <div class="MegaMenuHead">
-                       {{ item.uri }}
-                   </div>
-               </th>
-               {% end %}
-               <th>
-                   <div class="MegaMenuHead">
-                       Second Heading
-                   </div>
-               </th>
-               <th>
-                   <div class="MegaMenuHead">
-                       Third Heading
-                   </div>
-               </th>
-           </tr>
-           <tr>
-               <td>
-                   <ul class="MegaMenuLists">
-                       <li>
-                           <a href="#">First Link</a>
-                       </li>
-                       <li>
-                           <a href="#">Second Link</a>
-                       </li>
-                       <li>
-                           <a href="#">Third Link</a>
-                       </li>
-                   </ul>
-               </td>
-               <td>
-                   <ul class="MegaMenuLists">
-                       <li>
-                           <a href="#">Fourth Link</a>
-                       </li>
-                       <li>
-                           <a href="#">Fifth Link</a>
-                       </li>
-                       <li>
-                           <a href="#">Sixth Link</a>
-                       </li>
-                   </ul>
-               </td>
-               <td class="LastCell">
-                   <ul class="MegaMenuLists">
-                       <li>
-                           <a href="#">Seventh Link</a>
-                       </li>
-                       <li>
-                           <a href="#">Seventh Link</a>
-                       </li>
-                   </ul>
-               </td>
-           </tr>
-       </table>
-</div>
-
-{% end %}
+<li>
+       <a href="{{ item.uri }}"{% if item.active %} class="active"{% end %}>{{ item.name }}</a>
+</li>

diff --git a/www/webapp/handlers.py b/www/webapp/handlers.py
index 27c159c026cf870576b17b76f221f36f7783a0f0..0985212031b4ffe046cb830fb3dcc5a088a76a46 100644 (file)
--- a/www/webapp/handlers.py
+++ b/www/webapp/handlers.py
@@ -20,6 +20,7 @@ from releases import releases
 
 import builds
 import cluster
+import menu
 import translations
 #import uriel
 

diff --git a/www/webapp/ui_modules.py b/www/webapp/ui_modules.py
index f881bfebf1aa8de37f7ce68ae4a6d4d783134231..17923eb79d9de84181b0954a9e78605e037b3c43 100644 (file)
--- a/www/webapp/ui_modules.py
+++ b/www/webapp/ui_modules.py
@@ -15,27 +15,20 @@ class UIModule(tornado.web.UIModule):
 
 class MenuItemModule(UIModule):
        def render(self, item):
-               if self.request.uri.endswith(item.link):
+               if self.request.uri.endswith(item.uri):
                        item.active = True
-               
+
+               if not item.uri.startswith("http://"):
+                       item.uri = "/%s%s" % (self.locale.code[:2], item.uri,)
+
                if type(item.name) == type({}):
                        item.name = item.name[self.locale.code[:2]]
-                       
+
                return self.render_string("modules/menu-item.html", item=item)
 
 
 class MenuModule(UIModule):
-       #def javascript_files(self):
-       #       return ["js/jquery.megamenu.js",]
-       #
-       #def embedded_javascript(self):
-       #       return """
-       #               $(document).ready(function(){
-       #                       $(".MegaMenuLink").megamenu(".MegaMenuContent");
-       #               });"""
-
        def render(self, menuclass=None):
-               return "" # XXX
                if not menuclass:
                        menuclass = menu.Menu("menu.json")
                return self.render_string("modules/menu.html", menuitems=menuclass.items)