vid-webpack-master/src/app/shared/components/messageBox/messageBox.component.ts

   1 /************************************************************************************************
   2  * @Component: Message box component
   3  * In order to use component you need to do a number of things:
   4  *  1) Inside your component constructor you need to add listener to the button trigger.
   5  *  2) Inside the listener you should write your callback logic.
   6  *
   7  *  Example:
   8  *   @Component({
   9  *    selector : 'some-component'
  10  *    ...
  11  *   })
  12  *
  13  *   export class SomeComponent {
  14  *      openModal() : void {
  15  *        let messageBoxData : MessageBoxData = new MessageBoxData(
  16  *            "title",  // modal title
  17  *            "message", ModalType.alert, // modal type
  18   *           [
  19                 {text:"Save", size:"'x-small'",  callback: this.someFunction.bind(this), closeModal:true},
  20                 {text:"Cancel", size:"'x-small'", closeModal:true}
  21           ]);
  22  *
  23  *        MessageBoxService.openModal.next(messageBoxData); // open modal
  24  *      }
  25  *   }
  26
  27  ************************************************************************************************/
  28
  29
  30 import { Component } from '@angular/core';
  31 import { MessageBoxData} from './messageBox.data';
  32 import { MessageBoxService } from './messageBox.service';
  33 import { SdcUiComponents } from 'sdc-ui/lib/angular';
  34
  35 @Component({
  36   selector: 'message-box',
  37   template: '<div id="message-box"></div>'
  38 })
  39
  40 export class MessageBoxComponent {
  41   modalService: SdcUiComponents.ModalService;
  42
  43   constructor(modalService: SdcUiComponents.ModalService, private _messageBoxService : MessageBoxService) {
  44     this.modalService = modalService;
  45     MessageBoxService.openModal.subscribe((messageBoxData: MessageBoxData) => {
  46       modalService.openModal(this._messageBoxService.setConfig(messageBoxData))
  47     });
  48   }
  49 }
  50