menu-controller.js 12KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332
  1. (function (factory) {
  2. if (typeof module === "object" && typeof module.exports === "object") {
  3. var v = factory(require, exports);
  4. if (v !== undefined) module.exports = v;
  5. }
  6. else if (typeof define === "function" && define.amd) {
  7. define(["require", "exports", "../../util/util"], factory);
  8. }
  9. })(function (require, exports) {
  10. "use strict";
  11. Object.defineProperty(exports, "__esModule", { value: true });
  12. var util_1 = require("../../util/util");
  13. /**
  14. * @name MenuController
  15. * @description
  16. * The MenuController is a provider which makes it easy to control a [Menu](../../Menu/Menu/).
  17. * Its methods can be used to display the menu, enable the menu, toggle the menu, and more.
  18. * The controller will grab a reference to the menu by the `side`, `id`, or, if neither
  19. * of these are passed to it, it will grab the first menu it finds.
  20. *
  21. *
  22. * @usage
  23. *
  24. * Add a basic menu component to start with. See the [Menu](../../Menu/Menu/) API docs
  25. * for more information on adding menu components.
  26. *
  27. * ```html
  28. * <ion-menu [content]="mycontent">
  29. * <ion-content>
  30. * <ion-list>
  31. * ...
  32. * </ion-list>
  33. * </ion-content>
  34. * </ion-menu>
  35. *
  36. * <ion-nav #mycontent [root]="rootPage"></ion-nav>
  37. * ```
  38. *
  39. * To call the controller methods, inject the `MenuController` provider
  40. * into the page. Then, create some methods for opening, closing, and
  41. * toggling the menu.
  42. *
  43. * ```ts
  44. * import { Component } from '@angular/core';
  45. * import { MenuController } from 'ionic-angular';
  46. *
  47. * @Component({...})
  48. * export class MyPage {
  49. *
  50. * constructor(public menuCtrl: MenuController) {
  51. *
  52. * }
  53. *
  54. * openMenu() {
  55. * this.menuCtrl.open();
  56. * }
  57. *
  58. * closeMenu() {
  59. * this.menuCtrl.close();
  60. * }
  61. *
  62. * toggleMenu() {
  63. * this.menuCtrl.toggle();
  64. * }
  65. *
  66. * }
  67. * ```
  68. *
  69. * Since only one menu exists, the `MenuController` will grab the
  70. * correct menu and call the correct method for each.
  71. *
  72. *
  73. * ### Multiple Menus on Different Sides
  74. *
  75. * For applications with both a left and right menu, the desired menu can be
  76. * grabbed by passing the `side` of the menu. If nothing is passed, it will
  77. * default to the `"left"` menu.
  78. *
  79. * ```html
  80. * <ion-menu side="left" [content]="mycontent">...</ion-menu>
  81. * <ion-menu side="right" [content]="mycontent">...</ion-menu>
  82. * <ion-nav #mycontent [root]="rootPage"></ion-nav>
  83. * ```
  84. *
  85. * ```ts
  86. * toggleLeftMenu() {
  87. * this.menuCtrl.toggle();
  88. * }
  89. *
  90. * toggleRightMenu() {
  91. * this.menuCtrl.toggle('right');
  92. * }
  93. * ```
  94. *
  95. *
  96. * ### Multiple Menus on the Same Side
  97. *
  98. * An application can have multiple menus on the same side. In order to determine
  99. * the menu to control, an `id` should be passed. In the example below, the menu
  100. * with the `authenticated` id will be enabled, and the menu with the `unauthenticated`
  101. * id will be disabled.
  102. *
  103. * ```html
  104. * <ion-menu id="authenticated" side="left" [content]="mycontent">...</ion-menu>
  105. * <ion-menu id="unauthenticated" side="left" [content]="mycontent">...</ion-menu>
  106. * <ion-nav #mycontent [root]="rootPage"></ion-nav>
  107. * ```
  108. *
  109. * ```ts
  110. * enableAuthenticatedMenu() {
  111. * this.menuCtrl.enable(true, 'authenticated');
  112. * this.menuCtrl.enable(false, 'unauthenticated');
  113. * }
  114. * ```
  115. *
  116. * Note: if an app only has one menu, there is no reason to pass an `id`.
  117. *
  118. *
  119. * @demo /docs/demos/src/menu/
  120. *
  121. * @see {@link /docs/components#menus Menu Component Docs}
  122. * @see {@link ../Menu Menu API Docs}
  123. *
  124. */
  125. var MenuController = (function () {
  126. function MenuController() {
  127. this._menus = [];
  128. }
  129. /**
  130. * Programatically open the Menu.
  131. * @param {string} [menuId] Optionally get the menu by its id, or side.
  132. * @return {Promise} returns a promise when the menu is fully opened
  133. */
  134. MenuController.prototype.open = function (menuId) {
  135. var menu = this.get(menuId);
  136. if (menu && !this.isAnimating()) {
  137. var openedMenu = this.getOpen();
  138. if (openedMenu && menu !== openedMenu) {
  139. openedMenu.setOpen(false, false);
  140. }
  141. return menu.open();
  142. }
  143. return Promise.resolve(false);
  144. };
  145. /**
  146. * Programatically close the Menu. If no `menuId` is given as the first
  147. * argument then it'll close any menu which is open. If a `menuId`
  148. * is given then it'll close that exact menu.
  149. * @param {string} [menuId] Optionally get the menu by its id, or side.
  150. * @return {Promise} returns a promise when the menu is fully closed
  151. */
  152. MenuController.prototype.close = function (menuId) {
  153. var menu;
  154. if (menuId) {
  155. // find the menu by its id
  156. menu = this.get(menuId);
  157. }
  158. else {
  159. // find the menu that is open
  160. menu = this.getOpen();
  161. }
  162. if (menu) {
  163. // close the menu
  164. return menu.close();
  165. }
  166. return Promise.resolve(false);
  167. };
  168. /**
  169. * Toggle the menu. If it's closed, it will open, and if opened, it
  170. * will close.
  171. * @param {string} [menuId] Optionally get the menu by its id, or side.
  172. * @return {Promise} returns a promise when the menu has been toggled
  173. */
  174. MenuController.prototype.toggle = function (menuId) {
  175. var menu = this.get(menuId);
  176. if (menu && !this.isAnimating()) {
  177. var openedMenu = this.getOpen();
  178. if (openedMenu && menu !== openedMenu) {
  179. openedMenu.setOpen(false, false);
  180. }
  181. return menu.toggle();
  182. }
  183. return Promise.resolve(false);
  184. };
  185. /**
  186. * Used to enable or disable a menu. For example, there could be multiple
  187. * left menus, but only one of them should be able to be opened at the same
  188. * time. If there are multiple menus on the same side, then enabling one menu
  189. * will also automatically disable all the others that are on the same side.
  190. * @param {string} [menuId] Optionally get the menu by its id, or side.
  191. * @return {Menu} Returns the instance of the menu, which is useful for chaining.
  192. */
  193. MenuController.prototype.enable = function (shouldEnable, menuId) {
  194. var menu = this.get(menuId);
  195. if (menu) {
  196. return menu.enable(shouldEnable);
  197. }
  198. };
  199. /**
  200. * Used to enable or disable the ability to swipe open the menu.
  201. * @param {boolean} shouldEnable True if it should be swipe-able, false if not.
  202. * @param {string} [menuId] Optionally get the menu by its id, or side.
  203. * @return {Menu} Returns the instance of the menu, which is useful for chaining.
  204. */
  205. MenuController.prototype.swipeEnable = function (shouldEnable, menuId) {
  206. var menu = this.get(menuId);
  207. if (menu) {
  208. return menu.swipeEnable(shouldEnable);
  209. }
  210. };
  211. /**
  212. * @param {string} [menuId] Optionally get the menu by its id, or side.
  213. * @return {boolean} Returns true if the specified menu is currently open, otherwise false.
  214. * If the menuId is not specified, it returns true if ANY menu is currenly open.
  215. */
  216. MenuController.prototype.isOpen = function (menuId) {
  217. if (menuId) {
  218. var menu = this.get(menuId);
  219. return menu && menu.isOpen || false;
  220. }
  221. else {
  222. return !!this.getOpen();
  223. }
  224. };
  225. /**
  226. * @param {string} [menuId] Optionally get the menu by its id, or side.
  227. * @return {boolean} Returns true if the menu is currently enabled, otherwise false.
  228. */
  229. MenuController.prototype.isEnabled = function (menuId) {
  230. var menu = this.get(menuId);
  231. return menu && menu.enabled || false;
  232. };
  233. /**
  234. * Used to get a menu instance. If a `menuId` is not provided then it'll
  235. * return the first menu found. If a `menuId` is `left` or `right`, then
  236. * it'll return the enabled menu on that side. Otherwise, if a `menuId` is
  237. * provided, then it'll try to find the menu using the menu's `id`
  238. * property. If a menu is not found then it'll return `null`.
  239. * @param {string} [menuId] Optionally get the menu by its id, or side.
  240. * @return {Menu} Returns the instance of the menu if found, otherwise `null`.
  241. */
  242. MenuController.prototype.get = function (menuId) {
  243. var menu;
  244. if (menuId === 'left' || menuId === 'right') {
  245. // there could be more than one menu on the same side
  246. // so first try to get the enabled one
  247. menu = this._menus.find(function (m) { return m.side === menuId && m.enabled; });
  248. if (menu) {
  249. return menu;
  250. }
  251. // didn't find a menu side that is enabled
  252. // so try to get the first menu side found
  253. return this._menus.find(function (m) { return m.side === menuId; }) || null;
  254. }
  255. else if (menuId) {
  256. // the menuId was not left or right
  257. // so try to get the menu by its "id"
  258. return this._menus.find(function (m) { return m.id === menuId; }) || null;
  259. }
  260. // return the first enabled menu
  261. menu = this._menus.find(function (m) { return m.enabled; });
  262. if (menu) {
  263. return menu;
  264. }
  265. // get the first menu in the array, if one exists
  266. return (this._menus.length ? this._menus[0] : null);
  267. };
  268. /**
  269. * @return {Menu} Returns the instance of the menu already opened, otherwise `null`.
  270. */
  271. MenuController.prototype.getOpen = function () {
  272. return this._menus.find(function (m) { return m.isOpen; });
  273. };
  274. /**
  275. * @return {Array<Menu>} Returns an array of all menu instances.
  276. */
  277. MenuController.prototype.getMenus = function () {
  278. return this._menus;
  279. };
  280. /**
  281. * @hidden
  282. * @return {boolean} if any menu is currently animating
  283. */
  284. MenuController.prototype.isAnimating = function () {
  285. return this._menus.some(function (menu) { return menu.isAnimating(); });
  286. };
  287. /**
  288. * @hidden
  289. */
  290. MenuController.prototype._register = function (menu) {
  291. (void 0) /* assert */;
  292. this._menus.push(menu);
  293. };
  294. /**
  295. * @hidden
  296. */
  297. MenuController.prototype._unregister = function (menu) {
  298. (void 0) /* assert */;
  299. util_1.removeArrayItem(this._menus, menu);
  300. };
  301. /**
  302. * @hidden
  303. */
  304. MenuController.prototype._setActiveMenu = function (menu) {
  305. (void 0) /* assert */;
  306. (void 0) /* assert */;
  307. // if this menu should be enabled
  308. // then find all the other menus on this same side
  309. // and automatically disable other same side menus
  310. var side = menu.side;
  311. this._menus
  312. .filter(function (m) { return m.side === side && m !== menu; })
  313. .map(function (m) { return m.enable(false); });
  314. };
  315. /**
  316. * @hidden
  317. */
  318. MenuController.registerType = function (name, cls) {
  319. menuTypes[name] = cls;
  320. };
  321. /**
  322. * @hidden
  323. */
  324. MenuController.create = function (type, menuCmp, plt) {
  325. return new menuTypes[type](menuCmp, plt);
  326. };
  327. return MenuController;
  328. }());
  329. exports.MenuController = MenuController;
  330. var menuTypes = {};
  331. });
  332. //# sourceMappingURL=menu-controller.js.map