Class: App

Constructor

new App()

Source: src/app/application.js, line 201

Example

// create the dwv app
const app = new dwv.App();
// initialise
const viewConfig0 = new dwv.ViewConfig('layerGroup0');
const viewConfigs = {'*': [viewConfig0]};
const options = new dwv.AppOptions(viewConfigs);
app.init(options);
// load dicom data
app.loadURLs([
  'https://raw.githubusercontent.com/ivmartel/dwv/master/tests/data/bbmri-53323851.dcm'
]);

Methods

abortAllLoads()

Abort all the current loads.

Source: src/app/application.js, line 802

abortLoad(dataId)

Abort an individual data load.

Parameters:

Name	Type	Description
`dataId`	string	The data to stop loading.

Source: src/app/application.js, line 814

addDataViewConfig(dataId, config)

Add a data view config.

Parameters:

Name	Type	Description
`dataId`	string	The data id.
`config`	ViewConfig	The view configuration.

Source: src/app/application.js, line 927

addEventListener(type, callback)

Add an event listener to this class.

Parameters:

Name	Type	Description
`type`	string	The event type.
`callback`	function	The function associated with the provided event type, will be called with the fired event.

Source: src/app/application.js, line 686

addNewImage(image, meta, source) → {string}

Add a new image.

Parameters:

Name	Type	Description
`image`	Image	The new image.
`meta`	object	The image meta.
`source`	string	The source of the new image, will be passed with load events.

Source: src/app/application.js, line 295

Returns:

The new image data id.

Type:: string

addToUndoStack(cmd)

Add a command to the undo stack.

Parameters:

Name	Type	Description
`cmd`	object	The command to add.

Source: src/app/application.js, line 512

Fires:

UndoStack#event:undoadd

applyJsonState(jsonState)

Apply a JSON state to this app.

Parameters:

Name	Type	Description
`jsonState`	string	The state of the app as a JSON string.

Source: src/app/application.js, line 1230

canScroll() → {boolean}

Can the data (of the active view of the active layer) be scrolled?

Deprecated: Please use the ViewController equivalent directly instead.
Source: src/app/application.js, line 380

Returns:

True if the data has a third dimension greater than one.

Type:: boolean

canWindowLevel() → {boolean}

Can window and level be applied to the data (of the active view of the active layer)?

Deprecated: Please use the ViewController equivalent directly instead.
Source: src/app/application.js, line 393

Returns:

True if the data is monochrome.

Type:: boolean

defaultOnKeydown(event)

Key down event handler example.

CRTL-Z: undo,
CRTL-Y: redo,
CRTL-ARROW_LEFT: next element on fourth dim,
CRTL-ARROW_UP: next element on third dim,
CRTL-ARROW_RIGHT: previous element on fourth dim,
CRTL-ARROW_DOWN: previous element on third dim.

Applies to the active view of the active layer group.

Parameters:

Name	Type	Description
`event`	KeyboardEvent	The key down event.

Source: src/app/application.js, line 1283

Fires:

fitToContainer()

Fit the display to the data of each layer group. To be called once the image is loaded.

Source: src/app/application.js, line 829

getActiveLayerGroup() → {LayerGroup|undefined}

Get the active layer group. The layer is available after the first loaded item.

Source: src/app/application.js, line 441

Returns:

The layer group.

Type:: LayerGroup | undefined

getAddedScale() → {Scalar3D}

Get the active layer group scale on top of the base scale.

Source: src/app/application.js, line 404

Returns:

The scale as {x,y,z}.

Type:: Scalar3D

getBaseScale() → {Scalar3D}

Get the base scale of the active layer group.

Source: src/app/application.js, line 413

Returns:

The scale as {x,y,z}.

Type:: Scalar3D

getCurrentStackIndex() → {number}

Get the current undo stack index.

Source: src/app/application.js, line 1431

Returns:

The stack index.

Type:: number

getDataIds() → {Array.<string>}

Get the list of ids in the data storage.

Source: src/app/application.js, line 360

Returns:

The list of data ids.

Type:: Array.<string>

getDataIdsFromSopUids(uids) → {Array.<string>}

Get the list of dataIds that contain the input UIDs.

Parameters:

Name	Type	Description
`uids`	Array.<string>	A list of UIDs.

Source: src/app/application.js, line 370

Returns:

The list of dataIds that contain the UIDs.

Type:: Array.<string>

getDataViewConfigs() → {Object.<string, Array.<ViewConfig>>}

Get the data view config. Carefull, returns a reference, do not modify without resetting.

Source: src/app/application.js, line 902

Returns:

The configuration list.

Type:: Object.<string, Array.<ViewConfig>>

getDrawLayersByDataId(dataId) → {Array.<DrawLayer>}

Get the draw layers associated to a data id. The layer are available after the first loaded item.

Parameters:

Name	Type	Description
`dataId`	string	The data id.

Source: src/app/application.js, line 472

Returns:

The layers.

Type:: Array.<DrawLayer>

getImage(dataId) → {Image|undefined}

Get the image.

Parameters:

Name	Type	Description
`dataId`	string	The data id.

Source: src/app/application.js, line 268

Returns:

The associated image.

Type:: Image | undefined

getJsonState() → {string}

Get the JSON state of the app.

Source: src/app/application.js, line 1220

Returns:

The state of the app as a JSON string.

Type:: string

getLayerGroupByDivId(divId) → {LayerGroup}

Get a layer group by div id. The layer is available after the first loaded item.

Parameters:

Name	Type	Description
`divId`	string	The div id.

Source: src/app/application.js, line 483

Returns:

The layer group.

Type:: LayerGroup

getMetaData(dataId) → {Object.<string, DataElement>|undefined}

Get the meta data.

Parameters:

Name	Type	Description
`dataId`	string	The data id.

Source: src/app/application.js, line 347

Returns:

The list of meta data.

Type:: Object.<string, DataElement> | undefined

getNumberOfLayerGroups() → {number}

Get the number of layer groups.

Source: src/app/application.js, line 492

Returns:

The number of groups.

Type:: number

getOffset() → {Scalar3D}

Get the layer offset of the active layer group.

Source: src/app/application.js, line 422

Returns:

The offset as {x,y,z}.

Type:: Scalar3D

getOverlayData(dataId) → {OverlayData|undefined}

Get the overlay data for a data id.

Parameters:

Name	Type	Description
`dataId`	string	The data id.

Source: src/app/application.js, line 1441

Returns:

The overlay data.

Type:: OverlayData | undefined

getStackSize() → {number}

Get the undo stack size.

Source: src/app/application.js, line 1422

Returns:

The size of the stack.

Type:: number

getStyle() → {object}

Get the app style.

Source: src/app/application.js, line 501

Returns:

The app style.

Type:: object

getToolboxController() → {ToolboxController}

Get the toolbox controller.

Source: src/app/application.js, line 431

Returns:

The controller.

Type:: ToolboxController

getViewConfig(dataId, groupDivId, excludeStarConfigopt) → {ViewConfig|undefined}

Get the layer group configuration for a data id and group div id.

Parameters:

Name	Type	Attributes	Description
`dataId`	string		The data id.
`groupDivId`	string		The layer group div id.
`excludeStarConfig`	boolean	<optional>	Exclude the star config (default to false).

Source: src/app/application.js, line 889

Returns:

The associated config.

Type:: ViewConfig | undefined

getViewConfigs(dataId, excludeStarConfigopt) → {Array.<ViewConfig>}

Get the layer group configuration from a data id.

Parameters:

Name	Type	Attributes	Description
`dataId`	string		The data id.
`excludeStarConfig`	boolean	<optional>	Exclude the star config (default to false).

Source: src/app/application.js, line 863

Returns:

The list of associated configs.

Type:: Array.<ViewConfig>

getViewLayersByDataId(dataId) → {Array.<ViewLayer>}

Get the view layers associated to a data id. The layer are available after the first loaded item.

Parameters:

Name	Type	Description
`dataId`	string	The data id.

Source: src/app/application.js, line 461

Returns:

The layers.

Type:: Array.<ViewLayer>

init(opt)

Initialise the application.

Parameters:

Name	Type	Description
`opt`	AppOptions	The application options.

Source: src/app/application.js, line 550

Example

// create the dwv app
const app = new dwv.App();
// initialise
const viewConfig0 = new dwv.ViewConfig('layerGroup0');
const viewConfigs = {'*': [viewConfig0]};
const options = new dwv.AppOptions(viewConfigs);
options.viewOnFirstLoadItem = false;
app.init(options);
// render button
const button = document.createElement('button');
button.id = 'render';
button.disabled = true;
button.appendChild(document.createTextNode('render'));
document.body.appendChild(button);
app.addEventListener('load', function () {
  const button = document.getElementById('render');
  button.disabled = false;
  button.onclick = function () {
    // render data #0
    app.render(0);
  };
});
// load dicom data
app.loadURLs([
  'https://raw.githubusercontent.com/ivmartel/dwv/master/tests/data/bbmri-53323851.dcm'
]);

initWLDisplay()

Init the Window/Level display (of the active layer of the active layer group).

Deprecated: Please set the opacity of the desired view layer directly.
Source: src/app/application.js, line 839

loadFiles(files)

Load a list of files. Can be image files or a state file.

Parameters:

Name	Type	Description
`files`	Array.<File>	The list of files to load.

Source: src/app/application.js, line 715

Fires:

loadFromUri(uri, optionsopt)

Load from an input uri.

Parameters:

Name	Type	Attributes	Description
`uri`	string		The input uri, for example: 'window.location.href'.
`options`	object	<optional>	Optional url request options.

Source: src/app/application.js, line 758

loadImageObject(data)

Load a list of ArrayBuffers.

Parameters:

Name	Type	Description
`data`	Array	The list of ArrayBuffers to load in the form of [{name: "", filename: "", data: data}].

Source: src/app/application.js, line 793

Fires:

loadURLs(urls, optionsopt)

Load a list of URLs. Can be image files or a state file.

Parameters:

Name Type Attributes Description

Name	Type	Attributes	Description
`urls`	Array.<string>		The list of urls to load.
`options`	object	<optional>	The options object, can contain: requestHeaders: an array of {name, value} to use as request headers, withCredentials: boolean xhr.withCredentials flag to pass to the request, batchSize: the size of the request url batch.

urls

Array.<string>

The list of urls to load.

options

object

The options object, can contain:

requestHeaders: an array of {name, value} to use as request headers,
withCredentials: boolean xhr.withCredentials flag to pass to the request,
batchSize: the size of the request url batch.

Source: src/app/application.js, line 741

Fires:

onKeydown(event)

Key down callback. Meant to be used in tools.

Parameters:

Name	Type	Description
`event`	KeyboardEvent	The key down event.

Source: src/app/application.js, line 1255

Fires:

App#event:keydown

onResize()

Handle resize: fit the display to the window. To be called once the image is loaded. Can be connected to a window 'resize' event.

Source: src/app/application.js, line 1244

redo()

Redo the last action.

Source: src/app/application.js, line 1413

Fires:

UndoStack#event:redo

removeDataViewConfig(dataId, divId)

Remove a data view config.

Parameters:

Name	Type	Description
`dataId`	string	The data id.
`divId`	string	The div id.

Source: src/app/application.js, line 959

removeEventListener(type, callback)

Remove an event listener from this class.

Parameters:

Name	Type	Description
`type`	string	The event type.
`callback`	function	The function associated with the provided event type.

Source: src/app/application.js, line 697

render(dataId, viewConfigsopt)

Render the current data.

Parameters:

Name	Type	Attributes	Description
`dataId`	string		The data id to render.
`viewConfigs`	Array.<ViewConfig>	<optional>	The list of configs to render.

Source: src/app/application.js, line 1111

reset()

Reset the application.

Source: src/app/application.js, line 657

resetDisplay()

Reset the display.

Source: src/app/application.js, line 1325

resetLayout()

Reset the layout of the application.

Source: src/app/application.js, line 674

resetZoom()

Reset the app zoom.

Source: src/app/application.js, line 1333

setActiveLayerGroup(index)

Set the active layer group.

Parameters:

Name	Type	Description
`index`	number	The layer group index.

Source: src/app/application.js, line 450

setColourMap(name)

Set the colour map of the active view of the active layer group.

Parameters:

Name	Type	Description
`name`	string	The colour map name.

Deprecated: Please use the ViewController equivalent directly instead.
Source: src/app/application.js, line 1343

setDataViewConfigs(configs)

Set the data view configuration. Resets the stage and recreates all the views.

Parameters:

Name	Type	Description
`configs`	Object.<string, Array.<ViewConfig>>	The configuration list.

Source: src/app/application.js, line 912

setDrawings(drawings, drawingsDetails)

Set the drawings of the active layer group.

Parameters:

Name	Type	Description
`drawings`	Array	An array of drawings.
`drawingsDetails`	Array	An array of drawings details.

Source: src/app/application.js, line 1200

setImage(dataId, img)

Set the image at the given id.

Parameters:

Name	Type	Description
`dataId`	string	The data id.
`img`	Image	The associated image.

Source: src/app/application.js, line 282

setImageSmoothing(flag)

Set the imageSmoothing flag value. Default is false.

Parameters:

Name	Type	Description
`flag`	boolean	True to enable smoothing.

Source: src/app/application.js, line 850

setLayerGroupsBinders(list)

Set the layer groups binders.

Parameters:

Name	Type	Description
`list`	Array.<string>	The list of binder names.

Source: src/app/application.js, line 1093

setOpacity(alpha)

Set the active view layer (of the active layer group) opacity.

Parameters:

Name	Type	Description
`alpha`	number	The opacity ([0:1] range).

Deprecated: Please set the opacity of the desired view layer directly.
Source: src/app/application.js, line 1188

setTool(tool)

Set the tool.

Parameters:

Name	Type	Description
`tool`	string	The tool.

Source: src/app/application.js, line 1368

setToolFeatures(list)

Set the tool live features.

Parameters:

Name	Type	Description
`list`	object	The list of features.

Source: src/app/application.js, line 1395

setWindowLevelPreset(preset)

Set the window/level preset of the active view of the active layer group.

Parameters:

Name	Type	Description
`preset`	string	The window/level preset.

Deprecated: Please use the ViewController equivalent directly instead.
Source: src/app/application.js, line 1356

toggleOverlayListeners(dataId)

Toggle overlay listeners.

Parameters:

Name	Type	Description
`dataId`	string	The data id.

Source: src/app/application.js, line 1454

translate(tx, ty)

Apply a translation to the layers of the active layer group.

Parameters:

Name	Type	Description
`tx`	number	The translation along X.
`ty`	number	The translation along Y.

Source: src/app/application.js, line 1176

undo()

Undo the last action.

Source: src/app/application.js, line 1404

Fires:

UndoStack#event:undo

updateDataViewConfig(dataId, divId, config)

Update an existing data view config. Removes and re-creates the layer if found.

Parameters:

Name	Type	Description
`dataId`	string	The data id.
`divId`	string	The div id.
`config`	ViewConfig	The view configuration.

Source: src/app/application.js, line 1010

zoom(step, cx, cy)

Zoom the layers of the active layer group.

Parameters:

Name	Type	Description
`step`	number	The step to add to the current zoom.
`cx`	number	The zoom center X coordinate.
`cy`	number	The zoom center Y coordinate.

Source: src/app/application.js, line 1161

Events

abort

Load abort event.

Type:

object

Properties

Name	Type	Description
`type`	string	The event type: abort.
`loadType`	string	The load type: image or state.
`source`	*	The load source: string for an url, File for a file.

Source: src/app/application.js, line 1658

error

Load error event.

Type:

object

Properties

Name	Type	Description
`type`	string	The event type: error.
`loadType`	string	The load type: image or state.
`source`	*	The load source: string for an url, File for a file.
`error`	object	The error.
`target`	object	The event target.

Source: src/app/application.js, line 1634

keydown

Key down event.

Type:

KeyboardEvent

Properties

Name	Type	Description
`type`	string	The event type: keydown.
`context`	string	The tool where the event originated.

Source: src/app/application.js, line 1256

load

Load event: fired when a load finishes successfully.

Type:

object

Properties

Name	Type	Description
`type`	string	The event type: load.
`loadType`	string	The load type: image or state.

Source: src/app/application.js, line 1595

loadend

Main load end event: fired when the load finishes, successfully or not.

Type:

object

Properties

Name	Type	Description
`type`	string	The event type: loadend.
`loadType`	string	The load type: image or state.
`source`	*	The load source: string for an url, File for a file.

Source: src/app/application.js, line 1613

loaditem

Load item event: fired when a load item is successfull.

Type:

object

Properties

Name	Type	Description
`type`	string	The event type: loaditem.
`loadType`	string	The load type: image or state.
`source`	*	The load source: string for an url, File for a file.
`data`	object	The loaded meta data.

Source: src/app/application.js, line 1554

loadprogress

Load progress event.

Type:

object

Properties

Name	Type	Description
`type`	string	The event type: loadprogress.
`loadType`	string	The load type: image or state.
`source`	*	The load source: string for an url, File for a file.
`loaded`	number	The loaded percentage.
`total`	number	The total percentage.