Booty5

Class: App

b5. App

App

new b5.App(canvas, web_audio){b5.App}

core/app.js, line 143

App is the main application controller and is responsible for general housekeeping and b5.Scene processing, You should create a single instance of App object and assign it to b5.app. Scenes should then be created to hold your content then added to this instance of the app. App has the following features:

  • Manages global resources
  • Manages a collection of Scenes
  • Manages a collection of Action Lists
  • Manages an events manager for global events
  • Manages a task manager
  • Handles touch input and keyboard
  • Finds which Actor was touched when user touches / clicks the screen
  • Logic loop processing
  • Render loop processing
  • Manages global animation Timelines via a TimelineManager
  • Controls rescaling of canvas to best fit to different display sizes
  • Tracks time and measures frame rate

Examples

Example showing how to set up the main app:

 window.onload = function()
 {
     // Create the app
     var app = new b5.App(document.getElementById('mycanvas'));
     app.debug = false;
     app.setCanvasScalingMethod(b5.App.FitBest);
     // Start main loop
     app.start();
 };

Example showing how to set up the main app using a loading screen:

 window.onload = function()
 {
     // Create the app
     var app = new b5.App(document.getElementById('mycanvas'));
     app.debug = false;
     app.setCanvasScalingMethod(b5.App.FitBest);
     // Wait for resources to load then start app
     app.waitForResources();
 };

Adding a global app resource example

 var material = new b5.Material("static_bounce");
 material.restitution = 1;
 b5.app.addResource(material, "Material");

Finding a global app resource example

 var material = b5.app.findResource("static_bounce", "Material");

Destroying a global app resource example

 // If we do not have a reference to the resource then we can find and remove it
 b5.app.destroyResource("static_bounce", "Material");

 // If we already have reference to the material then we can destroy it through itself
 material.destroy();

Setting up a loading screen example

 // Set up a loading screen object
 b5.app.loading_screen = {
      background_fill: "#fffff",         // Loading background fill style
      background_image: "loading.png",   // Loading background image
      bar_background_fill: "#8080ff",    // Loading bar background fill style
      bar_fill: "#ffffff"                // Loading bar fill style
 };

For a complete overview of the App class see Booty5 App Overview

Name Type Description
canvas object

The HTML5 canvas that will receive the apps rendering
web_audio boolean

If true then web audio will be used if available
Properties:
Name Type Description
removals Array.<b5.Scene>

Array of scenes that were deleted last frame (internal)
timer object

Logic main loop timer (internal)
pixel_ratio number

Device pixel ratio (internal)
canvas_width number

The width of the virtual canvas (internal)
canvas_height number

The height of the virtual canvas (internal)
display_width number

The width of the rendering area (internal)
display_height number

The height of the rendering area (internal)
canvas_scale_method number

Virtual canvas scaling method (internal)
canvas_scale number

Canvas to client scaling (internal)
canvas_cx number

Canvas x axis centre on display (internal)
canvas_cy number

Canvas y axis centre on display (internal)
order_changed boolean

Set to true when scenes change order (internal)
last_time object

Time of last frame (internal)
scenes Array.<b5.Scene>

An array of all Scenes (internal)
canvas object

The HTML5 canvas (internal)
bitmaps Array.<b5.Bitmap>

Bitmap resources (internal)
brushes Array.<object>

Brush resources (internal)
shapes Array.<b5.Shape>

Shape resources (internal)
materials Array.<b5.Material>

Material resources (internal)
sounds Array.<b5.Sound>

Audio resources (internal)
avg_time number

Total time since last measure (internal)
avg_frame number

Counter used to measure average frame rate (internal)
touch_supported boolean

If true then touch input is supported
allow_touchables boolean

if true then app will search to find Actor that was touched (default is true)
touched boolean

true if the screen is being touched, false otherwise
touch_pos object

x, y position of last screen touch
touch_drag_x number

Amount touch position was last dragged on x axis
touch_drag_y number

Amount touch position was last dragged on y axis
focus_scene b5.Scene

Scene that has current input focus, if set via _focus_scene then instance of Scene or string based path to Scene can be used
focus_scene2 b5.Scene

Scene that has will receive touch events if focus scene does not process them, if set via _focus_scene2 then instance of Scene or string based path to Scene can be used
touch_focus b5.Actor

The Actor that has the current touch focus
dt number

Last frame time delta
avg_fps number

Average frames per second of app
total_loaded number

Total pre-loadable resources that have been loaded
total_load_errors number

Total pre-loadable resource load errors
target_frame_rate number

Frame rate at which to update the game (0 for measured) (default is 50)
adaptive_physics boolean

When true physics update will be ran more than once if frame rate falls below target (default is true)
debug boolean

Can be used to enable / disable debug trace info (default is false)
box2d boolean

True if Box2D module is present
timelines b5.TimelineManager

Global animation timeline manager
actions b5.ActionsListManager

Global actions list manager
events b5.EventsManager

Global events manager
tasks b5.TasksManager

Global tasks manager
loading_screen object

Loading screen object

Properties
Name Type Description
background_fill String

Loading screen background fill (default is #ffffff)
background_image String

Loading screen background image (default is loading.png)
bar_background_fill String

Loading screen loading bar background fill (default is #8080ff)
bar_fill String

Loading screen loading bar fill (default is #ffffff)
display b5.Display

Rendering module
clear_canvas boolean

If true then canvas will be cleared each frame (default is false)
use_web_audio boolean

If true then Web Audio will be used if its available (default is true)
Returns:
Type Description
b5.App The created App

Members

static,constantb5.App.FitBest

The canvas is resized to fit the client area. Rendering is scaled to fit either the x or y axis depending on which retains most information.

static,constantb5.App.FitGreatest

The canvas is resized to fit the greatest of the client areas axis.

static,constantb5.App.FitNone

No scaling of rendering or resizing of canvas.

static,constantb5.App.FitSize

The canvas is resized to fit the client area. rendering is not scaled.

static,constantb5.App.FitSmallest

The canvas is resized to fit the smallest of the client areas axis.

static,constantb5.App.FitX

The canvas is resized to fit the client area. Rendering is scaled to fit best on the x-axis.

static,constantb5.App.FitY

The canvas is resized to fit the client area. Rendering is scaled to fit best on the y-axis.

Methods

addResource(resource, type)

core/app.js, line 572

Adds a resource to the global app resource manager

Name Type Description
resource object

The resource to add
type string

Type of resource to add (brush, sound, shape, material, bitmap or geometry)

addScene(scene){object}

core/app.js, line 499

Adds a scene to this App for processing and display

Name Type Description
scene b5.Scene

The scene to add
Returns:
Type Description
object The added scene

countResourcesNeedLoading(include_scenes){number}

core/app.js, line 634

Returns how many resources that are marked as preloaded still need to be loaded

Name Type Description
include_scenes boolean

If true then resources within scenes will also be counted
Returns:
Type Description
number Number of resources that still need to loaded

dirty()

core/app.js, line 870

Dirties the scene and all child actors transforms, forcing them to be rebuilt

draw()

core/app.js, line 750

Renders the app and all of its contained scenes

findHitActor(position){b5.Actor}

core/app.js, line 857

Searches all touchable actors in all app scenes to see if the supplied position hits them

Name Type Description
position object

The position to hit test
Returns:
Type Description
b5.Actor The actor that was hit or null for no hit

findResource(name, type){object}

core/app.js, line 611

Searches the global app resource manager for the named resource

Name Type Description
name string

Name of resource to find
type string

Type of resource to add (brush, sound, shape, material, bitmap or geometry)
Returns:
Type Description
object The found resource or null if not found

findScene(name){b5.Scene}

core/app.js, line 552

Searches this App for the named scene

Name Type Description
name string

Name of the scene to find
Returns:
Type Description
b5.Scene The found scene object or null for scene not found

removeResource(resource, type)

core/app.js, line 587

Removes a resource from the global app resource manager

Name Type Description
resource object

The resource to remove
type string

Type of resource to add (brush, sound, shape, material, bitmap or geometry)

removeScene(scene)

core/app.js, line 510

Removes the specified scene from the app destroying it. Note that the scene is not removed immediately, instead it is removed when the end of the frame is reached

Name Type Description
scene b5.Scene

The scene to add

setCanvasScalingMethod(method)

core/app.js, line 882

Sets the method of scaling rendering to the canvas and how the canvas fits to the client area

Name Type Description
method number

The method of scaling to use, can be b5.App.FitNone, b5.App.FitX, b5.App.FitY, b5.App.FitBest, b5.App.FitSize, b5.App.FitGreatest or b5.App.FitSmallest

start()

core/app.js, line 842

Starts the app running

update(dt)

core/app.js, line 765

Updates the app and all of its contained scenes

Name Type Description
dt number

The amount of time that has passed since this app was last updated

waitForResources()

core/app.js, line 690

Waits for all preloaded resources to load before starting the app, also displays a loading screen and loading bar. Use this in place of calling app.start() directly.