From f0b47a9eaf7dfd65d089f7cd659ac9db34258f4a Mon Sep 17 00:00:00 2001 From: Adi Mora Date: Wed, 21 Jan 2015 17:53:17 +0000 Subject: [PATCH 1/2] refactored all the samples and added base Application class that can be used for all pixi applications --- docs.xml | 64 +++++++-- pixi/Application.hx | 166 +++++++++++++++++++++++ pixi/DomDefinitions.hx | 4 +- pixi/IApplication.hx | 17 +++ samples/_output/basics.html | 1 + samples/_output/bitmaptext.html | 1 + samples/_output/blur.html | 1 + samples/_output/colourmatrix.html | 1 + samples/_output/graphics.html | 1 + samples/_output/hx-pixi-basics.js | 103 ++++++++++++-- samples/_output/hx-pixi-bitmaptext.js | 98 +++++++++++-- samples/_output/hx-pixi-blur.js | 103 ++++++++++++-- samples/_output/hx-pixi-bunnymark.js | 141 +++++++++++++------ samples/_output/hx-pixi-colourmatrix.js | 103 ++++++++++++-- samples/_output/hx-pixi-graphics.js | 110 +++++++++++++-- samples/_output/hx-pixi-movieclip.js | 100 ++++++++++++-- samples/_output/hx-pixi-nape.js | 125 +++++++++++++---- samples/_output/hx-pixi-pixidude.js | 100 ++++++++++++-- samples/_output/hx-pixi-rendertexture.js | 118 +++++++++++++--- samples/_output/hx-pixi-snake.js | 103 ++++++++++++-- samples/_output/hx-pixi-spine.js | 98 +++++++++++-- samples/_output/hx-pixi-spritesheet.js | 117 +++++++++++++--- samples/_output/hx-pixi-tilingsprite.js | 99 ++++++++++++-- samples/_output/movieclip.html | 1 + samples/_output/nape.html | 1 + samples/_output/pixidude.html | 1 + samples/_output/rendertexture.html | 1 + samples/_output/snake.html | 1 + samples/_output/spine.html | 1 + samples/_output/spritesheet.html | 1 + samples/_output/tiling.html | 1 + samples/basics/Main.hx | 32 ++--- samples/bitmaptext/Main.hx | 26 ++-- samples/blur/Main.hx | 32 ++--- samples/bunnymark/Main.hx | 78 ++++------- samples/colourmatrix/Main.hx | 35 +++-- samples/graphics/Main.hx | 41 +++--- samples/movieclip/Main.hx | 25 ++-- samples/nape/Main.hx | 50 ++++--- samples/pixidude/Main.hx | 27 ++-- samples/rendertexture/Main.hx | 46 +++---- samples/snake/Main.hx | 33 ++--- samples/spine/Main.hx | 27 ++-- samples/spritesheet/Main.hx | 51 +++---- samples/tilingsprite/Main.hx | 27 ++-- 45 files changed, 1789 insertions(+), 523 deletions(-) create mode 100644 pixi/Application.hx create mode 100644 pixi/IApplication.hx diff --git a/docs.xml b/docs.xml index 3c908739..eea00272 100644 --- a/docs.xml +++ b/docs.xml @@ -17725,6 +17725,44 @@ Documentation for this class was provided by + + + + + + + + + + + + + + + + <_stage set="null"> + <_canvas> + <_renderer> + <_stats> + <_lastTime> + <_currentTime> + <_elapsedTime> + <_skipFrame> + <_setDefaultValues set="method" line="96"> + + <_onWindowResize set="method" line="126"> + + + + <_onRequestAnimationFrame set="method" line="135"> + <_calculateElapsedTime set="method" line="147"> + + + + + + + * Because macros cannot access the JS package, put @@ -21823,14 +21861,7 @@ Documentation for this class was provided by "PIXI.GraphicsData" - - - - - - - - + @@ -24475,20 +24506,23 @@ Documentation for this class was provided by "PIXI.AjaxRequest" -
+ +
- <_renderer> - <_stage> <_floor> <_space> <_balls> <_pballs> - <_setUpPhysics set="method" line="44"> - <_addBall set="method" line="54"> - - + <_init set="method" line="37"> + <_onUpdate set="method" line="46"> + + + + <_setUpPhysics set="method" line="56"> + <_addBall set="method" line="66"> + diff --git a/pixi/Application.hx b/pixi/Application.hx new file mode 100644 index 00000000..a4f5ebc6 --- /dev/null +++ b/pixi/Application.hx @@ -0,0 +1,166 @@ +/* Helper class that can be used by any pixi application + * + * @author Adi Reddy Mora + * http://adireddy.github.io + * @license MIT + * @copyright 2015 + */ + +package pixi; + +import js.html.Event; +import js.html.CanvasElement; +import js.Browser; +import pixi.renderers.webgl.WebGLRenderer; +import pixi.utils.Detector; +import pixi.display.Stage; +import pixi.utils.Stats; + +class Application implements IApplication { + + /* + * Sets the pixel ratio of the application + * @default 1 + */ + public var pixelRatio(null, default):Float; + + /* + * Default frame rate is 60 FPS and this can be set to true to get 30 FPS + * @default false + */ + public var skipFrame(null, default):Bool; + + /* + * Width of the application + * @default Browser.window.innerWidth + */ + public var width(null, default):Float; + + /* + * Height of the application + * @default Browser.window.innerHeight + */ + public var height(null, default):Float; + + /* + * Whether you want to resize the canvas and renderer on browser resize + * Should be set to false when custom width and height are used for the application + * @default true + */ + public var resize(null, default):Bool; + + /* + * Enable/disable stats for the application + * Note that stats.js is not part of pixi so don't forget to include it you html page + * Can be found in libs folder - + * @default false + */ + public var stats(null, set):Bool; + + /* + * Sets the background color of the stage + * @default 0xFFFFFF + */ + public var backgroundColor(null, default):Int; + + /* + * Update listener function + */ + public var onUpdate:Float -> Void; + + /* + * Windo resize listener function + */ + public var onResize:Void -> Void; + + /* + * Pixi stage + * Read-only + */ + var _stage(default, null):Stage; + + var _canvas:CanvasElement; + var _renderer:WebGLRenderer; + var _stats:Stats; + + var _lastTime:Date; + var _currentTime:Date; + var _elapsedTime:Float; + var _skipFrame:Bool; + + public function new() { + _lastTime = Date.now(); + _setDefaultValues(); + } + + function _setDefaultValues() { + pixelRatio = 1; + skipFrame = false; + stats = false; + backgroundColor = 0xFFFFFF; + width = Browser.window.innerWidth; + height = Browser.window.innerHeight; + _skipFrame = false; + } + + public function start() { + _canvas = Browser.document.createCanvasElement(); + _canvas.style.width = width + "px"; + _canvas.style.height = height + "px"; + _canvas.style.position = "absolute"; + Browser.document.body.appendChild(_canvas); + + _stage = new Stage(backgroundColor); + + var renderingOptions:RenderingOptions = {}; + renderingOptions.view = _canvas; + renderingOptions.resolution = pixelRatio; + + _renderer = Detector.autoDetectRenderer(width, height, renderingOptions); + Browser.document.body.appendChild(_renderer.view); + Browser.window.onresize = _onWindowResize; + Browser.window.requestAnimationFrame(cast _onRequestAnimationFrame); + _lastTime = Date.now(); + } + + function _onWindowResize(event:Event) { + width = Browser.window.innerWidth; + height = Browser.window.innerHeight; + _renderer.resize(width, height); + _canvas.style.width = width + "px"; + _canvas.style.height = height + "px"; + if (onResize != null) onResize(); + } + + function _onRequestAnimationFrame() { + if (skipFrame && _skipFrame) _skipFrame = false; + else { + _skipFrame = true; + _calculateElapsedTime(); + if (onUpdate != null) onUpdate(_elapsedTime); + _renderer.render(_stage); + } + Browser.window.requestAnimationFrame(cast _onRequestAnimationFrame); + if (_stats != null) _stats.update(); + } + + function _calculateElapsedTime() { + _currentTime = Date.now(); + _elapsedTime = _currentTime.getTime() - _lastTime.getTime(); + _lastTime = _currentTime; + } + + function set_stats(val:Bool):Bool { + if (val) { + var _container = Browser.document.createElement("div"); + Browser.document.body.appendChild(_container); + _stats = new Stats(); + _stats.domElement.style.position = "absolute"; + _stats.domElement.style.top = "2px"; + _stats.domElement.style.right = "2px"; + _container.appendChild(_stats.domElement); + _stats.begin(); + } + return stats = val; + } +} \ No newline at end of file diff --git a/pixi/DomDefinitions.hx b/pixi/DomDefinitions.hx index c5dd5871..ad7306d8 100644 --- a/pixi/DomDefinitions.hx +++ b/pixi/DomDefinitions.hx @@ -16,4 +16,6 @@ package pixi; typedef Element = Dynamic; typedef Image = Dynamic; typedef DivElement = Dynamic; -#end \ No newline at end of file +#end + +class DomDefinitions {} \ No newline at end of file diff --git a/pixi/IApplication.hx b/pixi/IApplication.hx new file mode 100644 index 00000000..a6b955a8 --- /dev/null +++ b/pixi/IApplication.hx @@ -0,0 +1,17 @@ +package pixi; + +interface IApplication { + + var pixelRatio(null, default):Float; + var skipFrame(null, default):Bool; + var resize(null, default):Bool; + var stats(null, set):Bool; + var backgroundColor(null, default):Int; + var width(null, default):Float; + var height(null, default):Float; + + var onUpdate:Float -> Void; + var onResize:Void -> Void; + + function start():Void; +} \ No newline at end of file diff --git a/samples/_output/basics.html b/samples/_output/basics.html index 9cbd26c7..4f5e8cbb 100644 --- a/samples/_output/basics.html +++ b/samples/_output/basics.html @@ -10,6 +10,7 @@ haxe-pixi-basics +