Stage

Stage

Class representing a Stage.

Constructor

new Stage(options)

constructor - Creates a Stage.
Source:
Parameters:
Name Type Description
options object Options for the Stage.
Name Type Description
width number The stage width in pixels. Default is full window.
height number The stage height in pixels. Default is full window.
pace number The number of milliseconds to wait for each paced method. Will disable pacing when set to zero.
parent object The DOM element into which the stage will be inserted. Default is the body.
backdrop object A default Backdrop.
sensing boolean Enables sensing of mouse location and what keys pressed. If true, will constantly update stage properties: mouseX, mouseY, keysKeyCode, keysKeyCode and keysCode based on user input.
Examples
let stage = new blockLike.Stage();
let stage = new blockLike.Stage({
  width: 600,
  height: 400,
  pace: 16,
  sensing: true,
  parent: document.getElementById('stage-wrap'),
  backdrop: new blockLike.Backdrop({color: '#FFB6C1'})
});

Extends

Methods

addBackdrop(backdrop)

addBackdrop - Adds a backdrop to the stage
Source:
Parameters:
Name Type Description
backdrop object the backdrop to add.
Example
let stage = new blockLike.Stage();
let backdrop = new blockLike.Backdrop();

stage.addBackdrop(backdrop);

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');

addSprite(sprite)

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

stage.addSprite(sprite);

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');
});

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');

delete()

delete - Deletes the stage element.
Source:
Example
let stage = new blockLike.Stage();

stage.delete();

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');
});

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]);
});

isKeyPressed(userKey, func)

isKeyPressed - Checks if a key is pressed. Stage sensing must be enabled.
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.say(stage.isKeyPressed('a'));

nextBackdrop()

nextBackdrop - Switches to the next backdrop.
Source:
Example
let stage = new blockLike.Stage();
let backdrop = new blockLike.Backdrop();

stage.addBackdrop(backdrop);
stage.nextBackdrop();

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');
});

refresh()

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

removeBackdrop(backdrop)

removeBackdrop - Removes a backdrop.
Source:
Parameters:
Name Type Description
backdrop object the backdrop to remove.
Example
let stage = new blockLike.Stage();
let backdrop = new blockLike.Backdrop();

stage.addBackdrop(backdrop);
stage.removeBackdrop(backdrop);

removeBackdropNum(index)

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

stage.addBackdrop(backdrop);
stage.removeBackdropNum(1);

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');

removeSprite(sprite)

removeSprite - Removes a sprite from the stage
Source:
Parameters:
Name Type Description
sprite object the sprite to add.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

stage.addSprite(sprite);
stage.removeSprite(sprite);

sendSpriteBackwards(sprite)

sendSpriteBackwards - Moves the sprite one place down the "pile".
Source:
Parameters:
Name Type Description
sprite object the sprite to move.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

stage.addSprite(sprite);
stage.whenFlag( function() {
  this.sendSpriteBackwards(sprite);
});

sendSpriteForward(sprite)

sendSpriteForward - Moves the sprite one place up in the "pile".
Source:
Parameters:
Name Type Description
sprite object the sprite to move.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

stage.addSprite(sprite);
stage.whenFlag( function() {
  this.sendSpriteForward(sprite);
});

sendSpriteToBack(sprite)

sendSpriteToBack - Sends the sprite to the back of the "pile"
Source:
Parameters:
Name Type Description
sprite object the sprite to move.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

stage.addSprite(sprite);
stage.whenFlag( function() {
  this.sendSpriteToBack(sprite);
});

sendSpriteToFront(sprite)

sendSpriteToFront - Brings the sprite to the front of the "pile"
Source:
Parameters:
Name Type Description
sprite object the sprite to move.
Example
let stage = new blockLike.Stage();
let sprite = new blockLike.Sprite();

stage.addSprite(sprite);
stage.whenFlag( function() {
  this.sendSpriteToFront(sprite);
});

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();
});

switchBackdropTo(backdrop)

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

stage.addBackdrop(backdrop);
stage.switchBackdropTo(backdrop);

switchBackdropToNum(index)

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

stage.addBackdrop(backdrop);
stage.switchBackdropToNum(1);

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');
});

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);
})

zoom(percent)

zoom - zooms the stage to the specified percentage number.
Source:
Parameters:
Name Type Description
percent number the percentage to set.
Example
let stage = new blockLike.Stage();

stage.zoom(150);