Add an arrow indicating submenus. $.rm .subMenu on open().

This commit is contained in:
Nicolas Stepien 2012-07-04 18:43:23 +02:00
parent 3c3ed30709
commit 4fc58ad053
2 changed files with 55 additions and 19 deletions

View File

@ -752,11 +752,12 @@
},
menuInit: function() {
var div, entry, type, _i, _len, _ref;
div = $.el('div');
div = $.el('div', {
textContent: 'Filter'
});
entry = {
el: div,
open: function() {
div.textContent = 'Filter';
return true;
},
children: []
@ -1227,6 +1228,9 @@
if (!children) {
return;
}
if (subMenu = $('.subMenu', entry.el)) {
$.rm(subMenu);
}
subMenu = $.el('div', {
className: 'reply dialog subMenu'
});
@ -1321,16 +1325,19 @@
addEntry: function(entry) {
var funk;
funk = function(entry) {
var child, children, el, _i, _len, _ref;
var child, children, el, _i, _len;
el = entry.el, children = entry.children;
$.addClass(el, 'entry');
$.on(el, 'focus mouseover', function(e) {
e.stopPropagation();
return Menu.focus(this);
});
_ref = children || [];
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
child = _ref[_i];
if (!children) {
return;
}
$.addClass(el, 'hasSubMenu');
for (_i = 0, _len = children.length; _i < _len; _i++) {
child = children[_i];
funk(child);
}
};
@ -5112,9 +5119,9 @@ a[href="javascript:;"] {\
display: inline-block;\
}\
.menu_button > span {\
border-top: .5em solid;\
border-top: .5em solid;\
border-right: .3em solid transparent;\
border-left: .3em solid transparent;\
border-left: .3em solid transparent;\
display: inline-block;\
margin: 2px;\
vertical-align: middle;\
@ -5139,7 +5146,20 @@ a[href="javascript:;"] {\
.focused.entry {\
background: rgba(255, 255, 255, .33);\
}\
.entry:not(.focused) > .subMenu {\
.entry.hasSubMenu {\
padding-right: 1.5em;\
}\
.hasSubMenu::after {\
content: "";\
border-left: .5em solid;\
border-top: .3em solid transparent;\
border-bottom: .3em solid transparent;\
display: inline-block;\
margin: .3em;\
position: absolute;\
right: 3px;\
}\
.hasSubMenu:not(.focused) > .subMenu {\
display: none;\
}\
.subMenu {\

View File

@ -592,15 +592,12 @@ Filter =
false
menuInit: ->
div = $.el 'div'
div = $.el 'div',
textContent: 'Filter'
entry =
el: div
open: ->
# Reset the container's content,
# don't keep irrelevant entries.
div.textContent = 'Filter'
true
open: -> true
children: []
for type in [
@ -988,7 +985,11 @@ Menu =
{children} = entry
return unless entry.open post
$.add parent, entry.el
return unless children
if subMenu = $ '.subMenu', entry.el
# Reset sub menu, remove irrelevant entries.
$.rm subMenu
subMenu = $.el 'div',
className: 'reply dialog subMenu'
$.add entry.el, subMenu
@ -1071,7 +1072,9 @@ Menu =
$.on el, 'focus mouseover', (e) ->
e.stopPropagation()
Menu.focus @
for child in children or []
return unless children
$.addClass el, 'hasSubMenu'
for child in children
funk child
return
funk entry
@ -4021,9 +4024,9 @@ a[href="javascript:;"] {
display: inline-block;
}
.menu_button > span {
border-top: .5em solid;
border-top: .5em solid;
border-right: .3em solid transparent;
border-left: .3em solid transparent;
border-left: .3em solid transparent;
display: inline-block;
margin: 2px;
vertical-align: middle;
@ -4048,7 +4051,20 @@ a[href="javascript:;"] {
.focused.entry {
background: rgba(255, 255, 255, .33);
}
.entry:not(.focused) > .subMenu {
.entry.hasSubMenu {
padding-right: 1.5em;
}
.hasSubMenu::after {
content: "";
border-left: .5em solid;
border-top: .3em solid transparent;
border-bottom: .3em solid transparent;
display: inline-block;
margin: .3em;
position: absolute;
right: 3px;
}
.hasSubMenu:not(.focused) > .subMenu {
display: none;
}
.subMenu {