All files / lib window.js

100% Statements 39/39
100% Branches 26/26
100% Functions 7/7
100% Lines 37/37
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 1016x                     30x 30x 30x 30x 30x 30x               4x 2x 2x                     6x 6x 2x   4x 2x 2x 2x     2x   2x                     24x 22x 18x 4x 2x   2x   20x               6x 2x   4x 4x 4x 4x               4x 2x   2x 2x 2x          
const config = { attributes: true, childList: true, subtree: true };
let observer;
/**
 * Class representing an iframe window from Contentstack UI. Not available for Custom Widgets.
 */
 
class Window {
  /**
   * @hideconstructor
   */
  constructor(connection, type, emitter, state = 'half_width') {
    this._connection = connection;
    this._autoResizingEnabled = false;
    this._resizingEnabled = false;
    this.type = type;
    this.state = state;
    this._emitter = emitter;
  }
 
  /**
   * This method activates the resize button that gives you the provision to resize the window size of your Dashboard Widget.
   * @return {external:Promise}  A promise object which will resolve when a resize button is visible on the Dashboard Widget.
   */
  enableResizing() {
    if (this.type !== 'DASHBOARD') { return Promise.resolve(); }
    this._resizingEnabled = true;
    return this._connection.sendToParent('window', { action: 'enableResizing' });
  }
 
 
  /**
   * This function executes the callback function whenever a Dashboard Widget extension is maximized or minimized. Only applicable on Dashboard Widget extensions.
   * @param {function} callback Function to be called when a Dashboard Widget extension is maximized or minimized
   * @return {boolean} Will return true
   */
 
  onDashboardResize(callback) {
    const windowObj = this;
    if (this.type !== 'DASHBOARD') {
      return false;
    }
    if (callback && typeof (callback) === 'function') {
      windowObj._emitter.on('dashboardResize', (event) => {
        windowObj.state = event.state;
        callback(event.state);
      });
    } else {
      throw Error('Callback must be a function');
    }
    return true;
  }
 
 
  /**
   * This method updates the extension height on Contentstack UI.
   * If the ‘height’ argument is not passed, it will calculate the scroll height and set the height of extension window accordingly.
   * @param {string|number} height Desired height of the iframe window
   * @return {external:Promise}  A promise object which will be resolved when Contentstack UI sends an acknowledgement stating that the height has been updated.
   */
  updateHeight(height) {
    if (this.type === 'DASHBOARD' && this.state === 'half_width') { return Promise.resolve(); }
    if (!height || isNaN(height)) {
      this._height = Math.ceil(document.documentElement.getBoundingClientRect().height);
    } else if (this._height === height) {
      return Promise.resolve();
    } else {
      this._height = height;
    }
    return this._connection.sendToParent('resize', this._height);
  }
 
  /**
   * This method enables auto resizing of the extension height.
   * @return {Window}.
   */
  enableAutoResizing() {
    if (this._autoResizingEnabled || (this.state === 'half_width' && this.type === 'DASHBOARD')) {
      return this;
    }
    this._autoResizingEnabled = true;
    observer = new MutationObserver(this.updateHeight.bind(this));
    observer.observe(window.document.body, config);
    return this;
  }
 
  /**
   * This method disables auto resizing of the extension height.
   * @return {Window}.
   */
  disableAutoResizing() {
    if (!this._autoResizingEnabled) {
      return this;
    }
    this._autoResizingEnabled = false;
    observer.disconnect();
    return this;
  }
}
 
export default Window;