Commit 004e635
committed
refactor(menu): improve menu get lookup
If a `menuId` is not provided then it'll return the first menu found.
If a `menuId` is `left` or `right`, then it'll return the enabled menu
on that side. Otherwise, if a `menuId` is provided, then it'll try to
find the menu using the menu's `id` property. If a menu is not found
then it'll return `null`. If a menu id was provided, but was not found,
it will not fallback to finding any menu. Closes ionic-team#55351 parent 8564d79 commit 004e635
3 files changed
Lines changed: 239 additions & 87 deletions
File tree
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -207,8 +207,9 @@ export class MenuController { | |||
| 207 | 207 | ||
| 208 | 208 | /** | |
| 209 | 209 | * Used to enable or disable a menu. For example, there could be multiple | |
| 210 | - * left menus, but only one of them should be able to be dragged open. | ||
| 211 | - * @param {boolean} shouldEnable True if it should be enabled, false if not. | ||
| 210 | + * left menus, but only one of them should be able to be opened at the same | ||
| 211 | + * time. If there are multiple menus on the same side, then enabling one menu | ||
| 212 | + * will also automatically disable all the others that are on the same side. | ||
| 212 | 213 | * @param {string} [menuId] Optionally get the menu by its id, or side. | |
| 213 | 214 | * @return {Menu} Returns the instance of the menu, which is useful for chaining. | |
| 214 | 215 | */ | |
@@ -249,24 +250,37 @@ export class MenuController { | |||
| 249 | 250 | } | |
| 250 | 251 | ||
| 251 | 252 | /** | |
| 252 | - * Used to get a menu instance. If a `menuId` is not provided then it'll return | ||
| 253 | - * the first menu found. If a `menuId` is provided, then it'll first try to find | ||
| 254 | - * the menu using the menu's `id` attribute. If a menu is not found using the `id` | ||
| 255 | - * attribute, then it'll try to find the menu by its `side` name. | ||
| 253 | + * Used to get a menu instance. If a `menuId` is not provided then it'll | ||
| 254 | + * return the first menu found. If a `menuId` is `left` or `right`, then | ||
| 255 | + * it'll return the enabled menu on that side. Otherwise, if a `menuId` is | ||
| 256 | + * provided, then it'll try to find the menu using the menu's `id` | ||
| 257 | + * property. If a menu is not found then it'll return `null`. | ||
| 256 | 258 | * @param {string} [menuId] Optionally get the menu by its id, or side. | |
| 257 | 259 | * @return {Menu} Returns the instance of the menu if found, otherwise `null`. | |
| 258 | 260 | */ | |
| 259 | 261 | get(menuId?: string): Menu { | |
| 260 | - if (menuId) { | ||
| 261 | - // first try by "id" | ||
| 262 | - let menu = this._menus.find(m => m.id === menuId); | ||
| 263 | - if (menu) return menu; | ||
| 262 | + var menu: Menu; | ||
| 264 | 263 | ||
| 265 | - // not found by "id", next try by "side" | ||
| 264 | + if (menuId === 'left' || menuId === 'right') { | ||
| 265 | + // there could be more than one menu on the same side | ||
| 266 | + // so first try to get the enabled one | ||
| 266 | 267 | menu = this._menus.find(m => m.side === menuId && m.enabled); | |
| 267 | 268 | if (menu) return menu; | |
| 269 | + | ||
| 270 | + // didn't find a menu side that is enabled | ||
| 271 | + // so try to get the first menu side found | ||
| 272 | + return this._menus.find(m => m.side === menuId) || null; | ||
| 273 | + | ||
| 274 | + } else if (menuId) { | ||
| 275 | + // the menuId was not left or right | ||
| 276 | + // so try to get the menu by its "id" | ||
| 277 | + return this._menus.find(m => m.id === menuId) || null; | ||
| 268 | 278 | } | |
| 269 | 279 | ||
| 280 | + // return the first enabled menu | ||
| 281 | + menu = this._menus.find(m => m.enabled); | ||
| 282 | + if (menu) return menu; | ||
| 283 | + | ||
| 270 | 284 | // get the first menu in the array, if one exists | |
| 271 | 285 | return (this._menus.length ? this._menus[0] : null); | |
| 272 | 286 | } | |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -370,15 +370,29 @@ export class Menu extends Ion { | |||
| 370 | 370 | ||
| 371 | 371 | /** | |
| 372 | 372 | * Used to enable or disable a menu. For example, there could be multiple | |
| 373 | - * left menus, but only one of them should be able to be dragged open. | ||
| 373 | + * left menus, but only one of them should be able to be opened at the same | ||
| 374 | + * time. If there are multiple menus on the same side, then enabling one menu | ||
| 375 | + * will also automatically disable all the others that are on the same side. | ||
| 374 | 376 | * @param {boolean} shouldEnable True if it should be enabled, false if not. | |
| 375 | 377 | * @return {Menu} Returns the instance of the menu, which is useful for chaining. | |
| 376 | 378 | */ | |
| 377 | 379 | enable(shouldEnable: boolean): Menu { | |
| 378 | 380 | this.enabled = shouldEnable; | |
| 379 | 381 | if (!shouldEnable && this.isOpen) { | |
| 382 | + // close if this menu is open, and should not be enabled | ||
| 380 | 383 | this.close(); | |
| 381 | 384 | } | |
| 385 | + | ||
| 386 | + if (shouldEnable) { | ||
| 387 | + // if this menu should be enabled | ||
| 388 | + // then find all the other menus on this same side | ||
| 389 | + // and automatically disable other same side menus | ||
| 390 | + let sameSideMenus = this._menuCtrl | ||
| 391 | + .getMenus() | ||
| 392 | + .filter(m => m.side === this.side && m !== this) | ||
| 393 | + .map(m => m.enabled = false); | ||
| 394 | + } | ||
| 395 | + | ||
| 382 | 396 | return this; | |
| 383 | 397 | } | |
| 384 | 398 | ||
0 commit comments