luci-theme-openwrt: rework menu rendering
[project/luci.git] / themes / luci-theme-openwrt / luasrc / view / themes / openwrt.org / header.htm
index e77f9a4bfee1bb382a7b075cd4fa0f6f8c173e5a..376aee99cbbffe5892280fe614f0ce030d90598f 100644 (file)
        local loadinfo = sysinfo.load or { 0, 0, 0 }
        local boardinfo = util.ubus("system", "board") or { }
 
-       local request  = disp.context.path
-       local request2 = disp.context.request
-
-       local category = request[1]
-       local cattree  = category and disp.node(category)
-
-       local leaf = request2[#request2]
-
-       local tree = disp.node()
        local node = disp.context.dispatched
 
-       local categories = disp.node_childs(tree)
-
-       local c = tree
-       local i, r
-
-       -- tag all nodes leading to this page
-       for i, r in ipairs(request) do
-               if c.nodes and c.nodes[r] then
-                       c = c.nodes[r]
-                       c._menu_selected = true
-               end
-       end
-
        http.prepare_content("application/xhtml+xml")
-
-       local function nodeurl(prefix, name, query)
-               local u = url(prefix, name)
-               if query then
-                       u = u .. http.build_querystring(query)
-               end
-               return pcdata(u)
-       end
-
-       local function render_menu(prefix, node, level)
-               if not level then
-                       level = 1
-               end
-
-               local childs = disp.node_childs(node)
-               if #childs > 0 then
-                       write('<ul class="mainmenu l%d">' % level)
-
-                       local i, v
-                       for i, v in ipairs(childs) do
-                               local nnode = node.nodes[v]
-
-                               write('<li class="mainmenu-item-%s %s"><a href="%s">%s</a>' %{
-                                       v, (nnode._menu_selected or (node.leaf and v == leaf)) and 'selected' or '',
-                                       nodeurl(prefix, v, nnode.query),
-                                       striptags(translate(nnode.title))
-                               })
-
-                               if level < 2 then
-                                       render_menu(prefix .. "/" .. v, nnode, level + 1)
-                               end
-
-                               write('</li>')
-                       end
-
-                       write('</ul>')
-               end
-       end
-
-       local function render_tabmenu(prefix, node, level)
-               if not level then
-                       level = 1
-               end
-
-               local childs = disp.node_childs(node)
-               if #childs > 0 then
-                       if level > 2 then
-                               if level == 3 then
-                                       write('<div id="tabmenu">')
-                               end
-                               write('<ul class="cbi-tabmenu">')
-                       end
-
-                       local selected_node
-                       local selected_name
-                       local i, v
-
-                       for i, v in ipairs(childs) do
-                               local nnode = node.nodes[v]
-                               if nnode._menu_selected then
-                                       selected_node = nnode
-                                       selected_name = v
-                               end
-
-                               if level > 2 then
-                                       write('<li class="tabmenu-item-%s %s"><a href="%s">%s</a></li>' %{
-                                               v, (nnode._menu_selected or (node.leaf and v == leaf)) and 'cbi-tab' or '',
-                                               nodeurl(prefix, v, nnode.query),
-                                               striptags(translate(nnode.title))
-                                       })
-                               end
-                       end
-
-                       if level > 2 then
-                               write('</ul>')
-                               if level == 3 then
-                                       write('</div>')
-                               end
-                       end
-
-                       if selected_node then
-                               render_tabmenu(prefix .. "/" .. selected_name, selected_node, level + 1)
-                       end
-               end
-       end
-
-       local function render_changes()
-               if tree.nodes[category] and tree.nodes[category].ucidata then
-                       local ucic = 0
-                       for i, j in pairs(require("luci.model.uci").cursor():changes()) do
-                               for k, l in pairs(j) do
-                                       for m, n in pairs(l) do
-                                               ucic = ucic + 1;
-                                       end
-                               end
-                       end
-
-                       if ucic > 0 then
-                               write('<div id="savemenu" class="uci_change_indicator"><a class="warning" href="%s?redir=%s">%s: %d</a></div>' %{
-                                       url(category, 'uci/changes'),
-                                       http.urlencode(http.formvalue('redir') or table.concat(disp.context.request, "/")),
-                                       translate('Unsaved Changes'),
-                                       ucic
-                               })
-                       end
-               end
-       end
 -%>
 
 <?xml version="1.0" encoding="utf-8"?>
 <%= css %>
 </style>
 <% end -%>
+<script type="text/javascript" src="<%=url('admin/translations', luci.i18n.context.lang)%><%# ?v=PKG_VERSION %>"></script>
 <script type="text/javascript" src="<%=resource%>/cbi.js"></script>
-<script type="text/javascript" src="<%=resource%>/xhr.js"></script>
-<script type="text/javascript">//<![CDATA[
-       document.addEventListener('DOMContentLoaded', function() {
-               var event = ('ontouchstart' in window) ? 'touchstart' : 'click';
-
-               document.querySelectorAll('ul.mainmenu.l1 > li > a').forEach(function(a) {
-                       a.addEventListener(event, function(ev) {
-                               var a = ev.target, ul1 = a.parentNode.parentNode, ul2 = a.nextElementSibling;
-
-                               document.querySelectorAll('ul.mainmenu.l1 > li.active').forEach(function(li) {
-                                       if (li !== a.parentNode)
-                                               li.classList.remove('active');
-                               });
-
-                               if (!ul2)
-                                       return;
-
-                               if (ul2.parentNode.offsetLeft + ul2.offsetWidth <= ul1.offsetLeft + ul1.offsetWidth)
-                                       ul2.classList.add('align-left');
-
-                               ul1.classList.add('active');
-                               a.parentNode.classList.add('active');
-                               a.blur();
-
-                               ev.preventDefault();
-                               ev.stopPropagation();
-                       });
-               });
-
-               document.addEventListener(event, function(ev) {
-                       var t = ev.target;
-
-                       while (t && t.id != 'mainmenu')
-                               t = t.parentNode;
 
-                       if (!t)
-                               document.querySelectorAll('ul.mainmenu > li.active').forEach(function(li) {
-                                       li.classList.remove('active');
-                               });
-               });
-       });
-//]]></script>
 <title><%=striptags( (boardinfo.hostname or "?") .. ( (node and node.title) and ' - ' .. translate(node.title) or '')) %> - LuCI</title>
 </head>
-<body class="lang_<%=luci.i18n.context.lang%>">
+<body class="lang_<%=luci.i18n.context.lang%>" data-page="<%= pcdata(table.concat(disp.context.requestpath, "-")) %>">
 
 <p class="skiplink">
 <span id="skiplink1"><a href="#navigation"><%:Skip to navigation%></a></span>
 <div class="hostinfo">
        <%=(boardinfo.hostname or "?")%> | <%=ver.distversion%> |
        <%:Load%>: <%="%.2f" % (loadinfo[1] / 65535.0)%> <%="%.2f" % (loadinfo[2] / 65535.0)%> <%="%.2f" % (loadinfo[3] / 65535.0)%>
-       <span id="xhr_poll_status" style="display:none" onclick="XHR.running() ? XHR.halt() : XHR.run()">
-               | <%:Auto Refresh%>:
-               <span id="xhr_poll_status_on"><%:on%></span>
-               <span id="xhr_poll_status_off" style="display:none"><%:off%></span>
-       </span>
 </div>
 
-<% if #categories > 1 then %>
-       <ul id="modemenu">
-               <% for i, r in ipairs(categories) do %>
-                       <li><a<% if request[1] == r then %> class="active"<%end%> href="<%=controller%>/<%=r%>/"><%=striptags(translate(tree.nodes[r].title))%></a></li>
-               <% end %>
-       </ul>
-<% end %>
+<div id="indicators"></div>
 
-<% render_changes() %>
+<ul id="modemenu" style="display:none"></ul>
 
 <div class="clear"></div>
 </div>
 
 <div id="maincontainer">
-       <div id="mainmenu">
-               <% if category then render_menu(category, cattree) end %>
-       </div>
+       <div id="mainmenu" style="display:none"></div>
 
        <div id="maincontent">
-               <% if category then render_tabmenu(category, cattree) end %>
+               <div id="tabmenu" style="display:none"></div>
 
                <noscript>
                        <div class="alert-message warning">
                <div class="alert-message warning">
                        <h4><%:No password set!%></h4>
                        <p><%:There is no password set on this router. Please configure a root password to protect the web interface and enable SSH.%></p>
-                       <div class="right"><a class="btn" href="<%=url("admin/system/admin")%>"><%:Go to password configuration...%></a></div>
+                       <% if disp.lookup("admin/system/admin") then %>
+                               <div class="right"><a class="btn" href="<%=url("admin/system/admin")%>"><%:Go to password configuration...%></a></div>
+                       <% end %>
                </div>
                <%- end -%>