Front end of the Slack clone application.

toast.js 3.1KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. import { isPresent } from '../../util/util';
  2. import { PORTAL_TOAST } from '../app/app-constants';
  3. import { ToastCmp } from './toast-component';
  4. import { ToastMdSlideIn, ToastMdSlideOut, ToastSlideIn, ToastSlideOut, ToastWpPopIn, ToastWpPopOut } from './toast-transitions';
  5. import { ViewController } from '../../navigation/view-controller';
  6. /**
  7. * @hidden
  8. */
  9. export class Toast extends ViewController {
  10. constructor(app, opts = {}, config) {
  11. opts.dismissOnPageChange = isPresent(opts.dismissOnPageChange) ? !!opts.dismissOnPageChange : false;
  12. super(ToastCmp, opts, null);
  13. this._app = app;
  14. // set the position to the bottom if not provided
  15. if (!opts.position || !this.isValidPosition(opts.position)) {
  16. opts.position = TOAST_POSITION_BOTTOM;
  17. }
  18. this.isOverlay = true;
  19. config.setTransition('toast-slide-in', ToastSlideIn);
  20. config.setTransition('toast-slide-out', ToastSlideOut);
  21. config.setTransition('toast-md-slide-in', ToastMdSlideIn);
  22. config.setTransition('toast-md-slide-out', ToastMdSlideOut);
  23. config.setTransition('toast-wp-slide-out', ToastWpPopOut);
  24. config.setTransition('toast-wp-slide-in', ToastWpPopIn);
  25. }
  26. /**
  27. * @hidden
  28. */
  29. getTransitionName(direction) {
  30. let key = 'toast' + (direction === 'back' ? 'Leave' : 'Enter');
  31. return this._nav && this._nav.config.get(key);
  32. }
  33. /**
  34. * @hidden
  35. */
  36. isValidPosition(position) {
  37. return position === TOAST_POSITION_TOP || position === TOAST_POSITION_MIDDLE || position === TOAST_POSITION_BOTTOM;
  38. }
  39. /**
  40. * @param {string} message Toast message content
  41. */
  42. setMessage(message) {
  43. this.data.message = message;
  44. return this;
  45. }
  46. /**
  47. * @param {number} dur Toast message duration
  48. */
  49. setDuration(dur) {
  50. this.data.duration = dur;
  51. return this;
  52. }
  53. /**
  54. * @param {'top'|'middle'|'bottom'} pos Toast message position
  55. */
  56. setPosition(pos) {
  57. this.data.position = pos;
  58. return this;
  59. }
  60. /**
  61. * @param {string} cssClass Toast message CSS class
  62. */
  63. setCssClass(cssClass) {
  64. this.data.cssClass = cssClass;
  65. return this;
  66. }
  67. /**
  68. * @param {boolean} closeButton Toast message close button
  69. */
  70. setShowCloseButton(closeButton) {
  71. this.data.showCloseButton = closeButton;
  72. return this;
  73. }
  74. /**
  75. * Present the toast instance.
  76. *
  77. * @param {NavOptions} [navOptions={}] Nav options to go with this transition.
  78. * @returns {Promise} Returns a promise which is resolved when the transition has completed.
  79. */
  80. present(navOptions = {}) {
  81. navOptions.disableApp = false;
  82. navOptions.keyboardClose = false;
  83. return this._app.present(this, navOptions, PORTAL_TOAST);
  84. }
  85. /**
  86. * Dismiss all toast components which have been presented.
  87. */
  88. dismissAll() {
  89. this._nav && this._nav.popAll();
  90. }
  91. }
  92. const TOAST_POSITION_TOP = 'top';
  93. const TOAST_POSITION_MIDDLE = 'middle';
  94. const TOAST_POSITION_BOTTOM = 'bottom';
  95. //# sourceMappingURL=toast.js.map