Corrected settings menu bugs

Fixes #788

- Toggles now close all any other open toggles.
- Added .active class for post settings menu to ensure highlight stays
on settings icon/button until it is closed, not just on hover.
This commit is contained in:
William Dibbern 2013-09-17 20:59:35 -05:00
parent 658a21bcf8
commit ebe70534c2
2 changed files with 23 additions and 4 deletions

View File

@ -625,7 +625,8 @@ body.zen {
position: relative; position: relative;
top: 1px; top: 1px;
&:hover { &:hover,
&.active {
color: $lightgrey; color: $lightgrey;
} }
} }

View File

@ -4,6 +4,16 @@
(function () { (function () {
"use strict"; "use strict";
Ghost.temporary.hideToggles = function () {
$('[data-toggle]').each(function () {
var toggle = $(this).data('toggle');
$(this).parent().children(toggle + ':visible').fadeOut();
});
// Toggle active classes on menu headers
$("[data-toggle].active").removeClass("active");
};
Ghost.temporary.initToggles = function ($el) { Ghost.temporary.initToggles = function ($el) {
$el.find('[data-toggle]').each(function () { $el.find('[data-toggle]').each(function () {
@ -14,9 +24,17 @@
$el.find('[data-toggle]').on('click', function (e) { $el.find('[data-toggle]').on('click', function (e) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
$(this).toggleClass('active'); var $this = $(this),
var toggle = $(this).data('toggle'); toggle = $this.data('toggle'),
$(this).parent().children(toggle).fadeToggle(200).toggleClass('open'); isAlreadyActive = $this.is('.active');
// Close all the other open toggle menus
Ghost.temporary.hideToggles();
if (!isAlreadyActive) {
$this.toggleClass('active');
$(this).parent().children(toggle).toggleClass('open').fadeToggle(200);
}
}); });
}; };