import Box from 'newton-lib/src/elements/Box.js'

public class | source

Box

Extends:

WorldElement → Box

A Box allows for a window like object to be displayed in the world. This window object has the possibility to display text, labels and graphs, completely isolated from the settings of the world. A box object does not have a width or a height. Instead, it takes the dimensions of the objects it contains.

Constructor Summary

Public Constructor
public	constructor(opts: object)

Member Summary

Public Members
public	color: object Sets the color of the Box.
public	debug: boolean Flag for displaying debug rectangles around the elements inside the Box.
public	elements: Label[] \| Text[] \| Graph[] Sets an array where all elements inside the Box are stored.
public	height: number Sets the height of the Box in pixels.
public	isDraggable: boolean Flag for allowing the Box to be dragged around.
public	mouseMoveStyle: string Sets the move style of the Box to change by pixels rather than by units.
public	padding: object Sets the padding in pixels that the Box has.
public	title: string Sets the title for the Box.
public	width: number Sets the width of the Box in pixels.

Method Summary

Public Methods
public	addGraph(width: number, height: number, opts: object): Graph Adds a Graph to the Box.
public	addLabel(width: number, height: number, opts: object): Label Adds a Label to the Box.
public	addText(width: number, height: number, opts: object): Text Adds a Text to the Box.
public	calculateDimensions() Since the box takes the dimensions of the objects it contains, this function calculates these dimensions.
public	setPadding(top: number, right: number, bottom: number, left: number) Sets the padding of the Box object.

Private Methods
private	draw() Main draw function for the Box called by the World automatically.
private	isMouseOver(): boolean Tests if the mouse is over the box.

Inherited Summary

From class WorldElement
public	color: string Sets the color in HEX format of the element.
public	cursor: string Sets the cursor style when the mouse is over the element.
public	display: boolean Flag for enabling or diabling this element.
public	dragging: boolean Flag set when the element is being dragged around.
public	font: Font Sets the font of the element.
public	height: number Sets the current height of the element.
public	isDraggable: boolean Flag for allowing the element to be dragged around.
public	mouseMoveStyle: string Sets the move style of the element.
public	mouseOver: boolean Flag set when the mouse is over the element.
public	onMouseMove: function Sets a callback function for when the element is dragged around.
public	position: object Sets the position of the element.
public	renderer: Renderer Sets the renderer used for the element.
public	rotation: number Sets the rotation of the element.
public	savedZIndex: number A copy of the z-index value is stored here.
public	scale: number Sets the drawing scale of the element.
public	topmostOnDrag: boolean Flag for determining if the element will be a top-most element when dragged around.
public	valid: boolean Flag used to determine if an object is a child of WorldElement.
public	width: number Sets the current width of the element.
public	world: World Sets the world where this element is found.
public	zIndex: number Sets the z-index of the element.
public	addPosition(x: number, y: number) Adds the provided coordinates to the position.
public	draggable(s: boolean) Sets if the element is draggable.
public	isMouseOver(): boolean Function called when the mouse moves to check if the pointer is over the element.
public	setColor(c: string) Sets the color in HEX format of the element.
public	setPosition(x: number, y: number) Sets the position of the element.
public	setScale(s: number) Sets the scale of the element.
public	setZ(z: number) Sets the z-index of the element.
private	resize() Function called when the canvas gets resized.
private	setWorld(world: World) Sets the world object where element will be drawn.
private	topmost(state: boolean) Sets the element as a topmost element.

Public Constructors

public constructor(opts: object) source

Override:

WorldElement#constructor

Params:

Name	Type	Attribute	Description
opts	object	optional	Object that contains valid Box properties with values. Their values will be assigned at the end of the constructor. If an invalid property is passed then the value will be ignored.

Public Members

public color: object source

Sets the color of the Box. The color must have the format as in BOX_COLORS. The default value is BOX_COLORS.BLUE.

Override:

WorldElement#color

Properties:

Name	Type	Attribute	Description
BACKGROUND	string		Background color.
BORDER	string		Border color.

public debug: boolean source

Flag for displaying debug rectangles around the elements inside the Box. Default value is false.

public elements: Label[] | Text[] | Graph[] source

Sets an array where all elements inside the Box are stored. Default value is []

public height: number source

Sets the height of the Box in pixels. Default value is 0.

Override:

WorldElement#height

public isDraggable: boolean source

Flag for allowing the Box to be dragged around. Default value is true.

Override:

WorldElement#isDraggable

public mouseMoveStyle: string source

Sets the move style of the Box to change by pixels rather than by units. Default value is MOVE_STYLE.BY_PX.

Override:

WorldElement#mouseMoveStyle

public padding: object source

Sets the padding in pixels that the Box has.

Properties:

Name	Type	Attribute	Description
left	number	default: 10	Left padding in pixels.
bottom	number	default: 10	Bottom padding in pixels.
right	number	default: 10	Right padding in pixels.
top	number	default: 10	Top padding.

public title: string source

Sets the title for the Box. Default value is "".

public width: number source

Sets the width of the Box in pixels. Default value is 0.

Override:

WorldElement#width

Public Methods

public addGraph(width: number, height: number, opts: object): Graph source

Adds a Graph to the Box.

Params:

Name	Type	Attribute	Description
width	number		Width of the Graph in pixels.
height	number		Height of the Graph in pixels.
opts	object	optional	Object that contains valid Graph properties with values. Their values will be assigned at the end of the constructor. If an invalid property is passed then the value will be ignored.

Return:

Graph

Newly added Graph.

public addLabel(width: number, height: number, opts: object): Label source

Adds a Label to the Box.

Params:

Name	Type	Attribute	Description
width	number		Width of the Label in pixels.
height	number		Height of the Label in pixels.
opts	object	optional	Object that contains valid Label properties with values. Their values will be assigned at the end of the constructor. If an invalid property is passed then the value will be ignored.

Return:

Label

Newly added Label.

public addText(width: number, height: number, opts: object): Text source

Adds a Text to the Box.

Params:

Name	Type	Attribute	Description
width	number		Width of the Text in pixels.
height	number		Height of the Text in pixels.
opts	object	optional	Object that contains valid Text properties with values. Their values will be assigned at the end of the constructor. If an invalid property is passed then the value will be ignored.

Return:

Text	Newly added Text.

public calculateDimensions() source

Since the box takes the dimensions of the objects it contains, this function calculates these dimensions. The function must be called after setting the dimensions of the objects it contains.

public setPadding(top: number, right: number, bottom: number, left: number) source

Sets the padding of the Box object.

Params:

Name	Type	Attribute	Description
top	number		Top padding in pixels.
right	number		Right padding in pixels.
bottom	number		Bottom padding in pixels.
left	number		Left padding in pixels.

Private Methods

private draw() source

Main draw function for the Box called by the World automatically.

private isMouseOver(): boolean source

Tests if the mouse is over the box.

Override:

WorldElement#isMouseOver

Return:

boolean

True if the mouse is over the box, false otherwise.