WidgetManager.js

import TextWidget from '../text-widget/model';
import ImageWidget from '../image-widget/model';

const WidgetT = {
  text: TextWidget,
  image: ImageWidget
};

export default class WidgetManager
{
  /**
   * Handle creation, administration and rendering of widgets
   */
  constructor($compile, assetStore)
  {
    this.$compile = $compile;
    this.assetStore = assetStore;
  }

  /**
   * Instantiate a widget given its type
   */
  async create(widgetData:object): Promise<object>
  {
    widgetData = await this.uploadWidgetAssets(widgetData);

    let T = WidgetT[widgetData.type];
    return new T(widgetData);
  }

  /**
   * Upload widget assets
   */
  async uploadWidgetAssets(widgetData:object): Promise<object>
  {
    if (widgetData.file) {
      let res = await this.assetStore.putAsset(
        'test', 'test', 'test', widgetData.file);

      widgetData.reference = res.data.reference;
    }

    return widgetData;
  }

  /**
   * Render the edit form for the widget
   */
  renderEditForm(type:string, scope:object): Element
  {
    return this.$compile(`<div edit-${type}-widget></div>`)(scope)[0];
  }

  /**
   * Render the widget
   */
  render(widget:object): Element
  {
    return this.$compile(`<div render-${widget.data.type}-widget></div>`)(widget)[0];
  }
}