Graphic.Window Class
This class represent a window associated to a canvas element. It's the first class used in Graphic module, wrapping all graphic objects.
//From an existing canvas
var win = new Window(document.getElementById('myCanvas'));
win.draw();
//Creating a new canvas tag
var win = new Window();
document.body.appendChild(win.canvas);
win.draw();
Constructor
Graphic.Window
-
[canvas]
Parameters:
-
[canvas]HTMLCanvasElement optionalmain canvas for the window. by default, a new canvas is created.
Item Index
Methods
Methods
addChild
-
graphicObject
This method will allow you to add a child to the current Layer.
Parameters:
-
graphicObjectGraphicObjectthis parameter must be a valid GraphicObject, otherwise the method will have an undefined behavior.
draw
()
Draw all graphic elements on the associated canvas.
notifyParentChange
()
protected
This method notify the parent that a change has been done, and that it should clear his cache.
onChange
-
[child]
This method will be called when a child is changed. By using this method it will notice the current Layer to redraw the local canvas.
This method is called automatically when a child object change. You can call this method for clear internal cache.
Parameters:
-
[child]GraphicObject optionalthis object represent the child who has been changed.
rmChild
-
graphicObject
This method will allow you to remove a child from the current Layer.
Parameters:
-
graphicObjectGraphicObjectthis parameter is the GraphicObject that the method will try to find inside the child of the current layer.
rotate
-
angle
This method allow you to rotate the Graphical object around the center point of the GraphicalObject.
Parameters:
-
angleNumberrepresent the angle of rotation, it's expressed in degree.
scale
-
x -
y
this method allow you to do a scale on the GraphicObject.
Parameters:
-
xNumberthis is the x scale factor
-
yNumberthis is the y scale factor
setAttr
-
attrs
Setter availlable for updating attibuts and correctly clear the caches. You can set all attributes supported by this instance (see the GraphicObject constructor for common available properties)
Parameters:
-
attrsObjectLayer attributs. See the constructor for more details.
Example:
object.setAttr({
width: 20,
height: 20
});
object.setAttr({
pos: {
x: 0,
y: 0
}
});
skew
-
a -
b
This method allow you to do a skew transform on the GraphicObject.
Parameters:
-
aNumberthe factor of skew on the y axis
-
bNumberthe factor of skew on the x axis
translate
-
x -
y
This method allow you to translate the GraphicalObject, Internally this method modify the GraphicObject's matrix.
Parameters:
-
xNumberthis is the translation scalar of the x axis.
-
yNumberthis is the translation scalar of the y axis.
update
()
This method will allow you to update the layer and all the childs within the layer.
Properties
_needToRedraw
Boolean
private
indicate when the cache must be updated.
alpha
Number
value of opacity, between 0.0 (fully transparent) and 1.0 (opaque)
camera
Camera
camera of the layer.
Note: this property should be modified only with setAttr.
canvas
HTMLCanvasElement
The HTML canvas element.
By default, a new canvas is created (and can be displayed to screen).
centerPoint
Object
default center of all matrix transformations.
values are exprimed depending on the size of the object. 0;0 is the up-left corner.
Sub-properties:
-
xObject -
yObject
height
Number
localContext
CanvasRenderingContext2D
All layers use a local 2D context canvas for rendering object. It is used as a cache layer, and redrawn only when needed.
Directly set the cache context can be usefull for debug.
Note: this property should be modified only with setAttr.
matrix
Matrix
matrix applied to this object before draw.
parent
Layer
parent containing this object.
spatialContainer
SpatialContainer
Note: this property should be modified only with setAttr.
width
Number
x
Number
position on X axis
y
Number
position on Y axis
zIndex
Number
zIndex, used to determine the drawing order. Hight zIndex are drawn first.