FGGE  v0.7
Fabiogiopla HTML5 Game Engine
 All Classes Namespaces Functions Variables Pages
Classes | Functions | Variables
Package GameEngine.Renderer

Rendering tools. More...

Classes

class  Model
 A renderizable model. More...
 

Functions

 generateCanvas ()
 Generate HTML5 canvas.
 
 setCanvas (var canvasElement)
 Set HTML5 canvas.
 
 clearScreen ()
 Clear the canvas.
 
 setBackgroundColor (var color)
 Change color of the canvas.
 
 setHardwareEnabled (var enabled)
 Enable hardware acceleration if available.
 
 setCanvasSize (var width, var height)
 Resize the canvas.
 
 setFullscreen (var fullscreen)
 Enter or exit fullscreen mode.
 
 setFramerate (var fps)
 Change framerate.
 

Variables

var canvas
 The HTML5 canvas.
 
var context2D
 The HTML5 2D context.
 
var contextGL
 The HTML5 WebGL context (if available).
 

Detailed Description

Rendering tools.

Everything graphics-related is here.

Function Documentation

GameEngine.Renderer.clearScreen ( )

Clear the canvas.

Everything rendered in the canvas gets removed after calling this function.
Depending on what your game does, you may want to call this at the start of every frame.

GameEngine.Renderer.generateCanvas ( )

Generate HTML5 canvas.

Generate a new HTML5 and place it after the last loaded script in the page.
Call this function or GameEngine.Renderer.setCanvas() once, before starting game, starting game without a canvas will make engine crash.

GameEngine.Renderer.setBackgroundColor ( var  color)

Change color of the canvas.

Changes background color as specified.
Specified color has to be in HTML notation.

// Make background red.
GameEngine.Renderer.setBackgroundColor("#FF0000");
// Make background yellow.
GameEngine.Renderer.setBackgroundColor("yellow");
Parameters
colorThe new color of the canvas.
GameEngine.Renderer.setCanvas ( var  canvasElement)

Set HTML5 canvas.

Set the canvas that will be used to render the scene.
Call this function or GameEngine.Renderer.generateCanvas() once, before starting game, starting game without a canvas will make engine crash.

var gameCanvas = document.createElement("canvas");
document.body.appendChild(gameCanvas);
GameEngine.Renderer.setCanvas(gameCanvas);
var gameCanvas = document.getElementById("mygame_canvas");
GameEngine.Renderer.setCanvas(gameCanvas);
Parameters
canvasElementThe canvas to use.
GameEngine.Renderer.setCanvasSize ( var  width,
var  height 
)

Resize the canvas.

Change the size of the canvas as specified, also works in realtime.

GameEngine.Renderer.setCanvasSize(800, 600);
Parameters
widthThe new width of the canvas in pixels.
heightThe new height of the canvas in pixels.
GameEngine.Renderer.setFramerate ( var  fps)

Change framerate.

Change the framerate of the game.
NOTE: If the client computer is too slow, framerate will decrease without notice!

Parameters
fpsFrames per second.
GameEngine.Renderer.setFullscreen ( var  fullscreen)

Enter or exit fullscreen mode.

WARNING: This is an HTML5 feature under discussion, may not work or produce unexpected behaviours! Do not use in serious projects!
Enter or exit fullscreen mode.

Parameters
fullscreenEnter fullscreen if true, exit if false.
GameEngine.Renderer.setHardwareEnabled ( var  enabled)

Enable hardware acceleration if available.

Enabling hardware acceleration may improve speed a little.

Variable Documentation

var GameEngine.Renderer.canvas

The HTML5 canvas.

Everything is rendered to this canvas.

var GameEngine.Renderer.context2D

The HTML5 2D context.

Everything that is in 2D and has to be rendered should pass from this.
You can render geometrical shapes from this.

var GameEngine.Renderer.contextGL

The HTML5 WebGL context (if available).

Some browsers may support hardware accelerated rendering, if a context of this kind is available, it will appear here.