HTML Menü: Javascript ausgelagert in eigene Datei
authorSven Schöling <s.schoeling@linet-services.de>
Tue, 13 Feb 2018 13:03:45 +0000 (14:03 +0100)
committerSven Schöling <s.schoeling@linet-services.de>
Tue, 13 Feb 2018 13:03:45 +0000 (14:03 +0100)
SL/Layout/MenuLeft.pm
js/kivi.LeftMenu.js [new file with mode: 0644]
templates/webpages/menu/menu.html [deleted file]

index 25119fe..d365210 100644 (file)
@@ -3,25 +3,22 @@ package SL::Layout::MenuLeft;
 use strict;
 use parent qw(SL::Layout::Base);
 
-use URI;
-
 use List::MoreUtils qw(apply);
+use SL::JSON qw(to_json);
+use URI;
 
 sub stylesheets {
   qw(icons16.css icons24.css menu.css)
 }
 
 sub javascripts_inline {
-  my $self = shift;
-  my $sections = [ section_menu($self->menu) ];
-  $self->presenter->render('menu/menu',
-    sections  => $sections,
-  )
+  "\$(function(){kivi.LeftMenu.init(@{[ to_json([ section_menu($_[0]->menu) ]) ]})});"
 }
 
 sub javascripts {
   qw(
     js/jquery.cookie.js
+    js/kivi.LeftMenu.js
   );
 }
 
diff --git a/js/kivi.LeftMenu.js b/js/kivi.LeftMenu.js
new file mode 100644 (file)
index 0000000..537974e
--- /dev/null
@@ -0,0 +1,22 @@
+namespace('kivi.LeftMenu', function(ns) {
+  'use strict';
+  ns.init = function(sections) {
+    sections.forEach(function(b,i){
+      var a=$('<a class="ml">').append($('<span class="mii ms">').append($('<div>').addClass(b[3])),$('<span class="mic">').append(b[0]));
+      if(b[5])a.attr('href', b[5]);
+      if(b[6])a.attr('target', b[6]);
+      $('#html-menu').append($('<div class="mi">').addClass(b[4]).addClass(b[1]).attr('id','mi'+b[2]).append(a))
+    });
+    $('#html-menu div.i, #html-menu div.sm').not('[id^='+$.cookie('html-menu-selection')+'_]').hide();
+    $('#html-menu div.m#'+$.cookie('html-menu-selection')).addClass('menu-open');
+    $('#html-menu div.m').each(function(){
+      $(this).click(function(){
+        $.cookie('html-menu-selection',$(this).attr('id'));
+        $('#html-menu div.mi').not('div.m').not('[id^='+$(this).attr('id')+'_]').hide();
+        $('#html-menu div.mi[id^='+$(this).attr('id')+'_]').toggle();
+        $('#html-menu div.m').not('[id^='+$(this).attr('id')+']').removeClass('menu-open');
+        $(this).toggleClass('menu-open');
+      });
+    });
+  };
+});
diff --git a/templates/webpages/menu/menu.html b/templates/webpages/menu/menu.html
deleted file mode 100644 (file)
index b375742..0000000
+++ /dev/null
@@ -1,20 +0,0 @@
-[%- USE JSON %]
-$(function(){$([% JSON.json(sections) %]).each(function(i,b){
-  var a=$('<a class="ml">').append($('<span class="mii ms">').append($('<div>').addClass(b[3])),$('<span class="mic">').append(b[0]));
-  if(b[5])a.attr('href', b[5]);
-  if(b[6])a.attr('target', b[6]);
-  $('#html-menu').append($('<div class="mi">').addClass(b[4]).addClass(b[1]).attr('id','mi'+b[2]).append(a))
-});
-$('#html-menu div.i, #html-menu div.sm').not('[id^='+$.cookie('html-menu-selection')+'_]').hide();
-$('#html-menu div.m#'+$.cookie('html-menu-selection')).addClass('menu-open');
-$('#html-menu div.m').each(function(){
-  $(this)
-    .click(function(){
-      $.cookie('html-menu-selection',$(this).attr('id'));
-      $('#html-menu div.mi').not('div.m').not('[id^='+$(this).attr('id')+'_]').hide();
-      $('#html-menu div.mi[id^='+$(this).attr('id')+'_]').toggle();
-      $('#html-menu div.m').not('[id^='+$(this).attr('id')+']').removeClass('menu-open');
-      $(this).toggleClass('menu-open');
-    })
-})
-})