Revision 15eda163
Von Sven Schöling vor fast 7 Jahren hinzugefügt
| SL/Layout/MenuLeft.pm | ||
|---|---|---|
| 3 | 3 |
use strict; |
| 4 | 4 |
use parent qw(SL::Layout::Base); |
| 5 | 5 |
|
| 6 |
use URI; |
|
| 7 |
|
|
| 8 | 6 |
use List::MoreUtils qw(apply); |
| 7 |
use SL::JSON qw(to_json); |
|
| 8 |
use URI; |
|
| 9 | 9 |
|
| 10 | 10 |
sub stylesheets {
|
| 11 | 11 |
qw(icons16.css icons24.css menu.css) |
| 12 | 12 |
} |
| 13 | 13 |
|
| 14 | 14 |
sub javascripts_inline {
|
| 15 |
my $self = shift; |
|
| 16 |
my $sections = [ section_menu($self->menu) ]; |
|
| 17 |
$self->presenter->render('menu/menu',
|
|
| 18 |
sections => $sections, |
|
| 19 |
) |
|
| 15 |
"\$(function(){kivi.LeftMenu.init(@{[ to_json([ section_menu($_[0]->menu) ]) ]})});"
|
|
| 20 | 16 |
} |
| 21 | 17 |
|
| 22 | 18 |
sub javascripts {
|
| 23 | 19 |
qw( |
| 24 | 20 |
js/jquery.cookie.js |
| 21 |
js/kivi.LeftMenu.js |
|
| 25 | 22 |
); |
| 26 | 23 |
} |
| 27 | 24 |
|
| js/kivi.LeftMenu.js | ||
|---|---|---|
| 1 |
namespace('kivi.LeftMenu', function(ns) {
|
|
| 2 |
'use strict'; |
|
| 3 |
ns.init = function(sections) {
|
|
| 4 |
sections.forEach(function(b,i){
|
|
| 5 |
var a=$('<a class="ml">').append($('<span class="mii ms">').append($('<div>').addClass(b[3])),$('<span class="mic">').append(b[0]));
|
|
| 6 |
if(b[5])a.attr('href', b[5]);
|
|
| 7 |
if(b[6])a.attr('target', b[6]);
|
|
| 8 |
$('#html-menu').append($('<div class="mi">').addClass(b[4]).addClass(b[1]).attr('id','mi'+b[2]).append(a))
|
|
| 9 |
}); |
|
| 10 |
$('#html-menu div.i, #html-menu div.sm').not('[id^='+$.cookie('html-menu-selection')+'_]').hide();
|
|
| 11 |
$('#html-menu div.m#'+$.cookie('html-menu-selection')).addClass('menu-open');
|
|
| 12 |
$('#html-menu div.m').each(function(){
|
|
| 13 |
$(this).click(function(){
|
|
| 14 |
$.cookie('html-menu-selection',$(this).attr('id'));
|
|
| 15 |
$('#html-menu div.mi').not('div.m').not('[id^='+$(this).attr('id')+'_]').hide();
|
|
| 16 |
$('#html-menu div.mi[id^='+$(this).attr('id')+'_]').toggle();
|
|
| 17 |
$('#html-menu div.m').not('[id^='+$(this).attr('id')+']').removeClass('menu-open');
|
|
| 18 |
$(this).toggleClass('menu-open');
|
|
| 19 |
}); |
|
| 20 |
}); |
|
| 21 |
}; |
|
| 22 |
}); |
|
| templates/webpages/menu/menu.html | ||
|---|---|---|
| 1 |
[%- USE JSON %] |
|
| 2 |
$(function(){$([% JSON.json(sections) %]).each(function(i,b){
|
|
| 3 |
var a=$('<a class="ml">').append($('<span class="mii ms">').append($('<div>').addClass(b[3])),$('<span class="mic">').append(b[0]));
|
|
| 4 |
if(b[5])a.attr('href', b[5]);
|
|
| 5 |
if(b[6])a.attr('target', b[6]);
|
|
| 6 |
$('#html-menu').append($('<div class="mi">').addClass(b[4]).addClass(b[1]).attr('id','mi'+b[2]).append(a))
|
|
| 7 |
}); |
|
| 8 |
$('#html-menu div.i, #html-menu div.sm').not('[id^='+$.cookie('html-menu-selection')+'_]').hide();
|
|
| 9 |
$('#html-menu div.m#'+$.cookie('html-menu-selection')).addClass('menu-open');
|
|
| 10 |
$('#html-menu div.m').each(function(){
|
|
| 11 |
$(this) |
|
| 12 |
.click(function(){
|
|
| 13 |
$.cookie('html-menu-selection',$(this).attr('id'));
|
|
| 14 |
$('#html-menu div.mi').not('div.m').not('[id^='+$(this).attr('id')+'_]').hide();
|
|
| 15 |
$('#html-menu div.mi[id^='+$(this).attr('id')+'_]').toggle();
|
|
| 16 |
$('#html-menu div.m').not('[id^='+$(this).attr('id')+']').removeClass('menu-open');
|
|
| 17 |
$(this).toggleClass('menu-open');
|
|
| 18 |
}) |
|
| 19 |
}) |
|
| 20 |
}) |
|
Auch abrufbar als: Unified diff
HTML Menü: Javascript ausgelagert in eigene Datei