apex-app

For creating interactive apps using *pixi.js*.

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
apex-app
006.1.26 years ago7 years agoMinified + gzip package size for apex-app in KB

Readme

apex-app

For creating interactive apps using pixi.js.

Example App

Particle Sandbox
URL: http://particlesandbox.com
GitHub: https://github.com/apexearth/particle-sandbox
App Class: https://github.com/apexearth/particle-sandbox/blob/develop/app/ParticleSandbox.js#L25

Basic Usage

  1. Create an App.
  2. Add AppObjects to it.
  3. Create a renderer for the App.
  4. The renderer starts the update & draw loop, rendering the App.

const {
   App,
   AppObject,
   createRenderer,
   PIXI,
   setting,
   properties,
   property
} = require('apex-app')

// Extend App
// Initialize with a single AppObject drawn as a white square.
class Game extends App {
   constructor() {
       super()
       let obj = new AppObject({parent: this})
       obj.graphics.beginFill(0xffffff, 1)
       obj.graphics.drawRect(0, 0, 10, 10)
       obj.graphics.endFill()
       this.add(obj)
   }
}

// Create renderer and attach canvas to `document.body`.
createRenderer(new Game(), {
   rendererOptions: {
       backgroundColor: 0x333333
   }
})

App

The core app containing the update loop.
Kind: global class
* [new App(options)](#new_App_new)
* _instance_
    * [.type](#App+type) : <code>string</code>
    * [.objects](#App+objects) : <code>Array.<AppObject></code>
    * [.view](#App+view)
    * [.position](#App+position) ⇒ <code>App.container.position</code> \| <code>Object</code>
    * [.scale](#App+scale) ⇒ <code>App.container.scale</code> \| <code>Object</code>
    * [.targetScale](#App+targetScale) ⇒ <code>Object</code>
    * [.screenWidth](#App+screenWidth) ⇒ <code>Number</code>
    * [.screenHeight](#App+screenHeight) ⇒ <code>Number</code>
    * [.paused](#App+paused) ⇒ <code>boolean</code>
    * [.paused](#App+paused)
    * [.zoom](#App+zoom)
    * [.zoom](#App+zoom)
    * [.centerOn(object)](#App+centerOn)
    * [.togglePause()](#App+togglePause)
    * [.pauseRendering()](#App+pauseRendering)
    * [.resumeRendering()](#App+resumeRendering)
    * [.kill()](#App+kill)
    * [.translatePosition(position)](#App+translatePosition) ⇒ <code>Object</code>
    * [.update(seconds)](#App+update)
    * [.previewObject(object)](#App+previewObject) ⇒ <code>AppObject</code>
    * [.cancelPreview(object)](#App+cancelPreview) ⇒ <code>AppObject</code>
    * [.removeObjects(objects)](#App+removeObjects)
    * [.contains(object)](#App+contains) ⇒ <code>boolean</code>
    * [.add(object)](#App+add) ⇒ <code>AppObject</code>
    * [.remove(object)](#App+remove) ⇒ <code>AppObject</code>
    * [.addFx(object)](#App+addFx)
    * [.removeFx(object)](#App+removeFx)
    * [.updateZoom(seconds)](#App+updateZoom)
    * [.selectObject(object, additive)](#App+selectObject)
    * [.select(left, top, right, bottom, additive)](#App+select)
    * [.selectAll()](#App+selectAll)
    * [.deselectAll()](#App+deselectAll)
    * [.removeSelected()](#App+removeSelected)
* _static_
    * [.defaultOptions](#App.defaultOptions) ⇒ <code>Object</code>

new App(options)

| Param | Description | | --- | --- | | options | The options to use in the App. |

app.type : string

The object type. ("app")
Kind: instance property of App

app.objects : Array.<AppObject>

The AppObjects added to the App.
Kind: instance property of App

app.view

View options.
Kind: instance property of App

app.position ⇒ App.container.position \| Object

This position {x, y} of the App view.
Kind: instance property of App

app.scale ⇒ App.container.scale \| Object

The scale {x, y} of the App view.
Kind: instance property of App

app.targetScale ⇒ Object

The target scale {x, y} of the App view. (zoom target)
Kind: instance property of App

app.screenWidth ⇒ Number

The width of the window.
Kind: instance property of App

app.screenHeight ⇒ Number

The height of the window.
Kind: instance property of App

app.paused ⇒ boolean

Get the app paused value.
Kind: instance property of App

app.paused

Set the app paused value.
Kind: instance property of App
| Param | Type | | --- | --- | | val | boolean |

app.zoom

Get the zoom value.
Kind: instance property of App

app.zoom

Set the zoom value.
Kind: instance property of App
| Param | | --- | | val |

app.centerOn(object)

Center on an object in the App.
Kind: instance method of App
| Param | | --- | | object |

app.togglePause()

Toggle app paused value.
Kind: instance method of App

app.pauseRendering()

Pause rendering of the app.
Kind: instance method of App

app.resumeRendering()

Resume rendering of the app.
Kind: instance method of App

app.kill()

Kill the app renderer.
Kind: instance method of App

app.translatePosition(position) ⇒ Object

Translate a position from the window into the app.
Kind: instance method of App
| Param | | --- | | position |

app.update(seconds)

The main update loop of the app, which is triggered by the renderer.
Kind: instance method of App
| Param | Type | | --- | --- | | seconds | Number |

app.previewObject(object) ⇒ AppObject

Add an AppObject to the view, but not the game loop.
Kind: instance method of App
Returns: AppObject - - (object)
| Param | Type | | --- | --- | | object | AppObject |

app.cancelPreview(object) ⇒ AppObject

Remove an AppObject from the view which was added with .previewObject()
Kind: instance method of App
Returns: AppObject - - (object)
| Param | Type | | --- | --- | | object | AppObject |

app.removeObjects(objects)

Remove an array of AppObjects.
Kind: instance method of App
| Param | Type | Description | | --- | --- | --- | | objects | Array.<AppObject> | An array of AppObjects to remove from the App. |

app.contains(object) ⇒ boolean

Check if the App contains an AppObject.
Kind: instance method of App
| Param | Type | Description | | --- | --- | --- | | object | AppObject | The AppObject to check. |

app.add(object) ⇒ AppObject

Add an AppObject to the App.
Kind: instance method of App
| Param | Type | Description | | --- | --- | --- | | object | AppObject | The AppObject to add. |

app.remove(object) ⇒ AppObject

Remove an AppObject from the App.
Kind: instance method of App
| Param | Type | Description | | --- | --- | --- | | object | AppObject | The AppObject to remove. |

app.addFx(object)

Add an AppObject to the FX layer.
Kind: instance method of App
| Param | Type | Description | | --- | --- | --- | | object | AppObject | The FX object to add. |

app.removeFx(object)

Remove an AppObject from the FX layer.
Kind: instance method of App
| Param | Type | Description | | --- | --- | --- | | object | AppObject | The FX object to remove. |

app.updateZoom(seconds)

Update the App scale and position based on the targetScale (zoom).
Kind: instance method of App
| Param | Type | Description | | --- | --- | --- | | seconds | Number | The amount of time passed since the last update. |

app.selectObject(object, additive)

Select an AppObject.
Kind: instance method of App
| Param | Type | Default | Description | | --- | --- | --- | --- | | object | AppObject | | The object to select. | | additive | boolean | false | Whether to add to the current selections, instead of replacing them. |

app.select(left, top, right, bottom, additive)

Select all objects within the given coordinates.
Kind: instance method of App
| Param | Type | Default | Description | | --- | --- | --- | --- | | left | number | | The left coordinate. (x1) | | top | number | | The top coordinate. (y1) | | right | number | | The right coordinate. (x2) | | bottom | number | | The bottom coordinate. (y2) | | additive | boolean | false | Whether to add to the current selections, instead of replacing them. |

app.selectAll()

Select all objects within the app.
Kind: instance method of App

app.deselectAll()

Deselect all selected objects.
Kind: instance method of App

app.removeSelected()

Remove all selected objects.
Kind: instance method of App

App.defaultOptions ⇒ Object

The default options which are used in an App.
Kind: static property of App

AppObject

AppObjects which are added to the App.
Kind: global class
* [new AppObject(app, parent, player, position, scale, pivot, rotation, momentum, dampening)](#new_AppObject_new)
* [.select()](#AppObject+select)
* [.deselect()](#AppObject+deselect)
* [.selectionHitTest()](#AppObject+selectionHitTest)
* [.beforeUpdate(seconds)](#AppObject+beforeUpdate)
* [.update(seconds)](#AppObject+update)
* [.afterUpdate(seconds)](#AppObject+afterUpdate)
* [.updateMovement(seconds)](#AppObject+updateMovement)
* [.updateDampening(seconds)](#AppObject+updateDampening)
* [.draw()](#AppObject+draw)

new AppObject(app, parent, player, position, scale, pivot, rotation, momentum, dampening)

Instantiate a new AppObject.
| Param | Type | Description | | --- | --- | --- | | app | App | The App the AppObject belongs to. | | parent | App \| AppObject | The parent of the AppObject. | | player | object | The player who owns the AppObject. | | position | object | The position {x, y} of the AppObject. | | scale | object | The scale {x, y} of the AppObject. | | pivot | object | The pivot point {x, y} for rotation of the AppObject. | | rotation | object | The rotation of the AppObject. | | momentum | object | The movement speed of the AppObject. | | dampening | object | The amount that momentum and rotation decreases over time. |

appObject.select()

Select this AppObject.
Kind: instance method of AppObject

appObject.deselect()

Deselect this AppObject
Kind: instance method of AppObject

appObject.selectionHitTest()

Check if provided coordinates are cause for the selection of this AppObject
Kind: instance method of AppObject

appObject.beforeUpdate(seconds)

The update operation to occur before all normal update operations within the App.
Kind: instance method of AppObject
| Param | Type | Description | | --- | --- | --- | | seconds | number | The number of seconds since the last update. |

appObject.update(seconds)

The update operation for the main loop of the App.
Kind: instance method of AppObject
| Param | Type | Description | | --- | --- | --- | | seconds | number | The number of seconds since the last update. |

appObject.afterUpdate(seconds)

The update operation to occur after all normal update operations within the App.
Kind: instance method of AppObject
| Param | Type | Description | | --- | --- | --- | | seconds | number | The number of seconds since the last update. |

appObject.updateMovement(seconds)

Update movement based on momentum.
Kind: instance method of AppObject
| Param | Type | Description | | --- | --- | --- | | seconds | number | The number of seconds since the last update. |

appObject.updateDampening(seconds)

Update movement dampening, causing the AppObject to slow down.
Kind: instance method of AppObject
| Param | Type | Description | | --- | --- | --- | | seconds | number | The number of seconds since the last update. |

appObject.draw()

Update the visual appearance of the AppObject.
Kind: instance method of AppObject