From: Sven Schöling <s.schoeling@linet-services.de>
Date: Tue, 4 Sep 2012 17:26:44 +0000 (+0200)
Subject: menu.pl aufgeräumt
X-Git-Tag: release-3.0.0beta1~201
X-Git-Url: http://wagnertech.de/git?a=commitdiff_plain;h=5d73281e30765270c223514e67556c6c4bcf0504;p=kivitendo-erp.git

menu.pl aufgeräumt

request ist jetzt auf netto 20ms zum herstellen des menüs und nochmal ein 30ms
zum rendern. bei letzterem hoffe ich dass das beim einbinden in ein template
beschleunigt wird.
---

diff --git a/bin/mozilla/menu.pl b/bin/mozilla/menu.pl
index fd66bfac0..459ccddc9 100644
--- a/bin/mozilla/menu.pl
+++ b/bin/mozilla/menu.pl
@@ -44,8 +44,6 @@ use URI;
 
 use List::MoreUtils qw(apply);
 
-my $nbsp     = '&nbsp;';
-
 # end of main
 
 sub display {
@@ -83,7 +81,7 @@ sub acc_menu {
   $::form->{title} = $::locale->text('kivitendo');
   $::form->header;
 
-  my $sections = section_menu($menu);
+  my $sections = [ section_menu($menu) ];
 
   print $::form->parse_html_template('menu/menu', {
     framesize => $framesize,
@@ -95,15 +93,17 @@ sub acc_menu {
 
 sub section_menu {
   $::lxdebug->enter_sub;
-  my ($menu, $level) = @_;
+  my ($menu, $level, $id_prefix) = @_;
   my @menuorder = $menu->access_control(\%::myconfig, $level);
   my @items;
 
+  my $id = 0;
+
   for my $item (@menuorder) {
     my $menuitem   = $menu->{$item};
     my $label      = apply { s/.*--// } $item;
     my $ml         = apply { s/--.*// } $item;
-    my $spacer     = "spacer" . (0 + $item =~ s/--/--/g);
+    my $spacer     = "s" . (0 + $item =~ s/--/--/g);
     my $label_icon = $level . "--" . $label . ".png";
 
     next if $level && $item ne "$level--$label";
@@ -126,68 +126,40 @@ sub section_menu {
 
     my $anchor = $menuitem->{href};
 
+    my %common_args = (
+        label   => $label,
+        spacer  => $spacer,
+        target  => $menuitem->{target},
+        item_id => "$id_prefix\_$id",
+        height  => 16,
+    );
+
     if (!$level) { # toplevel
-      push @items, make_item(
+      push @items, { %common_args,
         img      =>  make_image(icon => $item . '.png', size => 24, label => $label),
-        label    => $label,
         height   => 24,
-        class    => 'menu',
-        spacer   => $spacer,
-        subitems => section_menu($menu, $item)
-      );
+        class    => 'm',
+      };
+      push @items, section_menu($menu, $item, "$id_prefix\_$id");
     } elsif ($menuitem->{submenu}) {
-      push @items, make_item(
-        target   => $menuitem->{target},
-        spacer   => $spacer,
+      push @items, { %common_args,
         img      => make_image(submenu => 1),
-        label    => $label,
-        class    => 'submenu',
-        subitems => section_menu($menu, $item),
-      );
+        class    => 'sm',
+      };
+      push @items, section_menu($menu, $item, "$id_prefix\_$id");
     } elsif ($menuitem->{module}) {
-      push @items, make_item(
-        target => $menuitem->{target},
-        img    => make_image(label => $label, icon => $label_icon),
-        href   => $anchor,
-        spacer => $spacer,
-        label  => $label,
-        class  => 'item',
-      );
+      push @items, { %common_args,
+        img     => make_image(label => $label, icon => $label_icon),
+        href    => $anchor,
+        class   => 'i',
+      };
     }
+  } continue {
+    $id++;
   }
-  $::lxdebug->leave_sub;
-  return \@items;
-}
-
-sub make_item {
-  my %params = @_;
-  $params{spacer} ||= '';
-  $params{height} ||= 16;
 
-  return {
-    %params,
-#    chunks => [ multiline($params{label}) ],
-  };
-}
-
-# multi line hack, sschoeling jul06
-# if a label is too long, try to split it at whitespaces, then join it to chunks of less
-# than 20 chars and store it in an array.
-# use this array later instead of the &nbsp;-ed label
-sub multiline {
-  my ($label) = @_;
-  my @chunks;
-  my $l = 20;
-  for (split / /, $label) {
-    $l += length $_;
-    if ($l < 20) {
-      $chunks[-1] .= " $_";
-    } else {
-      $l = length $_;
-      push @chunks, $_;
-    }
-  }
-  return @chunks;
+  $::lxdebug->leave_sub;
+  return @items;
 }
 
 sub make_image {
@@ -199,9 +171,6 @@ sub make_image {
   return unless _show_images();
 
   my $icon_found = $icon && -f _icon_path($icon, $size);
-  my $padding    = $size == 16 && $icon_found ? $nbsp x 2
-                 : $size == 24                ? $nbsp
-                 :                            '';
 
   return  {
     src     => $icon_found ? _icon_path($icon, $size) : "image/unterpunkt.png",
diff --git a/css/lx-office-erp/menu.css b/css/lx-office-erp/menu.css
index 413e36f6c..90cc0c813 100644
--- a/css/lx-office-erp/menu.css
+++ b/css/lx-office-erp/menu.css
@@ -290,22 +290,26 @@ div#menuv4 li li li li:hover ul
 
 /* End of non-anchor hover selectors */
 
-
+/* html menu */
+/* types of lines: m sm i (menu submenu item)
+   each line is a mi (menuitem) and has one mii (menu-item-icon) whcih is ms (menu-spacer)
+   and one mic (menu-item-chunk)
+   indenting is done with the levels s0, s1, s2 */
 #html-menu { float:left; width: 183px; }
-#html-menu div.mi { margin-top: 4px; margin-bottom: 3px; white-space: nowrap; clear:both }
-#html-menu div.submenu { font-weight: bold }
+#html-menu div.mi { margin-top: 4px; margin-bottom: 3px; white-space: nowrap; clear:both; position:relative; }
+#html-menu div.sm { font-weight: bold }
 #html-menu img { vertical-align: top; border: 0; }
 #html-menu a { vertical-align: top }
-#html-menu .item span.ms { float:left; width: 24px }
-#html-menu .menu span.ms { float:left; width: 32px }
-#html-menu div.menu { height: 24px }
-#html-menu div.menu span.mic { color:blue; position: relative; top: 5px; }
-#html-menu div.menu:hover,
-#html-menu div.item:hover { color:blue; background-color: lemonchiffon; cursor: pointer; }
+#html-menu .i span.ms { float:left; width: 24px }
+#html-menu .m span.ms { float:left; width: 32px }
+#html-menu div.m { height: 24px }
+#html-menu div.m span.mic { color:blue; position: relative; top: 5px; }
+#html-menu div.m:hover,
+#html-menu div.i:hover { color:blue; background-color: lemonchiffon; cursor: pointer; }
 #html-menu span.mic { white-space: normal; display: inline-block; vertical-align: top; line-height: 1.2; }
 #html-menu a.ml span.mic { width: 145px } /* fix deep indents */
-#html-menu div.spacer0 { position:relative; padding-left: 2px }
-#html-menu div.spacer1 { position:relative; padding-left: 8px }
-#html-menu div.spacer2 { position:relative; padding-left: 16px }
+#html-menu div.s0 { padding-left: 2px }
+#html-menu div.s1 { padding-left: 8px }
+#html-menu div.s2 { padding-left: 16px }
 
 
diff --git a/templates/webpages/menu/menu.html b/templates/webpages/menu/menu.html
index fcc032cab..01e2bb454 100644
--- a/templates/webpages/menu/menu.html
+++ b/templates/webpages/menu/menu.html
@@ -2,14 +2,19 @@
 <body class="menu">
 
 <div id='html-menu'>
-  [% PROCESS sections %]
+[%- FOREACH item IN sections %]
+ <div id='mi[% item.item_id %]' class='mi [% item.spacer %] [% item.class %]'>[%- IF item.href %]
+  <a href="[% item.href | html %]" class='ml' target='[% item.target %]'><span class="mii ms">[% L.img_tag(item.img) %]</span><span class='mic'>[% item.label %]</span></a>[%- ELSE %]
+  <span class="mii ms">[% L.img_tag(item.img) %]</span><span class='mic'>[% item.label %]</span>[%- END %]
+ </div>
+[%- END %]
 </div>
 <script type='text/javascript'>
   $(function(){
-    $('#html-menu div.item, #html-menu div.submenu').hide();
-    $('#html-menu div.menu').each(function() {
+    $('#html-menu div.i, #html-menu div.sm').hide();
+    $('#html-menu div.m').each(function() {
       $(this).click(function(){
-        $('#html-menu div.mi').not('div.menu').not('[id^=' + $(this).attr('id') + '_]').hide();
+        $('#html-menu div.mi').not('div.m').not('[id^=' + $(this).attr('id') + '_]').hide();
         $('#html-menu div.mi[id^=' + $(this).attr('id') + '_]').toggle();
       });
     });
@@ -17,17 +22,3 @@
 </script>
 </body>
 </html>
-[%- BLOCK sections %]
-[%- FOREACH item IN sections %]
- <div id='mi[% menulevel %]_[% loop.count %]' class='mi [% item.spacer %] [% item.class %]'>
- [%- IF item.href %]
-  <a href="[% item.href | html %]" class='ml' target='[% item.target %]'><span class="mii ms">[% L.img_tag(item.img) %]</span><span class='mic'>[% item.label %]</span></a>
- [%- ELSE %]
-  <span class="mii ms">[% L.img_tag(item.img) %]</span><span class='mic'>[% item.label %]</span>
- [%- END %]
- </div>
- [%- IF item.subitems.size %]
-  [% INCLUDE sections sections=item.subitems, menulevel= menulevel _ '_' _ loop.count %]
- [%- END %]
-[%- END %]
-[%- END  %]