new DisplayObject(viewer, dom, classNameopt)
A display object is a visual element which has width / height and coordianate x / y in space.
It's a way to create and manipulate a div element, many other class inherit from this one.
It's a way to create and manipulate a div element, many other class inherit from this one.
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
viewer |
FORGE.Viewer | FORGE.Viewer reference. | |
dom |
Element | HTMLElement | Use a specific dom element to be the display object, if undefined a div will be created. | |
className |
string |
<optional> |
The className of the object as long as many other object inherits from this one. |
- Source:
- To Do:
-
- Define a better behavior for anchors / margins. If we set a top and a bottom anchor what happen ?
- Do the last anchor have the priority ? Does the DisplayObject will change its height if a top and a bottom anchors are set ?
- Remove the _borderUpdate, at least find a way to do it properly ?!
Extends
Members
(readonly) alive :boolean
Get the alive flag value of the object.
Type:
- boolean
- Inherited From:
- Source:
alpha :number
Get and set the left alpha of this display object. (between 0 and 1).
Type:
- number
- Source:
background :string
Get and set the backgound CSS value of this display object.
Type:
- string
- Source:
borderColor :string
Get and set the border-color CSS value of this display object.
Type:
- string
- Source:
borderRadius :number
Get and set the border-radius CSS value of this display object.
Type:
- number
- Source:
borderStyle :string
Get and set the border-style CSS value of this display object.
Type:
- string
- Source:
borderWidth :number
Get and set the border-width CSS value of this display object.
Type:
- number
- Source:
(nullable) bottom :number
Get and set the bottom anchor of this display object.
Type:
- number
- Source:
(readonly) className :string
Get the class name of the object.
Type:
- string
- Inherited From:
- Source:
data :*
Get and set any custom data you want to associate to this object.
Type:
- *
- Inherited From:
- Source:
debug :boolean
Get and set the debug flag.
Type:
- boolean
- Inherited From:
- Source:
(readonly) dom :Element|HTMLElement
Get the dom element that compose this display object.
Type:
- Element | HTMLElement
- Source:
(readonly) drag :FORGE.Drag
Get the FORGE.Drag object that handles drag events for this display object.
Type:
- Source:
fullscreen :boolean
Set the fullscreen property of this display object.
Type:
- boolean
- Source:
(readonly) globalOffset :Object
Get the global offset
Type:
- Object
- Source:
height :number|string
Get and set the height of this display object.
The getter will always return a number, but you can pass to the setter either a number like 10 or a string like "10px" or "10%".
Type:
- number | string
- Source:
horizontalCenter :boolean
Get and set the horizontal center status of this display object.
Type:
- boolean
- Source:
id :string
Get and set the id of this display object.
Type:
- string
- Source:
index :number
Get and set the index value of this display object. This is the z-index CSS property.
Type:
- number
- Source:
(readonly) innerHeight :number
Get the inner height in pixels (understand height without borders) of this DisplayObject.
Type:
- number
- Source:
(readonly) innerWidth :number
Get the inner width (understand width without borders) of this DisplayObject.
Type:
- number
- Source:
keepRatio :boolean
Get and set the keepRatio status of this display object.
Type:
- boolean
- Source:
(nullable) left :number
Get and set the left anchor of this display object.
Type:
- number
- Source:
maximized :boolean
Get and set the maximized status of this display object.
Type:
- boolean
- Source:
(readonly) onAddedToDom :FORGE.EventDispatcher
Get the "onAddedToDom" FORGE.EventDispatcher of this display object.
Type:
- Source:
(readonly) onAddedToParent :FORGE.EventDispatcher
Get the "onAddedToParent" FORGE.EventDispatcher of this display object.
Type:
- Source:
(readonly) onBorderChange :FORGE.EventDispatcher
Get the "onBorderResize" FORGE.EventDispatcher of this display object.
Type:
- Source:
(readonly) onDestroy :FORGE.EventDispatcher
Get the onDestroy FORGE.EventDispatcher, this event is emitted at the end of the destroy sequence.
Type:
- Inherited From:
- Source:
(readonly) onFullscreenEnter :FORGE.EventDispatcher
Get the "onFullscreenEnter" FORGE.EventDispatcher of this display object.
Type:
- Source:
(readonly) onFullscreenExit :FORGE.EventDispatcher
Get the "onFullscreenExit" FORGE.EventDispatcher of this display object.
Type:
- Source:
(readonly) onHide :FORGE.EventDispatcher
Get the "onHide" FORGE.EventDispatcher of this display object.
Type:
- Source:
(readonly) onMove :FORGE.EventDispatcher
Get the "onMove" FORGE.EventDispatcher of this display object.
This event is triggered when object's coordinate (x, y) changed.
This event is triggered when object's coordinate (x, y) changed.
Type:
- Source:
(readonly) onReady :FORGE.EventDispatcher
Get the "onReady" FORGE.EventDispatcher of this display object.
Type:
- Source:
(readonly) onResize :FORGE.EventDispatcher
Get the "onResize" FORGE.EventDispatcher of this display object.
Type:
- Source:
(readonly) onShow :FORGE.EventDispatcher
Get the "onShow" FORGE.EventDispatcher of this display object.
Type:
- Source:
parent :FORGE.DisplayObjectContainer
Get and set the parent of this display object.
Type:
- Source:
- To Do:
-
- Find a clean way to identify DisplayObjectContainer and other class that inherits from.
percentHeight :number
Get and set the height of this display object in percent only.
Type:
- number
- Source:
percentWidth :number
Get and set the width of this display object in percent only.
Type:
- number
- Source:
pixelHeight :number
Get and set the height of this display object in pixel only.
Type:
- number
- Source:
pixelWidth :number
Get and set the width of this display object in pixel only.
Type:
- number
- Source:
(readonly) pointer :FORGE.Pointer
Get the FORGE.Pointer object that handles mouse and touch events for this display object.
Type:
- Source:
(readonly) ready :boolean
Get the ready status of this display object.
Type:
- boolean
- Source:
(nullable) right :number
Get and set the right anchor of this display object.
Type:
- number
- Source:
rotation :number
Get and set the rotation of this display object. (in degree).
Type:
- number
- Source:
(readonly) tags :Array
Get the tags associated to this object.
Type:
- Array
- Inherited From:
- Source:
tooltip :string
Get and set the tooltip value of this display object. This is the title dom property.
Type:
- string
- Source:
(nullable) top :number
Get and set the top anchor of this display object.
Type:
- number
- Source:
(readonly) uid :string
Get the uid of the object.
Type:
- string
- Inherited From:
- Source:
unitHeight :string
Get and set the height unit of this display object.
Type:
- string
- Source:
unitWidth :string
Get and set the width unit of this display object.
Type:
- string
- Source:
verticalCenter :boolean
Get and set the vertical center status of this display object.
Type:
- boolean
- Source:
visible :boolean
Get and set the visibility of this display object.
Type:
- boolean
- Source:
warning :boolean
Get and set the warning flag.
Type:
- boolean
- Inherited From:
- Source:
width :number|string
Get and set the width of this display object.
The getter will always return a number, but you can pass to the setter either a number like 10 or a string like "10px" or "10%".
Type:
- number | string
- Source:
x :number
Get and set the x position of this display object.
Type:
- number
- Source:
y :number
Get and set the y position of this display object.
Type:
- number
- Source:
Methods
destroy()
Destroy method.
- Overrides:
- Source:
fullscreenEnter()
Request a fullscreen enter on this display object.
- Source:
fullscreenExit()
Request a fullscreen exit on this display object.
- Source:
hide()
Hide this display object.
- Source:
isFullscreen() → {boolean}
Know if this display object is in fullscreen
- Source:
Returns:
- Type
- boolean
isInDom() → {boolean}
Method to know if a display object is in dom.
- Source:
Returns:
Returns true if the display Object is in DOM, false if not.
- Type
- boolean
log(value)
Basic log method, log a string in the console if debug is enabled.
Parameters:
Name | Type | Description |
---|---|---|
value |
* | The value you want to log in the console. |
- Inherited From:
- Source:
maximize(keepMaximized)
Maximize the size of this display object to the size of its parent.
Parameters:
Name | Type | Description |
---|---|---|
keepMaximized |
boolean | Set this param to true if you want that this display object auto resize to max when its parent is resized. |
- Source:
resize(width, height)
Resize this display object to a given width / height.
Parameters:
Name | Type | Description |
---|---|---|
width |
number | string | The width you want to set, it can be for example 10, "10px" or "10%". |
height |
number | string | The height you want to set, it can be for example 10, "10px" or "10%". |
- Source:
show()
Show this display object.
- Source:
toggleVisibility()
Toggles th visibility of this display object.
- Source:
warn(valuenullable)
Basic warn method, log a warn string in the console if warning is enabled.
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
value |
string | Object |
<nullable> |
The value you want to warn in the console. |
- Inherited From:
- Source: