WebVideo

WebVideo

new WebVideo()

Source:

Extends

Members

layer

Source:
Inherited From:
Sets the layer of the Thing and marks the sortInvalidated flag so any Graphics instances drawing it know to re-sort.

Methods

containsPoint(x, y) → {boolean}

Source:
Overrides:
Checks if the passed point is contained in the WebVideo.
Parameters:
Name Type Description
x number The x coordinate of the point being tested.
y number The y coordinate of the point being tested.
Returns:
Whether the passed point is contained in the WebVideo.
Type
boolean

describe()

Source:
Inherited From:
Describes the element for use with screen readers. This isn't something you should need to call manually, but you can if you'd like to print a text descriptino of the Thing.

draw(context)

Source:
Overrides:
Draws the WebVideo in the canvas.
Parameters:
Name Type Description
context CanvasRenderingContext2D Context to draw on.

focus()

Source:
Inherited From:
Focuses the element for use with screen readers. This isn't something you should need to call manually, but you can if you'd like to provide focus to an element even if it wasn't navigated to with the keyboard.

getAnchor() → {Object}

Source:
Inherited From:
Gets the element's anchor.
Returns:
Type
Object

getBorderColor() → {Color}

Source:
Inherited From:
Gets the border color of a Thing.
Example
// this method is on every Shape
let thing = new Thing();
thing.getBorderColor();
Returns:
The color of the Thing's border.
Type
Color

getBorderWidth() → {number}

Source:
Inherited From:
Gets the width of the Thing's border.
Example
// this method is on every Shape
let thing = new Thing();
thing.getBorderWidth();
Returns:
The width of the Thing's border.
Type
number

getBounds() → {Object}

Source:
Inherited From:
Get the elements bounds. This is an internal property that you shouldn't need to use, but it can be useful for doing quick calculations for the bounding box of a shape.
Example
// this method is on every Shape
let thing = new Thing();
let height = thing.getBounds().bottom - this.getBounds().top;
Returns:
Type
Object

getColor() → {Color}

Source:
Inherited From:
Gets the color of a Thing.
Example
// this method is on every Shape
let thing = new Thing();
thing.getColor(); // #000000, by default
Returns:
The destination y coordinate of this Thing.
Type
Color

getHeight() → {number}

Source:
Gets the height of the WebVideo.
Returns:
Height of the WebVideo.
Type
number

getType() → {string}

Source:
Inherited From:
Get the .type of the Thing
Returns:
Type
string

getWidth() → {number}

Source:
Gets the width of the WebVideo.
Returns:
Width of the WebVideo.
Type
number

getX() → {number}

Source:
Inherited From:
Gets the x position of the Thing.
Example
thing.x === thing.getX();
Returns:
The x position of the Thing.
Type
number

getY() → {number}

Source:
Inherited From:
Gets the y position of the Thing.
Example
thing.y === thing.getY();
Returns:
The y position of the Thing.
Type
number

hasBorder() → {boolean}

Source:
Inherited From:
Returns if a Thing has a border.
Example
// this method is on every Shape
let thing = new Thing();
thing.hasBorder();
Returns:
True if the Thing has a border.
Type
boolean

isFilled() → {boolean}

Source:
Inherited From:
Returns if a Thing is filled.
Example
// this method is on every Shape
let thing = new Thing();
thing.isFilled();
Returns:
True if the Thing is filled.
Type
boolean

isMuted() → {boolean}

Source:
Returns whether the WebVideo is currently muted.
Returns:
True if the video is muted, false if it is not.
Type
boolean

isPlaying() → {boolean}

Source:
Returns whether the WebVideo is currently playing.
Returns:
True if the video is playing, false if it is not.
Type
boolean

move(dx, dy)

Source:
Inherited From:
Changes the possition of a thing by a specified x and y amount.
Example
// this method is on every Shape
let thing = new Thing();
thing.move(10, 10);
Parameters:
Name Type Description
dx number The resulting change in the Thing's x position.
dy number The resulting change in the Thing's y position.

onReadyToPlay(fn)

Source:
Defines a function to call once the video has loaded enough and is ready to play.
Parameters:
Name Type Description
fn function A function to call when the video is ready to play.

pause()

Source:
Pauses the WebVideo.

play()

Source:
Starts playing the WebVideo.

rotate(degrees, angleUnit)

Source:
Inherited From:
Rotates a Thing an additional amount of degrees.
Example
// this method is on every Shape
let thing = new Thing();
thing.rotate(90);
thing.rotate(Math.PI / 2, Thing.RADIANS);
Parameters:
Name Type Description
degrees number The degrees to rotate degrees.
angleUnit number Whether it is degrees or radians. Defaults to degrees.

setAnchor(anchor)

Source:
Inherited From:
Sets the Anchor for the object. This alters how the shape will draw relative to its position. An anchor of 0, 0 will cause the shape to draw with its position at its top left corner. An anchor of 1, 1 will cause the shape to draw with its position at its bottom right corner.
Example
// this method is on every Shape
let thing = new Thing();
// center the object around its position
thing.setPosition({vertical: 0.5, horizontal: 0.5});
Parameters:
Name Type Description
anchor Object

setAutoplay(autoplay)

Source:
Sets whether the WebVideo should start playing automatically once loaded.
Parameters:
Name Type Description
autoplay boolean True/false whether the video should start playing automatically.

setBorder(hasBorder)

Source:
Inherited From:
Sets a Thing object to filled. Throws an error if an argument is not passed.
Example
// this method is on every Shape
let thing = new Thing();
thing.setBorder(true);
Parameters:
Name Type Description
hasBorder bool A boolean of whether or not Thing has a border.

setBorderColor(color)

Source:
Inherited From:
Sets the border color of a Thing. Throws an error if there are fewer than 1 params or if the param is undefined. This will automatically give the Thing a border, as if you had called thing.setBorder(true);
Example
// this method is on every Shape
let thing = new Thing();
thing.setBorderColor('orange');
Parameters:
Name Type Description
color Color The resulting color of the Thing's border.

setBorderWidth(width)

Source:
Inherited From:
Sets the width of a Thing's border. Throws an error if there is not 1 argument. This will automatically set the Thing to draw with a border, as if you had called thing.setBorder(true);
Example
// this method is on every Shape
let thing = new Thing();
thing.setBorderWidth(5);
Parameters:
Name Type Description
width number The resulting width of the Thing's border.

setColor(color)

Source:
Inherited From:
Sets the color of a Thing. Throws an error if there are fewer than 1 params or if the param is undefined.
Example
// this method is on every Shape
let thing = new Thing();
thing.setColor('red');
thing.setColor(Color.orange);
thing.setColor('#ff0000');
Parameters:
Name Type Description
color Color The resulting color of Thing.

setFilled(filled)

Source:
Inherited From:
Sets a Thing object to filled. Throws an error if an argument is not passed.
Example
// this method is on every Shape
let thing = new Thing();
thing.setFilled(false);
Parameters:
Name Type Description
filled bool A boolean of whether or not Thing is filled.

setLoop(loop)

Source:
Sets whether the WebVideo should loop and play again once finished.
Parameters:
Name Type Description
loop boolean True/false whether the video should loop.

setMuted(muted)

Source:
Sets whether the WebVideo is muted or not.
Parameters:
Name Type Description
muted boolean True/false whether the video should be muted.

setOpacity(opacity)

Source:
Inherited From:
Set the opacity of the Thing.
Example
// this method is on every Shape
let thing = new Thing();
thing.setOpacity(0.5);
Parameters:
Name Type Description
opacity number

setPosition(x, y)

Source:
Inherited From:
Sets the position of a Thing. Throws an error if there are fewer than 2 params or if they are not numbers.
Example
// this method is on every Shape
let thing = new Thing();
thing.setPosition(30, 30);
Parameters:
Name Type Description
x number The destination x coordinate of this Thing.
y number The destination y coordinate of this Thing.

setRotation(degrees, angleUnit)

Source:
Inherited From:
Sets the rotation of a Thing in degrees. Throws an error if there are fewer than 1 params or if they are not numbers.
Example
// this method is on every Shape
let thing = new Thing();
thing.setRotation(90);
thing.setRotation(Math.PI / 2, Thing.RADIANS);
Parameters:
Name Type Description
degrees number The degrees to rotate degrees.
angleUnit number Whether it is degrees or radians. Defaults to degrees.

setSize(width, height)

Source:
Sets the size of the WebVideo.
Parameters:
Name Type Description
width number The desired width of the resulting WebVideo.
height number The desired height of the resulting WebVideo.

setType(type)

Source:
Inherited From:
Set the .type of the Thing
Parameters:
Name Type Description
type string new type

stop()

Source:
Stops the WebVideo.

unfocus()

Source:
Inherited From:
Unfocuses the element for use with screen readers. This isn't something you should need to call manually, but you can if you'd like to unfocus to an element even if it wasn't navigated from with the keyboard.

WebVideo

new WebVideo(filename)

Source:
Constructs a WebVideo.
Example
const webCam = new WebVideo('WEBCAM');
Parameters:
Name Type Description
filename string

Members

layer

Source:
Inherited From:
Sets the layer of the Thing and marks the sortInvalidated flag so any Graphics instances drawing it know to re-sort.

Methods

containsPoint(x, y) → {boolean}

Source:
Overrides:
Checks if the passed point is contained in the WebVideo.
Parameters:
Name Type Description
x number The x coordinate of the point being tested.
y number The y coordinate of the point being tested.
Returns:
Whether the passed point is contained in the WebVideo.
Type
boolean

describe()

Source:
Inherited From:
Describes the element for use with screen readers. This isn't something you should need to call manually, but you can if you'd like to print a text descriptino of the Thing.

draw(context)

Source:
Overrides:
Draws the WebVideo in the canvas.
Parameters:
Name Type Description
context CanvasRenderingContext2D Context to draw on.

focus()

Source:
Inherited From:
Focuses the element for use with screen readers. This isn't something you should need to call manually, but you can if you'd like to provide focus to an element even if it wasn't navigated to with the keyboard.

getAnchor() → {Object}

Source:
Inherited From:
Gets the element's anchor.
Returns:
Type
Object

getBorderColor() → {Color}

Source:
Inherited From:
Gets the border color of a Thing.
Example
// this method is on every Shape
let thing = new Thing();
thing.getBorderColor();
Returns:
The color of the Thing's border.
Type
Color

getBorderWidth() → {number}

Source:
Inherited From:
Gets the width of the Thing's border.
Example
// this method is on every Shape
let thing = new Thing();
thing.getBorderWidth();
Returns:
The width of the Thing's border.
Type
number

getBounds() → {Object}

Source:
Inherited From:
Get the elements bounds. This is an internal property that you shouldn't need to use, but it can be useful for doing quick calculations for the bounding box of a shape.
Example
// this method is on every Shape
let thing = new Thing();
let height = thing.getBounds().bottom - this.getBounds().top;
Returns:
Type
Object

getColor() → {Color}

Source:
Inherited From:
Gets the color of a Thing.
Example
// this method is on every Shape
let thing = new Thing();
thing.getColor(); // #000000, by default
Returns:
The destination y coordinate of this Thing.
Type
Color

getHeight() → {number}

Source:
Gets the height of the WebVideo.
Returns:
Height of the WebVideo.
Type
number

getType() → {string}

Source:
Inherited From:
Get the .type of the Thing
Returns:
Type
string

getWidth() → {number}

Source:
Gets the width of the WebVideo.
Returns:
Width of the WebVideo.
Type
number

getX() → {number}

Source:
Inherited From:
Gets the x position of the Thing.
Example
thing.x === thing.getX();
Returns:
The x position of the Thing.
Type
number

getY() → {number}

Source:
Inherited From:
Gets the y position of the Thing.
Example
thing.y === thing.getY();
Returns:
The y position of the Thing.
Type
number

hasBorder() → {boolean}

Source:
Inherited From:
Returns if a Thing has a border.
Example
// this method is on every Shape
let thing = new Thing();
thing.hasBorder();
Returns:
True if the Thing has a border.
Type
boolean

isFilled() → {boolean}

Source:
Inherited From:
Returns if a Thing is filled.
Example
// this method is on every Shape
let thing = new Thing();
thing.isFilled();
Returns:
True if the Thing is filled.
Type
boolean

isMuted() → {boolean}

Source:
Returns whether the WebVideo is currently muted.
Returns:
True if the video is muted, false if it is not.
Type
boolean

isPlaying() → {boolean}

Source:
Returns whether the WebVideo is currently playing.
Returns:
True if the video is playing, false if it is not.
Type
boolean

move(dx, dy)

Source:
Inherited From:
Changes the possition of a thing by a specified x and y amount.
Example
// this method is on every Shape
let thing = new Thing();
thing.move(10, 10);
Parameters:
Name Type Description
dx number The resulting change in the Thing's x position.
dy number The resulting change in the Thing's y position.

onReadyToPlay(fn)

Source:
Defines a function to call once the video has loaded enough and is ready to play.
Parameters:
Name Type Description
fn function A function to call when the video is ready to play.

pause()

Source:
Pauses the WebVideo.

play()

Source:
Starts playing the WebVideo.

rotate(degrees, angleUnit)

Source:
Inherited From:
Rotates a Thing an additional amount of degrees.
Example
// this method is on every Shape
let thing = new Thing();
thing.rotate(90);
thing.rotate(Math.PI / 2, Thing.RADIANS);
Parameters:
Name Type Description
degrees number The degrees to rotate degrees.
angleUnit number Whether it is degrees or radians. Defaults to degrees.

setAnchor(anchor)

Source:
Inherited From:
Sets the Anchor for the object. This alters how the shape will draw relative to its position. An anchor of 0, 0 will cause the shape to draw with its position at its top left corner. An anchor of 1, 1 will cause the shape to draw with its position at its bottom right corner.
Example
// this method is on every Shape
let thing = new Thing();
// center the object around its position
thing.setPosition({vertical: 0.5, horizontal: 0.5});
Parameters:
Name Type Description
anchor Object

setAutoplay(autoplay)

Source:
Sets whether the WebVideo should start playing automatically once loaded.
Parameters:
Name Type Description
autoplay boolean True/false whether the video should start playing automatically.

setBorder(hasBorder)

Source:
Inherited From:
Sets a Thing object to filled. Throws an error if an argument is not passed.
Example
// this method is on every Shape
let thing = new Thing();
thing.setBorder(true);
Parameters:
Name Type Description
hasBorder bool A boolean of whether or not Thing has a border.

setBorderColor(color)

Source:
Inherited From:
Sets the border color of a Thing. Throws an error if there are fewer than 1 params or if the param is undefined. This will automatically give the Thing a border, as if you had called thing.setBorder(true);
Example
// this method is on every Shape
let thing = new Thing();
thing.setBorderColor('orange');
Parameters:
Name Type Description
color Color The resulting color of the Thing's border.

setBorderWidth(width)

Source:
Inherited From:
Sets the width of a Thing's border. Throws an error if there is not 1 argument. This will automatically set the Thing to draw with a border, as if you had called thing.setBorder(true);
Example
// this method is on every Shape
let thing = new Thing();
thing.setBorderWidth(5);
Parameters:
Name Type Description
width number The resulting width of the Thing's border.

setColor(color)

Source:
Inherited From:
Sets the color of a Thing. Throws an error if there are fewer than 1 params or if the param is undefined.
Example
// this method is on every Shape
let thing = new Thing();
thing.setColor('red');
thing.setColor(Color.orange);
thing.setColor('#ff0000');
Parameters:
Name Type Description
color Color The resulting color of Thing.

setFilled(filled)

Source:
Inherited From:
Sets a Thing object to filled. Throws an error if an argument is not passed.
Example
// this method is on every Shape
let thing = new Thing();
thing.setFilled(false);
Parameters:
Name Type Description
filled bool A boolean of whether or not Thing is filled.

setLoop(loop)

Source:
Sets whether the WebVideo should loop and play again once finished.
Parameters:
Name Type Description
loop boolean True/false whether the video should loop.

setMuted(muted)

Source:
Sets whether the WebVideo is muted or not.
Parameters:
Name Type Description
muted boolean True/false whether the video should be muted.

setOpacity(opacity)

Source:
Inherited From:
Set the opacity of the Thing.
Example
// this method is on every Shape
let thing = new Thing();
thing.setOpacity(0.5);
Parameters:
Name Type Description
opacity number

setPosition(x, y)

Source:
Inherited From:
Sets the position of a Thing. Throws an error if there are fewer than 2 params or if they are not numbers.
Example
// this method is on every Shape
let thing = new Thing();
thing.setPosition(30, 30);
Parameters:
Name Type Description
x number The destination x coordinate of this Thing.
y number The destination y coordinate of this Thing.

setRotation(degrees, angleUnit)

Source:
Inherited From:
Sets the rotation of a Thing in degrees. Throws an error if there are fewer than 1 params or if they are not numbers.
Example
// this method is on every Shape
let thing = new Thing();
thing.setRotation(90);
thing.setRotation(Math.PI / 2, Thing.RADIANS);
Parameters:
Name Type Description
degrees number The degrees to rotate degrees.
angleUnit number Whether it is degrees or radians. Defaults to degrees.

setSize(width, height)

Source:
Sets the size of the WebVideo.
Parameters:
Name Type Description
width number The desired width of the resulting WebVideo.
height number The desired height of the resulting WebVideo.

setType(type)

Source:
Inherited From:
Set the .type of the Thing
Parameters:
Name Type Description
type string new type

stop()

Source:
Stops the WebVideo.

unfocus()

Source:
Inherited From:
Unfocuses the element for use with screen readers. This isn't something you should need to call manually, but you can if you'd like to unfocus to an element even if it wasn't navigated from with the keyboard.