From cbb39c7833994c6e1db3f5b445fbedf5c70b95cc Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Tue, 3 Jul 2012 13:02:06 -0700 Subject: fixed IKNINJA-1877 : Clicking on a menu item should commit on mouse up and not on mouse down. Signed-off-by: Ananya Sen --- js/components/menu/menu-entry.reel/menu-entry.js | 13 +++++++++- js/components/menu/menu-item.reel/menu-item.css | 2 ++ js/components/menu/menu-item.reel/menu-item.js | 30 ++++++++++++++++-------- 3 files changed, 34 insertions(+), 11 deletions(-) (limited to 'js/components') diff --git a/js/components/menu/menu-entry.reel/menu-entry.js b/js/components/menu/menu-entry.reel/menu-entry.js index 0f5503f6..93628dec 100755 --- a/js/components/menu/menu-entry.reel/menu-entry.js +++ b/js/components/menu/menu-entry.reel/menu-entry.js @@ -78,10 +78,21 @@ exports.MenuEntry = Montage.create(Component, { } }, + toggleOnMenuItemAction: { + value: function() { + // TODO: Hack! Rework this! + //for non menu headers only + this.parentComponent.ownerComponent.toggleActivation(this); + } + }, + captureMousedown: { value: function(event) { // TODO: Hack! Rework this! - this.parentComponent.ownerComponent.toggleActivation(this); + //for menu headers only + if(event.target.getAttribute("data-montage-id") === "topHeaderText"){ + this.parentComponent.ownerComponent.toggleActivation(this); + } } }, diff --git a/js/components/menu/menu-item.reel/menu-item.css b/js/components/menu/menu-item.reel/menu-item.css index e5ceda5c..0b8092c1 100755 --- a/js/components/menu/menu-item.reel/menu-item.css +++ b/js/components/menu/menu-item.reel/menu-item.css @@ -9,10 +9,12 @@ font-size: 10pt; padding: 3px 12px 3px 8px; text-shadow : 1px 1px 1px #000000; + cursor:pointer; } .menuItem:hover { background-color: #7f7f7f; + cursor:pointer; } .menubg .subEntries { diff --git a/js/components/menu/menu-item.reel/menu-item.js b/js/components/menu/menu-item.reel/menu-item.js index 3a5bf4ab..cad833a0 100755 --- a/js/components/menu/menu-item.reel/menu-item.js +++ b/js/components/menu/menu-item.reel/menu-item.js @@ -96,18 +96,15 @@ exports.MenuItem = Montage.create(Component, { if(this.data.submenu) { this.submenu = true; - this.subentries = this.data.entries; - this.subMenu.classList.add("subMenu"); - this.element.addEventListener("mouseover", this, false); - this.element.addEventListener("mouseout", this, false); - } + this.element.addEventListener("mouseover", this, false); + this.element.addEventListener("mouseout", this, false); this.itemText.innerHTML = this.data.displayText; - this.element.addEventListener("mousedown", this, true); + this.element.addEventListener("mouseup", this, true); } }, @@ -132,10 +129,13 @@ exports.MenuItem = Montage.create(Component, { } }, - captureMousedown: { + captureMouseup: { value: function(event) { - if(this.data.radio && this.checked) return; + if(this.data.radio && this.checked){ + this.parentComponent.ownerComponent.toggleOnMenuItemAction(); + return; + } if( ( this.enabled === true || this.enabled > 0 ) && (this.submenu === false) ) { if(this.data.action) { @@ -143,6 +143,7 @@ exports.MenuItem = Montage.create(Component, { } else if(this.checked !== null) { this.checked = !this.checked; } + this.parentComponent.ownerComponent.toggleOnMenuItemAction(); } } @@ -150,13 +151,22 @@ exports.MenuItem = Montage.create(Component, { handleMouseover: { value: function() { - if(this.enabled) this.subMenu.style.display = "block"; + if(this.enabled){ + this.element.style.backgroundColor = "#7f7f7f"; + this.element.style.cursor = "pointer"; + if(this.data.submenu) { + this.subMenu.style.display = "block"; + } + } } }, handleMouseout: { value: function() { - this.subMenu.style.display = "none"; + this.element.style.backgroundColor = "#474747"; + if(this.data.submenu) { + this.subMenu.style.display = "none"; + } } } -- cgit v1.2.3