me.video

video functions

Members

static AUTO :Number

Auto-select the renderer (Attempt WebGL first, with fallback to Canvas)

static CANVAS :Number

Select the HTML5 Canvas renderer

static renderer :me.Renderer|me.CanvasRenderer|me.WebGLRenderer

A reference to the current video renderer

static scaleRatio :me.Vector2d

the scaling ratio to be applied to the display canvas

Default Value:
  • <1,1>

static WEBGL :Number

Select the WebGL renderer

Methods

static createCanvas(width, height, offscreenopt) → {HTMLCanvasElement|OffscreenCanvas}

Create and return a new Canvas element

Parameters:
Name Type Attributes Default Description
width Number

width

height Number

height

offscreen Boolean <optional>
false

will returns an OffscreenCanvas if supported

Returns:
HTMLCanvasElement | OffscreenCanvas

static getParent() → {HTMLElement}

return a reference to the parent DOM element holding the main canvas

Returns:
HTMLElement

static getPos()

Deprecated:
  • since 7.0.0
See:

static getWrapper()

Deprecated:
  • since 8.0.0
See:

static init(width, height, optionsopt) → {Boolean}

Initialize the "video" system (create a canvas based on the given arguments, and the related renderer).
melonJS support various scaling mode, that can be enabled once the scale option is set to auto :

  • fit : Letterboxed; content is scaled to design aspect ratio

- `fill-min` : Canvas is resized to fit minimum design resolution; content is scaled to design aspect ratio

- `fill-max` : Canvas is resized to fit maximum design resolution; content is scaled to design aspect ratio

- `flex`< : Canvas width & height is resized to fit; content is scaled to design aspect ratio

- `flex-width` : Canvas width is resized to fit; content is scaled to design aspect ratio

- `flex-height` : Canvas height is resized to fit; content is scaled to design aspect ratio

- `stretch` : Canvas is resized to fit; content is scaled to screen aspect ratio

Parameters:
Name Type Attributes Description
width Number

The width of the canvas viewport

height Number

The height of the canvas viewport

options Object <optional>

The optional video/renderer parameters.
(see Renderer(s) documentation for further specific options)

Properties
Name Type Attributes Default Description
parent String | HTMLElement <optional>
document.body

the DOM parent element to hold the canvas in the HTML file

renderer Number <optional>
me.video.AUTO

renderer to use (me.video.CANVAS, me.video.WEBGL, me.video.AUTO)

doubleBuffering Boolean <optional>
false

enable/disable double buffering

scale Number | String <optional>
1.0

enable scaling of the canvas ('auto' for automatic scaling)

scaleMethod String <optional>
"fit"

screen scaling modes ('fit','fill-min','fill-max','flex','flex-width','flex-height','stretch')

preferWebGL1 Boolean <optional>
false

if true the renderer will only use WebGL 1

powerPreference String <optional>
"default"

a hint to the user agent indicating what configuration of GPU is suitable for the WebGL context ("default", "high-performance", "low-power"). To be noted that Safari and Chrome (since version 80) both default to "low-power" to save battery life and improve the user experience on these dual-GPU machines.

transparent Boolean <optional>
false

whether to allow transparent pixels in the front buffer (screen).

antiAlias Boolean <optional>
false

whether to enable or not video scaling interpolation

consoleHeader Boolean <optional>
true

whether to display melonJS version and basic device information in the console

Returns:
Boolean -

false if initialization failed (canvas not supported)

See:
Example
// init the video with a 640x480 canvas
me.video.init(640, 480, {
    parent : "screen",
    renderer : me.video.AUTO,
    scale : "auto",
    scaleMethod : "fit",
    doubleBuffering : true
});

static scale(x, y)

scale the "displayed" canvas by the given scalar. this will modify the size of canvas element directly. Only use this if you are not using the automatic scaling feature.

Parameters:
Name Type Description
x Number

x scaling multiplier

y Number

y scaling multiplier

See:

static updateDisplaySize()

Deprecated:
  • since 7.1.0
See: