AbstractImageBuilder

This AbstractImageBuilder class provides all the basic methods that an ImageBuilder
could need and almost all the methods an ImageBuilder must implement.

constructor({queryDataModel, pipelineModel, lookupTableManager, handleRecord=false, dimensions=[500,500] })

Keep track of any provided model and create the controlWidgets based on the set of valid ones.

update()

Standard implementation of data fetching using the queryDataModel instance if any.

if(this.queryDataModel) {
    this.queryDataModel.fetchData();
}

onImageReady(callback) : subscription

Register callback for when the image builder finished its image rendering.

imageReady(readyImage)

Method that will trigger the ImageReady notification with the provided object.

registerSubscription(subscription)

Helper method used to automatically subscription.unsubscribe() any registered subscription
when this.destroy() get called.

registerObjectToFree(obj)

Helper method used to automatically obj.destroy() any registered object
when this.destroy() get called.

getListeners() : listeners

Return the QueryDataModel MouseListener if a queryDataModel instance
was provided at the creation.

getControlWidgets() : controlWidgets

Return the control widgets for [ QueryDataModel, PipelineModel, LookupTableManager ]
for only those who were provided at the creation.

getControlModels() : controlModels

Return the following set of objects.

{
    pipelineModel : this.pipelineModel,
    queryDataModel: this.queryDataModel,
    lookupTableManager: this.lookupTableManager,
    dimensions: this.dimensions
}

destroy()

Will free the registered resources.

Source

(IB) ImageBuilder.md

# ImageBuilder Specifications

An ImageBuilder has a goal to build an Image from any kind of data and should
notify its Observer when the actual generated image is ready to be accessed either
for rendering or further processing by another ImageBuilder for example like the
MagicLens one.

## Expected methods

### update()

Request the fetching of new data to render. The render() method will naturally
be called once the data became available.

### render()

Request to generate a new image based on the current set of data loaded.

### destroy()

Free any internal resources.

### onImageReady(callback) : subscription

Register callback to be aware when the image became ready.
The profile of the callback should be as follow:

```js
function( data, envelope ) {
    // The data can be one of those two kinds

    // - Image based
    var data = {
        url: 'data:image/png:ASDGFsdfgsdgf...',
        builder: this
    };

    // - Canvas based (Recommended)
    var data = {
        canvas: DOMElement,
        imageData: ImageDataFromCanvas,
        area: [0, 0, width, height],
        outputSize: [width, height],
        builder: this
    };

getListeners() : listeners

Return listeners for MouseHandler.

getControlWidgets() : controlWidgets

Return a set of widgets description that should be build in order to control
the given image builder.

getControlModels() : controlModels

Return a set of control handle for driving the image builder.

Abstract Implementation

The Abstract implementation of the ImageBuilder provide standard implementation
of most of the methods and just leave out the render() one.

update()

Will simply call fetchData() on the internal QueryDataModel instance.

destroy()

Will unsubscribe any registered subscription and destroy and registered object
while turning off() any associated notification callback.

This should be used along with those methods:

• registerSubscription(subscription)
• registerObjectToFree(obj)

onImageReady(callback) : subscription

Should be used in conjunction with the imageReady(readyImage) method when
you want to publish a new imageReady object.

getListeners()

Will return the MouseListener of the QueryDataModel instance if any.

getControlWidgets()

Will return control widgets for LookupTableManager, PipelineMode, QueryDataModel if provided.

getControlModels()

Return any provided model using the following structure.

return {
    pipelineModel : this.pipelineModel,
    queryDataModel: this.queryDataModel,
    lookupTableManager: this.lookupTableManager,
    dimensions: this.dimensions
};

``` js index.js
import Monologue from 'monologue.js';

const IMAGE_READY_TOPIC = 'image-ready';

export default class AbstractImageBuilder {
  // ------------------------------------------------------------------------

  constructor({
    queryDataModel,
    pipelineModel,
    lookupTableManager,
    handleRecord = false,
    dimensions = [500, 500],
  }) {
    this.queryDataModel = queryDataModel;
    this.pipelineModel = pipelineModel;
    this.lookupTableManager = lookupTableManager;
    this.handleRecord = handleRecord;
    this.subscriptions = [];
    this.objectsToFree = [];
    this.dimensions = dimensions;

    this.controlWidgets = [];
    if (this.lookupTableManager) {
      this.controlWidgets.push({
        name: 'LookupTableManagerWidget',
        lookupTableManager,
      });
    }
    if (this.pipelineModel) {
      this.controlWidgets.push({
        name: 'CompositeControl',
        pipelineModel,
      });
    }
    if (this.queryDataModel) {
      this.controlWidgets.push({
        name: 'QueryDataModelWidget',
        queryDataModel,
      });
    }
  }

  // ------------------------------------------------------------------------

  update() {
    if (this.queryDataModel) {
      this.queryDataModel.fetchData();
    }
  }

  // ------------------------------------------------------------------------

  onImageReady(callback) {
    return this.on(IMAGE_READY_TOPIC, callback);
  }

  // ------------------------------------------------------------------------

  imageReady(readyImage) {
    this.emit(IMAGE_READY_TOPIC, readyImage);
  }

  // ------------------------------------------------------------------------

  registerSubscription(subscription) {
    this.subscriptions.push(subscription);
  }

  // ------------------------------------------------------------------------

  registerObjectToFree(obj) {
    this.objectsToFree.push(obj);
  }

  // ------------------------------------------------------------------------

  getListeners() {
    return this.queryDataModel ? this.queryDataModel.getMouseListener() : {};
  }

  // ------------------------------------------------------------------------

  // Method meant to be used with the WidgetFactory
  getControlWidgets() {
    return this.controlWidgets;
  }

  // ------------------------------------------------------------------------

  getControlModels() {
    return {
      pipelineModel: this.pipelineModel,
      queryDataModel: this.queryDataModel,
      lookupTableManager: this.lookupTableManager,
      dimensions: this.dimensions,
    };
  }

  // ------------------------------------------------------------------------

  destroy() {
    this.off();

    while (this.subscriptions.length) {
      this.subscriptions.pop().unsubscribe();
    }

    while (this.objectsToFree.length) {
      this.objectsToFree.pop().destroy();
    }

    this.queryDataModel = null;
    this.pipelineModel = null;
    this.lookupTableManager = null;
    this.dimensions = null;
    this.controlWidgets = null;
  }
}

// Add Observer pattern using Monologue.js
Monologue.mixInto(AbstractImageBuilder);