need to work on submenuDirection reactivity

This commit is contained in:
ayamoosa 2024-03-15 09:15:40 -07:00
parent 99ab5cec5b
commit f88cfc750f
2 changed files with 39 additions and 12 deletions

View File

@ -149,23 +149,45 @@ function UIContextMenu(options){
return false;
});
// initialize menuAim plugin
$(contextMenu).menuAim({
submenuDirection: function (e){
// if submenu will open to the left of menu item
if (e.getBoundingClientRect().left + e.getBoundingClientRect().width > window.innerWidth) {
return 'left';
submenuDirection: function(){
//if this is not a submenu
// if(!options.is_submenu){
// if submenu is going to be on the right of the main menu
if(x_pos + $(contextMenu).width() + 10 > window.innerWidth){
console.log('right')
return "right";
} else {
return 'right';
console.log('left')
return "left";
}
// }
},
activate: function (e) {
//if submenu opens on right make submenuDirection right
// if($(contextMenu).offset().left + $(contextMenu).width() + 10 > window.innerWidth){
// $(contextMenu).menuAim({
// submenuDirection: 'right'
// });
// } else {
// $(contextMenu).menuAim({
// submenuDirection: 'left'
// });
// }
// hover over an item
let item = $(e).closest('.context-menu-item');
console.log('activate', e)
// mark other items as inactive
$(contextMenu).find('.context-menu-item').removeClass('context-menu-item-active');
// mark this item as active
$(e).addClass('context-menu-item-active');
$(item).addClass('context-menu-item-active');
// close any submenu that doesn't belong to this item
$(`.context-menu[data-parent-id="${menu_id}"]`).remove();
// mark this context menu as active
@ -173,6 +195,7 @@ function UIContextMenu(options){
// activate submenu
// open submenu if applicable
if($(e).hasClass('context-menu-item-submenu')){
let item_rect_box = e.getBoundingClientRect();
@ -193,6 +216,7 @@ function UIContextMenu(options){
})
}
}
},
deactivate: function (e) {
console.log('deactivate')
@ -285,3 +309,5 @@ window.select_ctxmenu_item = function ($ctxmenu_item){
}
export default UIContextMenu;

View File

@ -166,6 +166,7 @@
options.deactivate(activeRow);
}
options.activate(row);
activeRow = row;
};
@ -277,13 +278,13 @@
// corner to decrease over time, as explained above. If the
// submenu opens in a different direction, we change our slope
// expectations.
if (options.submenuDirection == "left") {
if (options.submenuDirection() == "left") {
decreasingCorner = lowerLeft;
increasingCorner = upperLeft;
} else if (options.submenuDirection == "below") {
} else if (options.submenuDirection() == "below") {
decreasingCorner = lowerRight;
increasingCorner = lowerLeft;
} else if (options.submenuDirection == "above") {
} else if (options.submenuDirection() == "above") {
decreasingCorner = upperLeft;
increasingCorner = upperRight;
}