Tab left/right buttons for project menu (#20632).

Patch by Felix Gliesche.

git-svn-id: http://svn.redmine.org/redmine/trunk@15067 e93f8b46-1217-0410-a6f0-8f06a7374b81

5 files changed, 24 insertions, 11 deletions

diff --git a/app/views/common/_tabs.html.erb b/app/views/common/_tabs.html.erb
index 454b5d772..705ecc710 100644
--- a/app/views/common/_tabs.html.erb
+++ b/app/views/common/_tabs.html.erb
@@ -13,11 +13,6 @@
   </div>
 </div>
 
-<script>
-  $(document).ready(displayTabsButtons);
-  $(window).resize(displayTabsButtons);
-</script>
-
 <% tabs.each do |tab| -%>
   <%= content_tag('div', render(:partial => tab[:partial], :locals => {:tab => tab} ),
                        :id => "tab-content-#{tab[:name]}",
diff --git a/app/views/layouts/base.html.erb b/app/views/layouts/base.html.erb
index 1d83ca12b..7da0f07c4 100644
--- a/app/views/layouts/base.html.erb
+++ b/app/views/layouts/base.html.erb
@@ -87,8 +87,12 @@
     <h1><%= page_header_title %></h1>
 
     <% if display_main_menu?(@project) %>
-    <div id="main-menu">
+    <div id="main-menu" class="tabs">
         <%= render_main_menu(@project) %>
+        <div class="tabs-buttons" style="display:none;">
+            <button class="tab-left" onclick="moveTabLeft(this); return false;"></button>
+            <button class="tab-right" onclick="moveTabRight(this); return false;"></button>
+        </div>
     </div>
     <% end %>
 </div>
diff --git a/lib/redmine/menu_manager.rb b/lib/redmine/menu_manager.rb
index 58830598f..669216e6a 100644
--- a/lib/redmine/menu_manager.rb
+++ b/lib/redmine/menu_manager.rb
@@ -90,7 +90,7 @@ module Redmine
         menu_items_for(menu, project) do |node|
           links << render_menu_node(node, project)
         end
-        links.empty? ? nil : content_tag('ul', links.join("\n").html_safe)
+        links.empty? ? nil : content_tag('ul', links.join.html_safe)
       end
 
       def render_menu_node(node, project=nil)
diff --git a/public/javascripts/application.js b/public/javascripts/application.js
index 9c6c7a47d..b247907ad 100644
--- a/public/javascripts/application.js
+++ b/public/javascripts/application.js
@@ -620,6 +620,13 @@ function setupAjaxIndicator() {
   });
 }
 
+function setupTabs() {
+  if($('.tabs').length > 0) {
+    displayTabsButtons();
+    $(window).resize(displayTabsButtons);
+  }
+}
+
 function hideOnLoad() {
   $('.hol').hide();
 }
@@ -677,3 +684,4 @@ $(document).ready(setupAjaxIndicator);
 $(document).ready(hideOnLoad);
 $(document).ready(addFormObserversForDoubleSubmit);
 $(document).ready(defaultFocus);
+$(document).ready(setupTabs);
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index d69215108..e3f70d0a1 100644
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -10,7 +10,7 @@ h4 {border-bottom: 1px dotted #bbb;}
 pre, code {font-family: Consolas, Menlo, "Liberation Mono", Courier, monospace;}
 
 /***** Layout *****/
-#wrapper {background: white;}
+#wrapper {background: white;overflow: hidden;}
 
 #top-menu {background: #3E5B76; color: #fff; height:1.8em; font-size: 0.8em; padding: 2px 2px 0px 6px;}
 #top-menu ul {margin: 0;  padding: 0;}
@@ -31,14 +31,15 @@ pre, code {font-family: Consolas, Menlo, "Liberation Mono", Courier, monospace;}
 #header h1 a.ancestor { font-size: 80%; }
 #quick-search {float:right;}
 
-#main-menu {position: absolute;  bottom: 0px;  left:6px; margin-right: -500px;}
-#main-menu ul {margin: 0;  padding: 0;}
+#main-menu {position: absolute;  bottom: 0px;  left:6px; margin-right: -500px; width: 100%;}
+#main-menu ul {margin: 0;  padding: 0; width: 100%; white-space: nowrap;}
 #main-menu li {
-  float:left;
+  float:none;
   list-style-type:none;
   margin: 0px 2px 0px 0px;
   padding: 0px 0px 0px 0px;
   white-space:nowrap;
+  display:inline-block;
 }
 #main-menu li a {
   display: block;
@@ -50,6 +51,11 @@ pre, code {font-family: Consolas, Menlo, "Liberation Mono", Courier, monospace;}
 }
 #main-menu li a:hover {background:#759FCF; color:#fff;}
 #main-menu li a.selected, #main-menu li a.selected:hover {background:#fff; color:#555;}
+#main-menu .tabs-buttons {
+  right: 6px;
+  background-color: transparent;
+  border-bottom-color: transparent;
+}
 
 #admin-menu ul {margin: 0;  padding: 0;}
 #admin-menu li {margin: 0;  padding: 0 0 6px 0; list-style-type:none;}