[#692] Fix and simplify the top menu open/closing
* Remove bunch of extra code from choosen * Fix awkward indention * Add admin menu items to the Modules menu * Turn off bold on menu item hover, was causing jumping in width * Fix color on opened top menus * Fix a bunch of edge cases in the menu clicks. * Remove gross 'html' binding in favor of a one time only one
This commit is contained in:
parent
b312bf387a
commit
612f2f98e4
|
@ -67,20 +67,25 @@
|
||||||
<% more_top_menu_items.each do |item| %>
|
<% more_top_menu_items.each do |item| %>
|
||||||
<%= render_menu_node(item) %>
|
<%= render_menu_node(item) %>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
<%# TODO: Extract to helper %>
|
||||||
|
<% if User.current.admin? %>
|
||||||
|
<% menu_items_for(:admin_menu) do |item| -%>
|
||||||
|
<li><%= link_to h(item.caption), item.url, item.html_options %></li>
|
||||||
|
<% end -%>
|
||||||
|
<% end %>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<%= render_menu_node(help_menu_item) %>
|
<%= render_menu_node(help_menu_item) %>
|
||||||
<% unless User.current.logged? %>
|
<% unless User.current.logged? %>
|
||||||
<li>
|
<li id="login-menu" class="drop-down last-child">
|
||||||
<%= link_to l(:label_login), {:controller => 'account', :action => 'login'}, :class => 'login' %>
|
<%= link_to l(:label_login), {:controller => 'account', :action => 'login'}, :class => 'login' %>
|
||||||
<!-- IE7 Fix - extra div needed for slideToggle animation -->
|
<div id="nav-login" style="display:none;">
|
||||||
<div id="nav-login">
|
|
||||||
<%= render :partial => 'account/login' %>
|
<%= render :partial => 'account/login' %>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
<% else %>
|
<% else %>
|
||||||
<li class="drop-down">
|
<li class="drop-down last-child">
|
||||||
<%= link_to_user(User.current) %>
|
<%= link_to_user(User.current) %>
|
||||||
<ul style="display:none;">
|
<ul style="display:none;">
|
||||||
<% menu_items_for(:account_menu) do |item| %>
|
<% menu_items_for(:account_menu) do |item| %>
|
||||||
|
|
|
@ -469,32 +469,6 @@ jQuery.viewportHeight = function() {
|
||||||
jQuery(document).ready(function($) {
|
jQuery(document).ready(function($) {
|
||||||
|
|
||||||
|
|
||||||
// show/hide header search box
|
|
||||||
$("#account a.search").live('click', function() {
|
|
||||||
var searchWidth = $("#account-nav").width();
|
|
||||||
|
|
||||||
$(this).toggleClass("open");
|
|
||||||
$("#nav-search").width(searchWidth).slideToggle(animationRate, function(){
|
|
||||||
$("#nav-search-box").select();
|
|
||||||
});
|
|
||||||
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
// show/hide login box
|
|
||||||
$("#account a.login").click(function() {
|
|
||||||
$(this).parent().toggleClass("open");
|
|
||||||
// Focus the username field if the login field has opened
|
|
||||||
$("#nav-login").slideToggle(animRate, function () {
|
|
||||||
if ($(this).parent().hasClass("open")) {
|
|
||||||
$("input#username").focus()
|
|
||||||
}
|
|
||||||
});
|
|
||||||
$("#account .drop-down.open").toggleClass("open").find("ul").mySlide();
|
|
||||||
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
// file table thumbnails
|
// file table thumbnails
|
||||||
$("table a.has-thumb").hover(function() {
|
$("table a.has-thumb").hover(function() {
|
||||||
$(this).removeAttr("title").toggleClass("active");
|
$(this).removeAttr("title").toggleClass("active");
|
||||||
|
@ -560,35 +534,53 @@ jQuery(document).ready(function($) {
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
|
|
||||||
jQuery("#account-nav > li").hover(function() {
|
// Toggle a top menu item open or closed, showing or hiding its submenu
|
||||||
if ($("#account-nav").hasClass("hover") && ($("#account-nav > li.drop-down.open").get(0) !== $(this).get(0))){
|
function toggleTopMenu(menuItem) {
|
||||||
//Close all other open menus
|
menuItem.toggleClass("open").find('ul').mySlide();
|
||||||
//Used to work around the rendering bug TODO: fix
|
};
|
||||||
jQuery("input#username-pulldown").blur();
|
|
||||||
$("#account-nav > li.drop-down.open").toggleClass("open").find("> ul").mySlide();
|
|
||||||
$(this).slideAndFocus();
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
function(){
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
jQuery("#account-nav > li.drop-down").click(function() {
|
|
||||||
if (($("#account-nav > li.drop-down.open").get(0) !== $(this).get(0))){
|
|
||||||
$("#account-nav > li.drop-down.open").toggleClass("open").find("> ul").mySlide();
|
|
||||||
}
|
|
||||||
$(this).slideAndFocus();
|
|
||||||
$("#account-nav").toggleClass("hover");
|
|
||||||
|
|
||||||
$("#account .drop-down:has(ul) > a").click(function() {
|
// Handle a single click event on the page to close an open menu item
|
||||||
//Close all other open menus
|
|
||||||
$("#account .drop-down.open:has(ul)").not($(this).parent()).toggleClass("open").find("ul").mySlide();
|
function handleClickEventOnPageToCloseOpenMenu(openMenuItem) {
|
||||||
//Close login pull down when open
|
$('html').one("click", function(htmlEvent) {
|
||||||
$("li.open div#nav-login").parent().toggleClass("open").find("div#nav-login").slideToggle(animRate);
|
if (openMenuItem.has(htmlEvent.target).length > 0) {
|
||||||
//Toggle clicked menu item
|
// Clicked on the open menu, let it bubble up
|
||||||
$(this).parent().toggleClass("open").find("ul").mySlide();
|
} else {
|
||||||
return false;
|
// Clicked elsewhere, close menu
|
||||||
});
|
toggleTopMenu(openMenuItem);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// Click on the menu header with a dropdown menu
|
||||||
|
$('#account-nav .drop-down').live('click', function(event) {
|
||||||
|
var menuItem = $(this);
|
||||||
|
|
||||||
|
toggleTopMenu(menuItem);
|
||||||
|
|
||||||
|
if (menuItem.hasClass('open')) {
|
||||||
|
handleClickEventOnPageToCloseOpenMenu(menuItem);
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
// Click on an actual item
|
||||||
|
$('#account-nav .drop-down ul a').live('click', function(event) {
|
||||||
|
event.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
// show/hide login box
|
||||||
|
$("#account-nav a.login").click(function() {
|
||||||
|
$(this).parent().toggleClass("open");
|
||||||
|
// Focus the username field if the login field has opened
|
||||||
|
$("#nav-login").slideToggle(animationRate, function () {
|
||||||
|
if ($(this).parent().hasClass("open")) {
|
||||||
|
$("input#username").focus()
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
// deal with potentially problematic super-long titles
|
// deal with potentially problematic super-long titles
|
||||||
$(".title-bar h2").css({paddingRight: $(".title-bar-actions").outerWidth() + 15 });
|
$(".title-bar h2").css({paddingRight: $(".title-bar-actions").outerWidth() + 15 });
|
||||||
|
@ -612,12 +604,8 @@ jQuery(document).ready(function($) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$('html').click(function() {
|
// Do not close the login window when using it
|
||||||
$("#header .drop-down.open").toggleClass("open").find("> ul").mySlide();
|
$('#nav-login-content').click(function(event){
|
||||||
$("#account-nav.hover").toggleClass("hover");
|
event.stopPropagation();
|
||||||
});
|
});
|
||||||
// Do not close the login window when using it
|
|
||||||
$('#nav-login-content').click(function(event){
|
|
||||||
event.stopPropagation();
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -1212,7 +1212,6 @@ a:hover {
|
||||||
border-bottom-left-radius:5px;
|
border-bottom-left-radius:5px;
|
||||||
border-bottom-right-radius:5px;
|
border-bottom-right-radius:5px;
|
||||||
background-color:#7F7F7F;
|
background-color:#7F7F7F;
|
||||||
font-weight:bold;
|
|
||||||
color:#FFFFFF;
|
color:#FFFFFF;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1233,6 +1232,7 @@ li a.help:hover {
|
||||||
background-image:url(../images/icon_help_grey.png);
|
background-image:url(../images/icon_help_grey.png);
|
||||||
}
|
}
|
||||||
#header li.drop-down.open > a {
|
#header li.drop-down.open > a {
|
||||||
|
color: #6A0406;
|
||||||
background:#FFFFFF url(../images/arrow-down-grey.png) no-repeat right center;
|
background:#FFFFFF url(../images/arrow-down-grey.png) no-repeat right center;
|
||||||
padding-right:35px;
|
padding-right:35px;
|
||||||
}
|
}
|
||||||
|
@ -1333,8 +1333,9 @@ input:-moz-placeholder {
|
||||||
width:94%;
|
width:94%;
|
||||||
}
|
}
|
||||||
#nav-login-content {
|
#nav-login-content {
|
||||||
position: relative;
|
position: absolute;
|
||||||
position-top:44px;
|
top:44px;
|
||||||
|
right: 0px;
|
||||||
float: right;
|
float: right;
|
||||||
background: white;
|
background: white;
|
||||||
border:1px solid #194E60;
|
border:1px solid #194E60;
|
||||||
|
|
Loading…
Reference in New Issue