Sprite

Sprite

Class representing a Sprite. Sprites can be added to the Stage.

Constructor

new Sprite(options, options)

constructor - Creates a Sprite to be added to Stage.
Source:
Parameters:
Name Type Description
options object options for the sprite and/or options passed to costume. Alternatively an image URL. If a URL is provided default costume will be sized to image.
Name Type Description
pace number The number of milliseconds to wait for each paced method.
costume object A default Costume.
width number the costume width in pixels. Default is 100.
height number the costume height in pixels. Default is 100.
image string a URL (or data URL) for the costume image.
color string a css color string ('#ff0000', 'red').
options string a URL (or data URL) for the costume image.
Examples
let sprite = new blockLike.Sprite();
let sprite = new blockLike.Sprite({
  costume: new blockLike.Costume({
    width: 50,
    height: 50,
    color: '#A2DAFF',
    image: 'https://www.blocklike.org/images/sheep_step.png'
  })
});
let sprite = new blockLike.Sprite({
    width: 50,
    height: 50,
    color: '#A2DAFF',
    image: 'https://www.blocklike.org/images/sheep_step.png'
});
let confetti = new blockLike.Sprite('https://www.blocklike.org/images/confetti.svg');
let bareZeroSizedSprite = new blockLike.Sprite(null);

Extends

Methods

addClass(name)

addClass - adds a css class to sprite and all costumes.
Overrides:
Source:
Parameters:
Name Type Description
name string the css class name to add.
Example
let sprite = new blockLike.Sprite();

sprite.addClass('rainbow');

addCostume(costume)

addCostume - Adds a costume to the sprite
Source:
Parameters:
Name Type Description
costume object the costume to add.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let costume = new blockLike.Costume();

sprite.addTo(stage);
sprite.addCostume(costume);

addTo(stage)

addTo - Adds the sprite to the stage
Source:
Parameters:
Name Type Description
stage object which stage to add the sprite too.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);

ask(text)

ask - Creates an "ask bubble" over the sprite. Allows for an input box to be displayed to the user and capture user input into the variable specified by the user. Note - variable for answer must be declared in global scope.
Source:
Parameters:
Name Type Description
text string the text of the question
Example
//good:
let answer;
sprite.whenClicked( function() {
  answer = this.ask('Is the destiny of mankind decided by material computation?');
  this.say(answer);
});

// bad:
sprite.whenClicked( function() {
  let answer;
  answer = this.ask('Is the destiny of mankind decided by material computation?');
  this.say(answer);
});

broadcastMessage(msg)

broadcastMessage - dispatches a custom event that acts as a global message.
Overrides:
Source:
Parameters:
Name Type Description
msg string the named message (event)
Example
let stage = new blockLike.Stage();

stage.whenClicked(function() {
 stage.broadcastMessage('move')
});

broadcastMessageWait(msg)

broadcastMessageWait - dispatches a custom event that acts as a global message. Waits for all whenReceiveMessage listeners to complete.
Overrides:
Source:
Parameters:
Name Type Description
msg string the named message (event)
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);

sprite.whenReceiveMessage('move', function() {
  this.move(-10);
  this.wait(5);
})

stage.whenClicked(function() {
 stage.broadcastMessageWait('move');
 sprite.say('All done');
});

changePenSize(change)

changePenSize - Changes the size of the pen.
Source:
Parameters:
Name Type Description
change number the change in pixels.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.changePenSize(10);
});

changeSize(change)

changeSize - Changes the size of the sprite by specified percentage number.
Source:
Parameters:
Name Type Description
change number the percentage change.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.changeSize(50);

changeX(pixels)

changeX - Moves the sprite on the x axis a specified number of pixels.
Source:
Parameters:
Name Type Description
pixels number number of pixels to move.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.changeX(100);
});

changeY(pixels)

changeY - Moves the sprite on the y axis a specified number of pixels.
Source:
Parameters:
Name Type Description
pixels number number of pixels to move.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.changeY(100);
});

clone()

clone - Creates a clone of the sprite and triggers an event.
Source:
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  let clone = this.clone();
  clone.move(100);
  clone.addTo(stage);
});

css(prop, value)

css - applies a CSS rule to the sprite and all costumes.
Overrides:
Source:
Parameters:
Name Type Default Description
prop string the css property (e.g. color). Alternatively an object with key: value pairs.
value string null the value for the css property (e.g. #ff8833)
Example
let sprite = new blockLike.Sprite();

sprite.css('background', '#0000ff');

distanceTo(x, y) → {number}

distanceTo - Returns the distance to a point on the screen.
Source:
Parameters:
Name Type Description
x number the x coordinate.
y number the y coordinate.
Returns:
Type:
number
- distance in pixels to position on screen (not rounded).
Examples
let stage = new blockLike.Stage({sensing: true});
let sprite = new blockLike.Sprite();

sprite.addTo(stage);

stage.whenClicked( function() {
 sprite.say(this.distanceTo(this.mouseX, this.mouseY))
});
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let sprite = new blockLike.otherSprite();

sprite.addTo(stage);
otherSprite.addTo(stage);

stage.whenClicked( function() {
 sprite.say(this.distanceTo(otherSprite.x, otherSprite.y))
});

glide(sec, x, y)

glide - Moves the sprite for the specified number of seconds so it arrives at specified location when time is up. Provides smooth movement.
Source:
Parameters:
Name Type Description
sec number the number of seconds the whole movement will last (and will halt further execution for).
x number the x coordinate.
y number the y coordinate.
Examples
sprite.whenClicked( function() {
  this.glide(3, 100, 100);
});
sprite.whenClicked( function() {
  let time = 5;
  this.glide(time, 100, 100);
});

goTo(x, y)

goTo - Moves the sprite to specified location.
Source:
Parameters:
Name Type Description
x number the x coordinate.
y number the y coordinate.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.goTo(100, 100);
});

goTowards(sprite)

goTowards - Moves the sprite towards another sprite.
Source:
Parameters:
Name Type Description
sprite object the sprite to move to.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let otherSprite = new blockLike.Sprite();

sprite.addTo(stage);
otherSprite.addTo(stage);
otherSprite.move(100);
sprite.whenClicked( function() {
  this.goTowards(otherSprite);
});

hasClass(name) → {boolean}

hasClass - is the css class applied to the sprite and all costumes.
Overrides:
Source:
Parameters:
Name Type Description
name string the css class name.
Returns:
Type:
boolean
- is the css class name on the list.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.hasClass('rainbow') ? this.removeClass('rainbow') : this.addClass('rainbow');
});

hide()

hide - Hides the sprite. By default sprites are shown.
Source:
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.hide();

inner(el)

inner - Places an HTML element inside the current costume of the sprite.
Source:
Parameters:
Name Type Description
el object the DOM element.
Examples
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.inner('<p class="big centered rainbow">:)</p>');
sprite.inner('I like text only');

insert(el)

insert - Places a DOM element inside the current costume of the sprite.
Source:
Parameters:
Name Type Description
el object the DOM element.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.insert(document.getElementById('my-html-creation'));

invoke(func, argsArr)

invoke - invoke a function. Allows passing an argument or array of arguments. Function will be "paced" and code execution will be "waited" until it is completed.
Overrides:
Source:
Parameters:
Name Type Description
func function a function to rewrite and execute.
argsArr array an array of arguments to pass to the function. A single variable also accepted.
Example
sprite.whenFlag(() => {
  this.invoke(jump);
  this.invoke(talk, 'hi');
  this.invoke(pattern, [5, 50, 12]);
});

isTouching(sprite) → {boolean}

isTouching - Checks is this sprite touches another.
Source:
Parameters:
Name Type Description
sprite string the sprite to check if touching.
Returns:
Type:
boolean
- is the sprite touching the specified sprite.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let otherSprite = new blockLike.Sprite();

sprite.addTo(stage);
otherSprite.addTo(stage);
otherSprite.move(200);
sprite.whenClicked( function() {
 while(!this.isTouching(otherSprite)) {
   this.move(10);
  }
});

isTouchingBackdropColor(backdropColor) → {boolean}

isTouchingBackdropColor - compares a given hex value to all pixels in backdrop area covered by the sprite rectangle. If a match is found the color is returned. Notes: 1. This is based on rectangular collision detection. 2. This compares a naive rectangle, so if the sprite is rotated touching might be sensed early or late. 3. The backdrop image must be a local image served from same origin.
Source:
Parameters:
Name Type Description
backdropColor string the color to evaluate.
Returns:
Type:
boolean
- does the sprite touch the color.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
let moving = true;
sprite.whenClicked( function() {
  while(moving){
    this.isTouchingBackdropColor('#ff0000') ? moving = false : moving = true;
    this.move(5);
  }
});

isTouchingEdge() → {boolean}

isTouchingEdge - Checks is this sprite touches the edge. Notes: 1. This is based on rectangular collision detection. 2. this compares a naive rectangle, so if the sprite is rotated touching might be sensed early or late.
Source:
Returns:
Type:
boolean
- is the sprite touching the edge.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
 while(this.x < stage.width / 2) {
   this.move(10)
   this.say(this.isTouchingEdge());
  }
});

move(pixels)

move - Moves the sprite a specified number of pixels in the direction it is pointing.
Source:
Parameters:
Name Type Description
pixels number number of pixels to move.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.move(100, 100);
});

nextCostume()

nextCostume - Switches to the next costume.
Source:
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let costume = new blockLike.Costume();

sprite.addTo(stage);
sprite.addCostume(costume);
sprite.nextCostume();

penClear()

penClear - Clears the drawing surface.
Source:
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.penClear();
});

penDown()

penDown - "Activates" drawing by setting required values. When activated sprite motion will create the drawing on the stage's canvas.
Source:
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.penDown();
  this.move(100);
});

penUp()

penUp - "Deactivates" drawing by setting required values.
Source:
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.penDown();
  this.move(100);
  this.penUp();
});

playSound(url)

playSound - plays a sound file (mp3, wav)
Overrides:
Source:
Parameters:
Name Type Description
url string the url of the file to play.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.playSound('../../sounds/bleat.wav');
});

playSoundLoop(url)

playSoundLoop - plays a sound file (mp3, wav) again and again
Overrides:
Source:
Parameters:
Name Type Description
url string the url of the file to play.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.playSoundLoop('../../sounds/bleat.wav');
});

playSoundUntilDone(url)

playSoundUntilDone - plays a sound file (mp3, wav) until done. This is similar to playSound and wait for the duration of the sound.
Overrides:
Source:
Parameters:
Name Type Description
url string the url of the file to play.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.playSoundUntilDone('../../sounds/bleat.wav');
});

pointInDirection(deg)

pointInDirection - Points the sprite in a specified direction.
Source:
Parameters:
Name Type Description
deg number direction to point to.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.pointInDirection(45);
});

pointTowards(sprite)

pointTowards - Point the sprite towards another sprite.
Source:
Parameters:
Name Type Description
sprite object the sprite to move to.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let otherSprite = new blockLike.Sprite();

sprite.addTo(stage);
otherSprite.addTo(stage);
otherSprite.goTo(100, 100);
sprite.whenClicked( function() {
  this.pointTowards(otherSprite);
});

refresh()

refresh - Forces a sprite refresh. Note: service method to be used if costume was manipulated directly.
Source:

removeClass(name)

removeClass - removes a css class from the sprite and all costumes.
Overrides:
Source:
Parameters:
Name Type Description
name string the css class name to remove.
Example
let sprite = new blockLike.Sprite();

sprite.addClass('rainbow');
sprite.removeClass('rainbow');

removeCostume(costume)

removeCostume - Removes a costume.
Source:
Parameters:
Name Type Description
costume object the costume to remove.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let costume = new blockLike.Costume();

sprite.addTo(stage);
sprite.addCostume(costume);
sprite.removeCostume(costume);

removeCostumeNum(index)

removeCostumeNum - Removes the specified costume by number of current (0 is first). If there is only one costume, will fail and emit a console message.
Source:
Parameters:
Name Type Description
index number the costume to remove.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let costume = new blockLike.Costume();

sprite.addTo(stage);
sprite.addCostume(costume);
sprite.removeCostumeNum(1);

removeFrom()

removeFrom - Removes a sprite from the stage.
Source:
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.removeFrom(stage);

resizeToImage()

resizeToImage - sets the width and height of the sprite to that of the image file of current costume. Note: service method. Similar to calling resizeToImage() on costume and then refresh() on sprite.
Source:
Example
const sprite = new blockLike.Sprite(null);

const angrySheep = new blockLike.Costume({
  image: 'https://upload.wikimedia.org/wikipedia/commons/thumb/d/db/Emojione_1F411.svg/200px-Emojione_1F411.svg.png',
});
angrySheep.addTo(sprite);

sprite.resizeToImage();
sprite.addTo(stage);

say(text)

say - Creates a "speech bubble" over the sprite.
Source:
Parameters:
Name Type Description
text string the text inside the bubble.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.say('It is not the consciousness of men that determines their being, but, on the contrary, their social being that determines their consciousness.');

sayWait(text, sec)

sayWait - Creates a "speech bubble" over the sprite for a specified number of seconds.
Source:
Parameters:
Name Type Description
text string the text inside the bubble.
sec number the number of seconds to wait.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.sayWait('It is not the consciousness of men that determines their being, but, on the contrary, their social being that determines their consciousness.', 3);

setPenColor(colorString)

setPenColor - Sets the color of the pen.
Source:
Parameters:
Name Type Description
colorString string a valid color definition for canvas strokeStyle.
Examples
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.setPenColor('#ff0000')
sprite.setPenColor('red')

setPenSize(pixels)

setPenSize - Sets the size of the pen.
Source:
Parameters:
Name Type Description
pixels number a number for canvas lineWidth.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.setPenSize(10);

setRotationStyle(deg)

setRotationStyle - Sets one of three possible rotation styles: - 'no' / 2 - the sprites changes the direction in which it points without changing the sprites appearance. - 'left-right' / 1 - the sprite will flip horizontally when direction is between 180 and 360. - 'all' / 0 - the sprite will rotate around its center
Source:
Parameters:
Name Type Description
deg number number of degrees to turn.
Examples
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.setRotationStyle('left-right');
sprite.setRotationStyle(1);

setSize(percent)

setSize - Sets the size of the sprite to the specified percentage number.
Source:
Parameters:
Name Type Description
percent number the percentage to set.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.setSize(150);

setX(x)

setX - Places the sprite at the specified x position.
Source:
Parameters:
Name Type Description
x number the x coordinate
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.setX(100);
});

setY(y)

setY - Places the sprite at the specified y position.
Source:
Parameters:
Name Type Description
y number the y coordinate.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.setY(100);
});

show()

show - Shows the sprite. By default sprites are shown.
Source:
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.hide();
sprite.show();

stopSounds()

stopSounds - stops all sounds played by sprite or stage.
Overrides:
Source:
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.playSound('../../sounds/bleat.wav');
});

stage.whenKeyPressed('Escape', () => {
  this.stopSounds();
});

switchCostumeTo(backdrop)

switchCostumeTo - Switches to specified costume. If not found fails silently.
Source:
Parameters:
Name Type Description
backdrop object the costume to switch too.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let costume = new blockLike.Costume();

sprite.addTo(stage);
sprite.addCostume(costume);
sprite.switchCostumeTo(costume);

switchCostumeToNum(index)

switchCostumeToNum - Switches to specified costume by number of current (0 is first). If not found fails silently.
Source:
Parameters:
Name Type Description
index number the costume to switch too.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let costume = new blockLike.Costume();

sprite.addTo(stage);
sprite.addCostume(costume);
sprite.switchCostumeToNum(1);

think(text)

think - Creates a "think bubble" over the sprite.
Source:
Parameters:
Name Type Description
text string the text inside the bubble.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.think('I think therefore I am.');

thinkWait(text, sec)

thinkWait - Creates a "think bubble" over the sprite for a specified number of seconds.
Source:
Parameters:
Name Type Description
text string the text inside the bubble.
sec number the number of seconds to wait.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.thinkWait('I think therefore I am.', 3);

touching(sprite) → {string}

touching - Checks is this sprite touches another and returns at what side it touches. Notes: 1. this compares a naive rectangle, so if the sprite is rotated touching might be sensed early or late. 2. if the sprite has gone "into" the other the side "penetrated more" will be returned.
Source:
Parameters:
Name Type Description
sprite string the sprite to check if touching.
Returns:
Type:
string
- the side of the sprite that is touched (null, top, bottom, left, right)
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();
let otherSprite = new blockLike.Sprite();

sprite.addTo(stage);
otherSprite.addTo(stage);
otherSprite.move(200);
sprite.whenClicked( function() {
 while(!this.touching(otherSprite)) {
   this.move(10);
   this.say(this.touching(otherSprite))
  }
});

touchingBackdropColor() → {array}

touchingBackdropColor - Returns the hex value to all pixels in backdrop area covered by the sprite rectangle. Notes: 1. This is based on rectangular collision detection. 2. This compares a naive rectangle, so if the sprite is rotated touching might be sensed early or late. 3. The backdrop image must be a local image served from same origin.
Source:
Returns:
Type:
array
- colors (strings) touched.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  while(true){
    let touchedColors = this.touchingBackdropColor();
    this.say(touchedColors);
    this.move(5);
  }
});

touchingEdge() → {string}

touchingEdge - Checks is this sprite touches the edge of the stage and returns the edge touched. Notes: 1. This is based on rectangular collision detection. 2. this compares a naive rectangle, so if the sprite is rotated touching might be sensed early or late.
Source:
Returns:
Type:
string
- the side of the stage that is touched (null, top, bottom, left, right)
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
 while(this.x < stage.width / 2) {
   this.move(10)
   this.say(this.touchingEdge());
  }
});

turnLeft(deg)

turnLeft - Turns the sprite in a specified number of degrees to the left (counter-clockwise)
Source:
Parameters:
Name Type Description
deg number number of degrees to turn.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.turnLeft(45);
});

turnRight(deg)

turnRight - Turns the sprite in a specified number of degrees to the right (clockwise)
Source:
Parameters:
Name Type Description
deg number number of degrees to turn.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.turnRight(45);
});

wait(sec)

wait - creates a pause in execution.
Overrides:
Source:
Parameters:
Name Type Description
sec number number of seconds to wait. Must be an actual number.
Examples
this.wait(5);
let time = 5;
this.wait(time * 0.95);

whenClicked(func)

whenClicked - adds a click event listener to the sprite or stage. When triggered will invoke user supplied function.
Overrides:
Source:
Parameters:
Name Type Description
func function a function to rewrite and execute.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.say('I am alive');
});

whenCloned(func)

whenCloned - Adds a document level event listener triggered by a custom event. The custom event is triggered by the clone() method. When triggered will invoke user supplied function.
Source:
Parameters:
Name Type Description
func function a function to rewrite and execute.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenClicked( function() {
  this.clone();
});

sprite.whenCloned( function() {
  this.addTo(stage);
  this.glide(5, 100, 0);
});

whenEvent(eventStr, func)

whenEvent - adds the specified event listener to sprite/stage. When triggered will invoke user supplied function.
Overrides:
Source:
Parameters:
Name Type Description
eventStr string the named event (mosemove etc.).
func function a function to rewrite and execute.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenEvent('mouseover', (e) => {
  console.log(e);
});

whenFlag(func)

whenFlag - adds a flag to cover the stage with an event listener attached. When triggered will remove the flag div and invoke user supplied function.
Overrides:
Source:
Parameters:
Name Type Description
func function a function to rewrite and execute.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenFlag( function() {
  this.say('I am alive');
});

whenKeyPressed(userKey, func)

whenKeyPressed - adds a keypress event listener to document. When triggered will invoke user supplied function.
Overrides:
Source:
Parameters:
Name Type Description
userKey string the key pressed. may be the code or the character itself (A or 65)
func function a function to rewrite and execute.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenKeyPressed(' ', function() {
  this.say('Spacepressed');
});

whenLoaded(func)

whenLoaded - invoke user supplied function. To be used with code that needs to run onload.
Overrides:
Source:
Parameters:
Name Type Description
func function a function to rewrite and execute.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenLoaded( function() {
  this.say('I am alive');
});

whenReceiveMessage(msg, func)

whenReceiveMessage - adds the specified event listener to document. When triggered will invoke user supplied function.
Overrides:
Source:
Parameters:
Name Type Description
msg string the named message (event);
func function a function to rewrite and execute.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

sprite.addTo(stage);
sprite.whenReceiveMessage('move', function() {
  this.move(-10);
})