- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
// default settings
export const defaultSettings = {
parent : undefined,
renderer : 2, // AUTO
autoScale : false,
scale : 1.0,
scaleMethod : "manual",
scaleTarget : undefined,
transparent : false,
premultipliedAlpha: true,
blendMode : "normal",
physic : "builtin",
antiAlias : false,
failIfMajorPerformanceCaveat : true,
subPixel : false,
preferWebGL1 : false,
powerPreference : "default",
verbose : false,
consoleHeader : true,
legacy : false
};
/**
* Application & Renderer Settings definition.
* @typedef {object} Settings
* @property {string|HTMLElement} [parent=document.body] - the DOM parent element to hold the canvas in the HTML file
* @property {number|Renderer} [renderer=AUTO] - renderer to use (CANVAS, WEBGL, AUTO), or a custom renderer class
* @property {number|string} [scale=1.0] - enable scaling of the canvas ('auto' for automatic scaling)
* @property {"fit"|"fill-min"|"fill-max"|"flex"|"flex-width"|"flex-height"|"stretch"} [scaleMethod="fit"] - screen scaling modes : <br>
* - <i><b>`fit`</b></i> : Letterboxed; content is scaled to design aspect ratio <br>
* <center><img src="images/scale-fit.png"/></center><br>
* - <i><b>`fill-min`</b></i> : Canvas is resized to fit minimum design resolution; content is scaled to design aspect ratio <br>
* <center><img src="images/scale-fill-min.png"/></center><br>
* - <i><b>`fill-max`</b></i> : Canvas is resized to fit maximum design resolution; content is scaled to design aspect ratio <br>
* <center><img src="images/scale-fill-max.png"/></center><br>
* - <i><b>`flex`</b><</i> : Canvas width & height is resized to fit; content is scaled to design aspect ratio <br>
* <center><img src="images/scale-flex.png"/></center><br>
* - <i><b>`flex-width`</b></i> : Canvas width is resized to fit; content is scaled to design aspect ratio <br>
* <center><img src="images/scale-flex-width.png"/></center><br>
* - <i><b>`flex-height`</b></i> : Canvas height is resized to fit; content is scaled to design aspect ratio <br>
* <center><img src="images/scale-flex-height.png"/></center><br>
* - <i><b>`stretch`</b></i> : Canvas is resized to fit; content is scaled to screen aspect ratio <br>
* <center><img src="images/scale-stretch.png"/></center>
* @property {string|HTMLElement} [scaleTarget] - the HTML Element to be used as the reference target when using automatic scaling (by default melonJS will use the parent container of the div element containing the canvas)
* @property {boolean} [preferWebGL1=false] - if true the renderer will only use WebGL 1
* @property {"sorting"|"z-buffer"} [depthTest="sorting"] - ~Experimental~ the default method to sort object on the z axis in WebGL
* @property {("default"|"high-performance"|"low-power")} [powerPreference="default"] - a hint to the user agent indicating what configuration of GPU is suitable for the WebGL context. 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.
* @property {boolean} [transparent=false] - whether to allow transparent pixels in the front buffer (screen).
* @property {boolean} [antiAlias=false] - whether to enable or not video scaling interpolation
* @property {boolean} [consoleHeader=true] - whether to display melonJS version and basic device information in the console
* @param {number} [options.zoomX=width] - The actual width of the canvas with scaling applied
* @param {number} [options.zoomY=height] - The actual height of the canvas with scaling applied
* @param {Compositor} [options.compositor] - a custom compositor class (WebGL only)
* @param {string} [option.physic="builtin"] - the physic system to use (default: "builtin", or "none" to disable builtin physic)
* @see Application
* @memberof Application
*/