Classes


Class Wade_drawFunctions

Class Summary
Constructor Attributes Constructor Name and Description
 
The drawFunctions module contains a set of draw functions to use with WADE.
Method Summary
Method Attributes Method Name and Description
 
additive_(originalDrawCall)
Draw a sprite with additive blending.
 
alpha_(alpha, draw)
Draw a sprite multiplying its original transparency by a specified value
 
blink_(timeOn, timeOff, draw)
Draw a blinking sprite, using the specified draw function
 
boundingBox_(axisAlignedColor, orientedColor, originalDrawCall)
Draw the bounding boxes of the sprite
 
composite_(operation, originalDrawCall)
Draws using the specified global composite operation (see http://www.w3schools.com/tags/canvas_globalcompositeoperation.asp for reference)
 
drawRect_(color, borderWidth)
Draw a rectangle (borders only).
 
fadeOpacity_(alphaStart, alphaEnd, time, originalDrawCall, callback)
Draw a sprite, gradually changing its transparency over time.
 
flip_(originalDrawCall)
Draws a flipped image of the sprite (mirrored vertically)
 
gradientFill_(gradientDirection, colors)
Fill the sprite's bounding box with a linear color gradient
 
grid_(numCellsX, numCellsY, color, lineWidth)
Draw a grid with equally-spaced lines
 
mirror_(originalDrawCall)
Draws a mirror image of the sprite
 
radialGradientCircle_(colors, fadeOutColor)
Draw a circle with a radial gradient.
 
resizeOverTime_(startWidth, startHeight, endWidth, endHeight, time, originalDrawCall, callback)
Draw a sprite that changes size over time
 
resizePeriodically_(startWidth, startHeight, endWidth, endHeight, period, originalDrawCall)
Draw a sprite that changes size periodically over time
 
solidFade_(r0, g0, b0, a0, r1, g1, b1, a1, numFrames, callback)
Fill the sprite's bounding box with a color that transitions to another color over a specified number of frames
 
solidFill_(color)
Fill the sprite's bounding box with a solid color.
 
Fill the sprite's bounding box with a solid color, restricting all coordinates to integer numbers.
 
Make a sprite transparent (i.e.
Class Detail
Wade_drawFunctions()
The drawFunctions module contains a set of draw functions to use with WADE.
A common usage example is:
sprite.setDrawFunction(wade.drawFunctions.solidFill_('green'));
Method Detail
{function} additive_(originalDrawCall)
Draw a sprite with additive blending. In WebGL mode it will use a separate blend function (SRC_ALPHA, ONE, SRC_ALPHA, ONE)
Parameters:
{function} originalDrawCall Optional
The draw function to use
Returns:
{function} The draw function to use with Sprite.setDrawFunction()

alpha_(alpha, draw)
Draw a sprite multiplying its original transparency by a specified value
Parameters:
{number} alpha
The opacity to use when drawing the sprite
{function} draw
The draw function to use

blink_(timeOn, timeOff, draw)
Draw a blinking sprite, using the specified draw function
Parameters:
{number} timeOn
How many seconds the sprite should be displayed
{number} timeOff
How many seconds the sprite should be hidden
{function} draw
The draw function to use

{Function} boundingBox_(axisAlignedColor, orientedColor, originalDrawCall)
Draw the bounding boxes of the sprite
Parameters:
{string} axisAlignedColor Optional
The color to use for the axis-aligned bounding box. Default is 'red'
{string} orientedColor Optional
The color to use for the oriented bounding box. Default is 'blue'
{Function} originalDrawCall Optional
The original draw call of the sprite
Returns:
{Function} The draw function to use with Sprite.setDrawFunction()

{Function} composite_(operation, originalDrawCall)
Draws using the specified global composite operation (see http://www.w3schools.com/tags/canvas_globalcompositeoperation.asp for reference)
Parameters:
{string} operation
The global composite operation to use
{Function} originalDrawCall Optional
The original draw call of the sprite
Returns:
{Function} The draw function to use with Sprite.setDrawFunction()

{Function} drawRect_(color, borderWidth)
Draw a rectangle (borders only).
Parameters:
{string} color
An HTML color string, for example '#ffffff', '#fff', 'white', or 'rgba(255, 255, 255, 1)'
{number} borderWidth
The width of the border
Returns:
{Function} A draw function to use with a Sprite object

{function} fadeOpacity_(alphaStart, alphaEnd, time, originalDrawCall, callback)
Draw a sprite, gradually changing its transparency over time.
Parameters:
{number} alphaStart
The initial opacity, between 0 (transparent) and 1 (fully opaque)
{number} alphaEnd
The final opacity
{number} time
How many seconds the transition should last. Note that this won't be extremely accurate, as it ultimately depends on the actual frame rate of the app.
{function} originalDrawCall Optional
The draw function to use
{function} callback Optional
A function to execute when the transition is over
Returns:
{function} The draw function to use with Sprite.setDrawFunction()

{Function} flip_(originalDrawCall)
Draws a flipped image of the sprite (mirrored vertically)
Parameters:
{Function} originalDrawCall Optional
The original draw call of the sprite
Returns:
{Function} The draw function to use with Sprite.setDrawFunction()

{Function} gradientFill_(gradientDirection, colors)
Fill the sprite's bounding box with a linear color gradient
Parameters:
{Object} gradientDirection
An object whose 'x' and 'y' fields represent the gradient's direction. Note that this has to be a unit vector.
{Array} colors
An array of strings representing HTML colors. The array must contain at least 2 elements
Returns:
{Function} A draw function to use with a Sprite object

{Function} grid_(numCellsX, numCellsY, color, lineWidth)
Draw a grid with equally-spaced lines
Parameters:
{number} numCellsX
The number of horizontal cells
{number} numCellsY
The number of vertical cells
{string} color
A string representing an HTML color
{number} lineWidth Optional
The width of the lines, in world units. Default is 1
Returns:
{Function} A draw function to use with a Sprite object

{Function} mirror_(originalDrawCall)
Draws a mirror image of the sprite
Parameters:
{Function} originalDrawCall Optional
The original draw call of the sprite
Returns:
{Function} The draw function to use with Sprite.setDrawFunction()

{Function} radialGradientCircle_(colors, fadeOutColor)
Draw a circle with a radial gradient. The radius of the circle is calculated based on the size of the sprite's bounding box, and is half of the smaller dimension.
Parameters:
{Array} colors
An array of strings representing HTML colors. The array must contain at least 2 elements
{string} fadeOutColor Optional
the outer color to fade out to. Default is rgba(0, 0, 0, 0), which is transparent black.
Returns:
{Function} A draw function to use with a Sprite object

{Function} resizeOverTime_(startWidth, startHeight, endWidth, endHeight, time, originalDrawCall, callback)
Draw a sprite that changes size over time
Parameters:
startWidth
The initial width
startHeight
The initial height
endWidth
The final width
endHeight
The final height
time
The time it takes to change size, in seconds
originalDrawCall
The original draw function of the sprite
callback
A function to execute when it's finished changing size
Returns:
{Function} The draw function to use with Sprite.setDrawFunction()

{Function} resizePeriodically_(startWidth, startHeight, endWidth, endHeight, period, originalDrawCall)
Draw a sprite that changes size periodically over time
Parameters:
startWidth
The initial width
startHeight
The initial height
endWidth
The final width
endHeight
The final height
period
The time it takes to change size (from initial to final or viceversa), in seconds
originalDrawCall
The original draw call of the sprite
Returns:
{Function} The draw function to use with Sprite.setDrawFunction()

{Function} solidFade_(r0, g0, b0, a0, r1, g1, b1, a1, numFrames, callback)
Fill the sprite's bounding box with a color that transitions to another color over a specified number of frames
Parameters:
{number} r0
The red component of the first color. Valid values are integers between 0 and 255 included
{number} g0
The green component of the first color. Valid values are integers between 0 and 255 included
{number} b0
The blue component of the first color. Valid values are integers between 0 and 255 included
{number} a0
The alpha (opacity) component of the first color. Valid values are numbers between 0 and 1
{number} r1
The red component of the second color. Valid values are integers between 0 and 255 included
{number} g1
The green component of the second color. Valid values are integers between 0 and 255 included
{number} b1
The blue component of the second color. Valid values are integers between 0 and 255 included
{number} a1
The alpha (opacity) component of the second color. Valid values are numbers between 0 and 1
{number} numFrames
The duration of the transition between two colors, espressed as a frame count
{Function} callback Optional
A function to execute when the transition is complete
Returns:
{Function} A draw function to use with a Sprite object

{Function} solidFill_(color)
Fill the sprite's bounding box with a solid color.
Parameters:
{string} color
An HTML color string, for example '#ffffff', '#fff', 'white', or 'rgba(255, 255, 255, 1)'
Returns:
{Function} A draw function to use with a Sprite object

{Function} solidFillInt_(color)
Fill the sprite's bounding box with a solid color, restricting all coordinates to integer numbers. This may be needed for the drawing to work on some specific browsers, such as Chrome for Android
Parameters:
{string} color
An HTML color string, for example '#ffffff', '#fff', 'white', or 'rgba(255, 255, 255, 1)'
Returns:
{Function} A draw function to use with a Sprite object

{Function} transparent_()
Make a sprite transparent (i.e. - do not draw it)
Returns:
{Function} The draw function to use with Sprite.setDrawFunction()

Documentation generated by JsDoc Toolkit 2.4.0 on Tue Jul 12 2016 07:54:41 GMT+0100 (BST)