Class: App

new App()

Main application class.

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

Example

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

Methods

abortLoad()

Abort the current load.

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

addEventListener(type, callback)

Add an event listener to this class.

Parameters:

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

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

addNewImage(image, meta) → {number}

Add a new image.

Parameters:

Name	Type	Description
`image`	dwv.image.Image	The new image.
`meta`	object	The image meta.

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

Returns:

The new image id.

Type:: number

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 285

Fires:

dwv.tool.UndoStack#event:undoadd

canScroll() → {boolean}

Can the data be scrolled?

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

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?

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

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

Parameters:

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

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

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 555

getActiveLayerGroup() → {dwv.gui.LayerGroup}

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

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

Returns:

The layer group.

Type:: dwv.gui.LayerGroup

getAddedScale() → {object}

Get the layer scale on top of the base scale.

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

Returns:

The scale as {x,y}.

Type:: object

getBaseScale() → {object}

Get the base scale.

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

Returns:

The scale as {x,y}.

Type:: object

getCurrentStackIndex() → {number}

Get the current undo stack index.

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

Returns:

The stack index.

Type:: number

getDataViewConfig() → {object}

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

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

Returns:

The configuration list.

Type:: object

getDrawLayersByDataIndex(index) → {Array}

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

Parameters:

Name	Type	Description
`index`	number	The data index.

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

Returns:

The layers.

Type:: Array

getElement(_name) → {object}

Get a HTML element associated to the application.

Parameters:

Name	Type	Description
`_name`	string	The name or id to find.

Deprecated: Yes
Source: src/app/application.js, line 432

Returns:

The found element or null.

Type:: object

getImage(index) → {dwv.image.Image}

Get the image.

Parameters:

Name	Type	Description
`index`	number	The data index.

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

Returns:

The associated image.

Type:: dwv.image.Image

getLastImage() → {dwv.image.Image}

Get the last loaded image.

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

Returns:

The image.

Type:: dwv.image.Image

getLayerGroupByDivId(divId) → {dwv.gui.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 257

Returns:

The layer group.

Type:: dwv.gui.LayerGroup

getMetaData(index) → {object}

Get the meta data.

Parameters:

Name	Type	Description
`index`	number	The data index.

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

Returns:

The list of meta data.

Type:: object

getNumberOfLayerGroups() → {number}

Get the number of layer groups.

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

Returns:

The number of groups.

Type:: number

getNumberOfLoadedData() → {number}

Get the number of loaded data.

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

Returns:

The number.

Type:: number

getOffset() → {object}

Get the layer offset.

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

Returns:

The offset.

Type:: object

getStackSize() → {number}

Get the undo stack size.

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

Returns:

The size of the stack.

Type:: number

getState() → {object}

Get the JSON state of the app.

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

Returns:

The state of the app as a JSON object.

Type:: object

getStyle() → {object}

Get the app style.

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

Returns:

The app style.

Type:: object

getToolboxController() → {object}

Get the toolbox controller.

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

Returns:

The controller.

Type:: object

getViewLayersByDataIndex(index) → {Array}

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

Parameters:

Name	Type	Description
`index`	number	The data index.

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

Returns:

The layers.

Type:: Array

init(opt)

Initialise the application.

Parameters:

Name Type Description

Name	Type	Description
`opt`	object	The application option with: `dataViewConfigs`: data indexed object containing the data view configurations in the form of a list of objects containing: divId: the HTML div id orientation: optional 'axial', 'coronal' or 'sagittal' orientation string (default undefined keeps the original slice order) `binders`: array of layerGroup binders `tools`: tool name indexed object containing individual tool configurations in the form of a list of objects containing: options: array of tool options `viewOnFirstLoadItem`: boolean flag to trigger the first data render after the first loaded data or not `defaultCharacterSet`: the default chraracter set string used for DICOM parsing

opt

object

The application option with:

dataViewConfigs: data indexed object containing the data view configurations in the form of a list of objects containing:
- divId: the HTML div id
- orientation: optional 'axial', 'coronal' or 'sagittal' orientation string (default undefined keeps the original slice order)
binders: array of layerGroup binders
tools: tool name indexed object containing individual tool configurations in the form of a list of objects containing:
- options: array of tool options
viewOnFirstLoadItem: boolean flag to trigger the first data render after the first loaded data or not
defaultCharacterSet: the default chraracter set string used for DICOM parsing

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

Example

// create the dwv app
var app = new dwv.App();
// initialise
app.init({
  dataViewConfigs: {'*': [{divId: 'layerGroup0'}]},
  viewOnFirstLoadItem: false
});
// render button
var button = document.createElement('button');
button.id = 'render';
button.disabled = true;
button.appendChild(document.createTextNode('render'));
document.body.appendChild(button);
app.addEventListener('load', function () {
  var 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

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

loadFiles(files)

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

Parameters:

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

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

Fires:

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 538

Fires:

loadURLs(urls, options)

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

Parameters:

Name Type Description

Name	Type	Description
`urls`	Array	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

urls

Array

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 518

Fires:

onKeydown(event)

Key down callback. Meant to be used in tools.

Parameters:

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

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

Fires:

dwv.App#event:keydown

redo()

Redo the last action

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

Fires:

dwv.tool.UndoStack#event:redo

removeEventListener(type, callback)

Remove an event listener from this class.

Parameters:

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

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

render(dataIndex)

Render the current data.

Parameters:

Name	Type	Description
`dataIndex`	number	The data index to render.

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

reset()

Reset the application.

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

resetDisplay()

Reset the display

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

resetLayout()

Reset the layout of the application.

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

resetZoom()

Reset the app zoom.s

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

setColourMap(colourMap)

Set the colour map.

Parameters:

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

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

setDataViewConfig(configs)

Set the data view configuration (see the init options for details).

Parameters:

Name	Type	Description
`configs`	object	The configuration list.

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

setDrawings(drawings, drawingsDetails)

Set the drawings on the current stage.

Parameters:

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

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

setImage(index, img)

Set the image at the given index.

Parameters:

Name	Type	Description
`index`	number	The data index.
`img`	dwv.image.Image	The associated image.

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

setLastImage(img)

Set the last image.

Parameters:

Name	Type	Description
`img`	dwv.image.Image	The associated image.

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

setLayerGroupsBinders(list)

Set the layer groups binders.

Parameters:

Name	Type	Description
`list`	Array	The binders list.

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

setOpacity(alpha)

Set the image layer opacity.

Parameters:

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

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

setTool(tool)

Set the tool

Parameters:

Name	Type	Description
`tool`	string	The tool.

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

setToolFeatures(list)

Set the tool live features.

Parameters:

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

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

setWindowLevelPreset(preset)

Set the window/level preset.

Parameters:

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

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

translate(tx, ty)

Apply a translation to the layers.

Parameters:

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

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

undo()

Undo the last action

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

Fires:

dwv.tool.UndoStack#event:undo

zoom(step, cx, cy)

Zoom to the layers.

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 707

(inner) addViewLayer(dataIndex, dataViewConfig)

Add a view layer.

Parameters:

Name	Type	Description
`dataIndex`	number	The data index.
`dataViewConfig`	object	The data view config.

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

(inner) createLayerGroups(dataViewConfigs)

Create layer groups according to a data view config: adds them to stage and bind them.

Parameters:

Name	Type	Description
`dataViewConfigs`	object	The data view config.

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

(inner) getViewConfigs(dataIndex) → {Array}

Get the layer group configuration from a data index. Defaults to div id 'layerGroup' if no association object has been set.

Parameters:

Name	Type	Description
`dataIndex`	number	The data index.

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

Returns:

The list of associated configs.

Type:: Array

Events

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 791

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 1087

loadabort

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 1151

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 1106

loaderror

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 1128

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 1052

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.