fl-form-builder

ModuleCoordinator

class
new ModuleCoordinator()

The module coordinator contains all of the methods the consumer of the
application will need.

export default class ModuleCoordinator {
  constructor(modulePrefix, htmlContainer) {
    this.storage = new Storage();
    this.componentFabric = new ComponentFabric(modulePrefix);

    this.componentsContainer = new ComponentsContainer(modulePrefix);
    this.componentsContainer.on('change', this.pushHistoryState.bind(this));

    this.controlBar = new ControlBar(modulePrefix, this);
    this.htmlContainer = htmlContainer;

    Object.preventExtensions(this);
    this.htmlContainer.appendChild(this.controlBar.getHtmlContainer());
    this.htmlContainer.appendChild(this.componentsContainer.getHtmlContainer());
    this.pushHistoryState();
  }

  getComponentTypes() {
    return this.componentFabric.getComponentTypes();
  }

  createComponent(compName) {
    const newComponent = this.componentFabric.createComponent(compName);
    this.componentsContainer.addComponent(newComponent);
    this.pushHistoryState();
  }

  save() {
    const content = this.exportState();
    utils.fireEvent(this.htmlContainer, 'formBuilderSave', { formState: content });
  }

exportState

method
ModuleCoordinator.prototype.exportState()

Option name Type Description
return Array.<Object>

An array of objects that represents the current state of the application and which can be used to restore the application to that state.

Use this method to get the current state of the application

exportState() {
  const components = this.componentsContainer.getAllComponents();
  const outcome = [];
  for (const component of components) {
    outcome.push(component.exportState());
  }
  return outcome;
}

importState

method
ModuleCoordinator.prototype.importState()

Option name Type Description
state Array.<Object>
  • A state obtained previsously obtained.
return

Use this function to import a past saved state

importState(state = this.exportState(), registerInHistory = true) {
  this.componentsContainer.deleteAllComponents();

  const components = [];
  state.forEach(componentState => {
    const component = this.componentFabric.createComponent(componentState.type);
    component.importState(componentState);
    components.push(component);
  });

  this.componentsContainer.setComponents(components);
  if (registerInHistory) {
    this.pushHistoryState();
  }
}