Layout: Content als eigenes Layout und Split compositor
authorSven Schöling <s.schoeling@linet-services.de>
Thu, 29 Sep 2016 11:21:46 +0000 (13:21 +0200)
committerMoritz Bunkus <m.bunkus@linet-services.de>
Tue, 28 Feb 2017 09:04:33 +0000 (10:04 +0100)
SL/Layout/Classic.pm
SL/Layout/Content.pm [new file with mode: 0644]
SL/Layout/Javascript.pm
SL/Layout/MenuLeft.pm
SL/Layout/Split.pm [new file with mode: 0644]
SL/Layout/V3.pm
css/kivitendo/menu.css
css/lx-office-erp/menu.css

index 94f12b3..7575a1a 100644 (file)
@@ -6,12 +6,17 @@ use parent qw(SL::Layout::Base);
 use SL::Layout::Top;
 use SL::Layout::MenuLeft;
 use SL::Layout::None;
+use SL::Layout::Split;
+use SL::Layout::Content;
 
 sub init_sub_layouts {
   [
     SL::Layout::None->new,
     SL::Layout::Top->new,
-    SL::Layout::MenuLeft->new,
+    SL::Layout::Split->new(
+      left  => [ SL::Layout::MenuLeft->new ],
+      right => [ SL::Layout::Content->new ],
+    )
   ]
 }
 
diff --git a/SL/Layout/Content.pm b/SL/Layout/Content.pm
new file mode 100644 (file)
index 0000000..6bf7267
--- /dev/null
@@ -0,0 +1,35 @@
+package SL::Layout::Content;
+
+use strict;
+use parent qw(SL::Layout::Base);
+
+use SL::Presenter;
+
+sub start_content {
+  "<div id='content'>";
+}
+
+sub end_content {
+  "</div>";
+}
+
+1;
+
+__END__
+
+=encoding utf-8
+
+=head1 NAME
+
+SL::Layout::Content
+
+=head1 DESCRIPTION
+
+Pseudo layout for the position of the actual content in the layout. Currently
+only implements the start_content/end_content blocks used for styling.
+
+=head1 AUTHOR
+
+Sven Schöling E<lt>s.schoeling@linet-services.deE<gt>
+
+=cut
index 72f55fc..76728ef 100644 (file)
@@ -3,6 +3,10 @@ package SL::Layout::Javascript;
 use strict;
 use parent qw(SL::Layout::Base);
 
+use SL::Layout::None;
+use SL::Layout::Top;
+use SL::Layout::Content;
+
 use List::Util qw(max);
 use URI;
 
@@ -10,6 +14,7 @@ sub init_sub_layouts {
   [
     SL::Layout::None->new,
     SL::Layout::Top->new,
+    SL::Layout::Content->new,
   ]
 }
 
@@ -46,14 +51,6 @@ sub pre_content {
   );
 }
 
-sub start_content {
-  "<div id='content'>\n";
-}
-
-sub end_content {
-  "</div>\n";
-}
-
 sub stylesheets {
   $_[0]->add_stylesheets(qw(
     dhtmlsuite/menu-item.css
index 2f99944..25119fe 100644 (file)
@@ -29,14 +29,6 @@ sub pre_content {
   "<div id='html-menu'></div>\n";
 }
 
-sub start_content {
-  "<div id='content' class='html-menu'>\n";
-}
-
-sub end_content {
-  "</div>\n";
-}
-
 sub section_menu {
   my ($menu) = @_;
   my @items;
diff --git a/SL/Layout/Split.pm b/SL/Layout/Split.pm
new file mode 100644 (file)
index 0000000..e8e2a88
--- /dev/null
@@ -0,0 +1,65 @@
+package SL::Layout::Split;
+
+use strict;
+use parent qw(SL::Layout::Base);
+
+use SL::Presenter;
+
+use Rose::Object::MakeMethods::Generic (
+  'scalar'                => [ qw(left right) ],
+);
+
+sub sub_layouts {
+  @{ $_[0]->left || [] },
+  @{ $_[0]->right || [] },
+}
+
+sub pre_content {
+  my $left  = join '', map { $_->pre_content } @{ $_[0]->left  || [] };
+  my $right = join '', map { $_->pre_content } @{ $_[0]->right || [] };
+
+  SL::Presenter->get->html_tag('div', $left, class => 't-layout-left')
+  .'<div class="t-layout-right html-menu">' . $right;
+}
+
+sub post_content {
+  my $left  = join '', map { $_->post_content } @{ $_[0]->left  || [] };
+  my $right = join '', map { $_->post_content } @{ $_[0]->right || [] };
+
+  $right . '</div>'
+  . SL::Presenter->get->html_tag('div', $left, class => 't-layout-left');
+}
+
+1;
+
+__END__
+
+=encoding utf-8
+
+=head1 NAME
+
+SL::Layout::Split
+
+=head1 SYNOPSIS
+
+  use SL::Layout::TLayout;
+
+  SL::Layout::TLayout->new(
+    left  => [ LIST OF SUBLAYOUTS ],
+    right => [ LIST OF SUBLAYOUTS ],
+  );
+
+=head1 DESCRIPTION
+
+Layout with left and right components, with content being part of the
+right block.
+
+=head1 BUGS
+
+Due to the way content is serialized it's currently not possible to shift the content into the other blocks
+
+=head1 AUTHOR
+
+Sven Schöling E<lt>s.schoeling@linet-services.deE<gt>
+
+=cut
index 8bf270f..bc4ecb7 100644 (file)
@@ -6,21 +6,16 @@ use parent qw(SL::Layout::Base);
 use SL::Layout::None;
 use SL::Layout::Top;
 use SL::Layout::CssMenu;
+use SL::Layout::Content;
 
 sub init_sub_layouts {
   [
     SL::Layout::None->new,
     SL::Layout::Top->new,
     SL::Layout::CssMenu->new,
+    SL::Layout::Content->new,
   ]
 }
 
-sub start_content {
-  "<div id='content'>\n";
-}
-
-sub end_content {
-  "</div>\n";
-}
 
 1;
index 1b004b7..168a021 100644 (file)
@@ -149,15 +149,15 @@ li.sub {
    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 */
-#content.html-menu, #html-menu {
+div.layout-split-left, #html-menu {
   transition:         margin-left 0.2s, width 0.2s;
   -moz-transition:    margin-left 0.2s, width 0.2s;
   -webkit-transition: margin-left 0.2s, width 0.2s;
   -o-transition:      margin-left 0.2s, width 0.2s;
 }
-#content.html-menu { margin-left: 190px; }
-#content.html-menu.folded { margin-left: 40px }
-#html-menu.folded:hover + #content.html-menu.folded { margin-left: 190px }
+div.layout-split-right { margin-left: 190px; }
+div.layout-split-right.folded { margin-left: 40px }
+#html-menu.folded:hover + div.layout-split-right.folded { margin-left: 190px }
 #html-menu { float:left; width: 183px; font-size: 8pt; margin-top: 10px; overflow:hidden; }
 #html-menu.folded { width: 32px; }
 #html-menu.folded:hover { width: 183px; }
index 5cdf954..ecd3d27 100644 (file)
@@ -152,15 +152,15 @@ div#menuv3 li li li li:hover ul
    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 */
-#content.html-menu, #html-menu {
+div.html-menu, #html-menu {
   transition:         margin-left 0.2s, width 0.2s;
   -moz-transition:    margin-left 0.2s, width 0.2s;
   -webkit-transition: margin-left 0.2s, width 0.2s;
   -o-transition:      margin-left 0.2s, width 0.2s;
 }
-#content.html-menu { margin-left: 190px; }
-#content.html-menu.folded { margin-left: 40px }
-#html-menu.folded:hover + #content.html-menu.folded { margin-left: 190px }
+div.layout-split-right { margin-left: 190px; }
+div.layout-split-right.folded { margin-left: 40px }
+#html-menu.folded:hover + #content.layout-split-right.folded { margin-left: 190px }
 #html-menu { float:left; width: 183px; font-size: 85%; margin-top: 10px; overflow:hidden; }
 #html-menu.folded { width: 32px; }
 #html-menu.folded:hover { width: 183px; }