diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/filters/blur/BlurFilter.js b/src/filters/blur/BlurFilter.js index 5b3c3a9..8a05893 100644 --- a/src/filters/blur/BlurFilter.js +++ b/src/filters/blur/BlurFilter.js @@ -15,14 +15,15 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { super(); - this.blurXFilter = new BlurXFilter(); - this.blurYFilter = new BlurYFilter(); + this.blurXFilter = new BlurXFilter(strength, quality, resolution, kernelSize); + this.blurYFilter = new BlurYFilter(strength, quality, resolution, kernelSize); this.resolution = 1; this.padding = 0; diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/filters/blur/BlurFilter.js b/src/filters/blur/BlurFilter.js index 5b3c3a9..8a05893 100644 --- a/src/filters/blur/BlurFilter.js +++ b/src/filters/blur/BlurFilter.js @@ -15,14 +15,15 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { super(); - this.blurXFilter = new BlurXFilter(); - this.blurYFilter = new BlurYFilter(); + this.blurXFilter = new BlurXFilter(strength, quality, resolution, kernelSize); + this.blurYFilter = new BlurYFilter(strength, quality, resolution, kernelSize); this.resolution = 1; this.padding = 0; diff --git a/src/filters/blur/BlurXFilter.js b/src/filters/blur/BlurXFilter.js index 24181b6..338096c 100644 --- a/src/filters/blur/BlurXFilter.js +++ b/src/filters/blur/BlurXFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, true); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, true); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/filters/blur/BlurFilter.js b/src/filters/blur/BlurFilter.js index 5b3c3a9..8a05893 100644 --- a/src/filters/blur/BlurFilter.js +++ b/src/filters/blur/BlurFilter.js @@ -15,14 +15,15 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { super(); - this.blurXFilter = new BlurXFilter(); - this.blurYFilter = new BlurYFilter(); + this.blurXFilter = new BlurXFilter(strength, quality, resolution, kernelSize); + this.blurYFilter = new BlurYFilter(strength, quality, resolution, kernelSize); this.resolution = 1; this.padding = 0; diff --git a/src/filters/blur/BlurXFilter.js b/src/filters/blur/BlurXFilter.js index 24181b6..338096c 100644 --- a/src/filters/blur/BlurXFilter.js +++ b/src/filters/blur/BlurXFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, true); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, true); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/filters/blur/BlurYFilter.js b/src/filters/blur/BlurYFilter.js index 267728b..94cbf37 100644 --- a/src/filters/blur/BlurYFilter.js +++ b/src/filters/blur/BlurYFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, false); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, false); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/filters/blur/BlurFilter.js b/src/filters/blur/BlurFilter.js index 5b3c3a9..8a05893 100644 --- a/src/filters/blur/BlurFilter.js +++ b/src/filters/blur/BlurFilter.js @@ -15,14 +15,15 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { super(); - this.blurXFilter = new BlurXFilter(); - this.blurYFilter = new BlurYFilter(); + this.blurXFilter = new BlurXFilter(strength, quality, resolution, kernelSize); + this.blurYFilter = new BlurYFilter(strength, quality, resolution, kernelSize); this.resolution = 1; this.padding = 0; diff --git a/src/filters/blur/BlurXFilter.js b/src/filters/blur/BlurXFilter.js index 24181b6..338096c 100644 --- a/src/filters/blur/BlurXFilter.js +++ b/src/filters/blur/BlurXFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, true); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, true); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/filters/blur/BlurYFilter.js b/src/filters/blur/BlurYFilter.js index 267728b..94cbf37 100644 --- a/src/filters/blur/BlurYFilter.js +++ b/src/filters/blur/BlurYFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, false); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, false); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/interaction/InteractionEvent.js b/src/interaction/InteractionEvent.js index 0342469..75b2966 100644 --- a/src/interaction/InteractionEvent.js +++ b/src/interaction/InteractionEvent.js @@ -12,14 +12,15 @@ constructor() { /** - * Which this event will continue propagating in the tree + * Whether this event will continue propagating in the tree * * @member {boolean} */ this.stopped = false; /** - * The object to which event is dispatched. + * The object which caused this event to be dispatched. + * For listener callback see {@link PIXI.interaction.InteractionEvent.currentTarget}. * * @member {PIXI.DisplayObject} */ diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/filters/blur/BlurFilter.js b/src/filters/blur/BlurFilter.js index 5b3c3a9..8a05893 100644 --- a/src/filters/blur/BlurFilter.js +++ b/src/filters/blur/BlurFilter.js @@ -15,14 +15,15 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { super(); - this.blurXFilter = new BlurXFilter(); - this.blurYFilter = new BlurYFilter(); + this.blurXFilter = new BlurXFilter(strength, quality, resolution, kernelSize); + this.blurYFilter = new BlurYFilter(strength, quality, resolution, kernelSize); this.resolution = 1; this.padding = 0; diff --git a/src/filters/blur/BlurXFilter.js b/src/filters/blur/BlurXFilter.js index 24181b6..338096c 100644 --- a/src/filters/blur/BlurXFilter.js +++ b/src/filters/blur/BlurXFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, true); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, true); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/filters/blur/BlurYFilter.js b/src/filters/blur/BlurYFilter.js index 267728b..94cbf37 100644 --- a/src/filters/blur/BlurYFilter.js +++ b/src/filters/blur/BlurYFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, false); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, false); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/interaction/InteractionEvent.js b/src/interaction/InteractionEvent.js index 0342469..75b2966 100644 --- a/src/interaction/InteractionEvent.js +++ b/src/interaction/InteractionEvent.js @@ -12,14 +12,15 @@ constructor() { /** - * Which this event will continue propagating in the tree + * Whether this event will continue propagating in the tree * * @member {boolean} */ this.stopped = false; /** - * The object to which event is dispatched. + * The object which caused this event to be dispatched. + * For listener callback see {@link PIXI.interaction.InteractionEvent.currentTarget}. * * @member {PIXI.DisplayObject} */ diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index ca2b14d..05f6628 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -105,15 +105,16 @@ this.interactionDOMElement = null; /** - * This property determins if mousemove and touchmove events are fired only when the cursror + * This property determines if mousemove and touchmove events are fired only when the cursror * is over the object. * Setting to true will make things work more in line with how the DOM verison works. * Setting to false can make things easier for things like dragging * It is currently set to false as this is how pixi used to work. This will be set to true in * future versions of pixi. * - * @private - * @member {boolean} + * @member {boolean} moveWhenInside + * @memberof PIXI.interaction.InteractionManager# + * @default false */ this.moveWhenInside = false; diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/filters/blur/BlurFilter.js b/src/filters/blur/BlurFilter.js index 5b3c3a9..8a05893 100644 --- a/src/filters/blur/BlurFilter.js +++ b/src/filters/blur/BlurFilter.js @@ -15,14 +15,15 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { super(); - this.blurXFilter = new BlurXFilter(); - this.blurYFilter = new BlurYFilter(); + this.blurXFilter = new BlurXFilter(strength, quality, resolution, kernelSize); + this.blurYFilter = new BlurYFilter(strength, quality, resolution, kernelSize); this.resolution = 1; this.padding = 0; diff --git a/src/filters/blur/BlurXFilter.js b/src/filters/blur/BlurXFilter.js index 24181b6..338096c 100644 --- a/src/filters/blur/BlurXFilter.js +++ b/src/filters/blur/BlurXFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, true); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, true); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/filters/blur/BlurYFilter.js b/src/filters/blur/BlurYFilter.js index 267728b..94cbf37 100644 --- a/src/filters/blur/BlurYFilter.js +++ b/src/filters/blur/BlurYFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, false); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, false); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/interaction/InteractionEvent.js b/src/interaction/InteractionEvent.js index 0342469..75b2966 100644 --- a/src/interaction/InteractionEvent.js +++ b/src/interaction/InteractionEvent.js @@ -12,14 +12,15 @@ constructor() { /** - * Which this event will continue propagating in the tree + * Whether this event will continue propagating in the tree * * @member {boolean} */ this.stopped = false; /** - * The object to which event is dispatched. + * The object which caused this event to be dispatched. + * For listener callback see {@link PIXI.interaction.InteractionEvent.currentTarget}. * * @member {PIXI.DisplayObject} */ diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index ca2b14d..05f6628 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -105,15 +105,16 @@ this.interactionDOMElement = null; /** - * This property determins if mousemove and touchmove events are fired only when the cursror + * This property determines if mousemove and touchmove events are fired only when the cursror * is over the object. * Setting to true will make things work more in line with how the DOM verison works. * Setting to false can make things easier for things like dragging * It is currently set to false as this is how pixi used to work. This will be set to true in * future versions of pixi. * - * @private - * @member {boolean} + * @member {boolean} moveWhenInside + * @memberof PIXI.interaction.InteractionManager# + * @default false */ this.moveWhenInside = false; diff --git a/src/loaders/spritesheetParser.js b/src/loaders/spritesheetParser.js index 2d637b1..2b30b1c 100644 --- a/src/loaders/spritesheetParser.js +++ b/src/loaders/spritesheetParser.js @@ -43,14 +43,22 @@ const frames = resource.data.frames; const frameKeys = Object.keys(frames); const baseTexture = res.texture.baseTexture; - let resolution = core.utils.getResolutionOfUrl(resource.url); const scale = resource.data.meta.scale; - // for now (to keep things compatible) resolution overrides scale - // Support scale field on spritesheet - if (resolution === 1 && scale !== undefined && scale !== 1) + // Use a defaultValue of `null` to check if a url-based resolution is set + let resolution = core.utils.getResolutionOfUrl(resource.url, null); + + // No resolution found via URL + if (resolution === null) { - baseTexture.resolution = resolution = scale; + // Use the scale value or default to 1 + resolution = scale !== undefined ? scale : 1; + } + + // For non-1 resolutions, update baseTexture + if (resolution !== 1) + { + baseTexture.resolution = resolution; baseTexture.update(); } diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/filters/blur/BlurFilter.js b/src/filters/blur/BlurFilter.js index 5b3c3a9..8a05893 100644 --- a/src/filters/blur/BlurFilter.js +++ b/src/filters/blur/BlurFilter.js @@ -15,14 +15,15 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { super(); - this.blurXFilter = new BlurXFilter(); - this.blurYFilter = new BlurYFilter(); + this.blurXFilter = new BlurXFilter(strength, quality, resolution, kernelSize); + this.blurYFilter = new BlurYFilter(strength, quality, resolution, kernelSize); this.resolution = 1; this.padding = 0; diff --git a/src/filters/blur/BlurXFilter.js b/src/filters/blur/BlurXFilter.js index 24181b6..338096c 100644 --- a/src/filters/blur/BlurXFilter.js +++ b/src/filters/blur/BlurXFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, true); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, true); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/filters/blur/BlurYFilter.js b/src/filters/blur/BlurYFilter.js index 267728b..94cbf37 100644 --- a/src/filters/blur/BlurYFilter.js +++ b/src/filters/blur/BlurYFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, false); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, false); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/interaction/InteractionEvent.js b/src/interaction/InteractionEvent.js index 0342469..75b2966 100644 --- a/src/interaction/InteractionEvent.js +++ b/src/interaction/InteractionEvent.js @@ -12,14 +12,15 @@ constructor() { /** - * Which this event will continue propagating in the tree + * Whether this event will continue propagating in the tree * * @member {boolean} */ this.stopped = false; /** - * The object to which event is dispatched. + * The object which caused this event to be dispatched. + * For listener callback see {@link PIXI.interaction.InteractionEvent.currentTarget}. * * @member {PIXI.DisplayObject} */ diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index ca2b14d..05f6628 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -105,15 +105,16 @@ this.interactionDOMElement = null; /** - * This property determins if mousemove and touchmove events are fired only when the cursror + * This property determines if mousemove and touchmove events are fired only when the cursror * is over the object. * Setting to true will make things work more in line with how the DOM verison works. * Setting to false can make things easier for things like dragging * It is currently set to false as this is how pixi used to work. This will be set to true in * future versions of pixi. * - * @private - * @member {boolean} + * @member {boolean} moveWhenInside + * @memberof PIXI.interaction.InteractionManager# + * @default false */ this.moveWhenInside = false; diff --git a/src/loaders/spritesheetParser.js b/src/loaders/spritesheetParser.js index 2d637b1..2b30b1c 100644 --- a/src/loaders/spritesheetParser.js +++ b/src/loaders/spritesheetParser.js @@ -43,14 +43,22 @@ const frames = resource.data.frames; const frameKeys = Object.keys(frames); const baseTexture = res.texture.baseTexture; - let resolution = core.utils.getResolutionOfUrl(resource.url); const scale = resource.data.meta.scale; - // for now (to keep things compatible) resolution overrides scale - // Support scale field on spritesheet - if (resolution === 1 && scale !== undefined && scale !== 1) + // Use a defaultValue of `null` to check if a url-based resolution is set + let resolution = core.utils.getResolutionOfUrl(resource.url, null); + + // No resolution found via URL + if (resolution === null) { - baseTexture.resolution = resolution = scale; + // Use the scale value or default to 1 + resolution = scale !== undefined ? scale : 1; + } + + // For non-1 resolutions, update baseTexture + if (resolution !== 1) + { + baseTexture.resolution = resolution; baseTexture.update(); } diff --git a/src/mesh/Mesh.js b/src/mesh/Mesh.js index 7f96afc..4621235 100644 --- a/src/mesh/Mesh.js +++ b/src/mesh/Mesh.js @@ -48,6 +48,31 @@ // uniforms// // state// + /** + * The tint applied to the mesh. This is a [r,g,b] value. A value of [1,1,1] will remove any + * tint effect. + * + * @member {number} + * @memberof PIXI.mesh.Mesh# + */ + this.tintRgb = new Float32Array([1, 1, 1]); + + /** + * A map of renderer IDs to webgl render data + * + * @private + * @member {object} + */ + this._glDatas = {}; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'mesh' + */ + this.pluginName = 'mesh'; } /** @@ -58,12 +83,34 @@ */ _renderWebGL(renderer) { - renderer.setObjectRenderer(renderer.plugins.mesh); - renderer.plugins.mesh.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** - * Calculates the bounds of the mesh. The bounds calculation takes the worldTransform into account. + * Renders the object using the Canvas renderer + * + * @private + * @param {PIXI.CanvasRenderer} renderer - The canvas renderer. + */ + _renderCanvas(renderer) + { + renderer.plugins[this.pluginName].render(this); + } + + /** + * When the texture is updated, this event will fire to update the scale and frame + * + * @private + */ + _onTextureUpdate() + { + /* empty */ + } + + /** + * Returns the bounds of the mesh as a rectangle. The bounds calculation takes the worldTransform into account. + * */ _calculateBounds() { diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/filters/blur/BlurFilter.js b/src/filters/blur/BlurFilter.js index 5b3c3a9..8a05893 100644 --- a/src/filters/blur/BlurFilter.js +++ b/src/filters/blur/BlurFilter.js @@ -15,14 +15,15 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { super(); - this.blurXFilter = new BlurXFilter(); - this.blurYFilter = new BlurYFilter(); + this.blurXFilter = new BlurXFilter(strength, quality, resolution, kernelSize); + this.blurYFilter = new BlurYFilter(strength, quality, resolution, kernelSize); this.resolution = 1; this.padding = 0; diff --git a/src/filters/blur/BlurXFilter.js b/src/filters/blur/BlurXFilter.js index 24181b6..338096c 100644 --- a/src/filters/blur/BlurXFilter.js +++ b/src/filters/blur/BlurXFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, true); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, true); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/filters/blur/BlurYFilter.js b/src/filters/blur/BlurYFilter.js index 267728b..94cbf37 100644 --- a/src/filters/blur/BlurYFilter.js +++ b/src/filters/blur/BlurYFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, false); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, false); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/interaction/InteractionEvent.js b/src/interaction/InteractionEvent.js index 0342469..75b2966 100644 --- a/src/interaction/InteractionEvent.js +++ b/src/interaction/InteractionEvent.js @@ -12,14 +12,15 @@ constructor() { /** - * Which this event will continue propagating in the tree + * Whether this event will continue propagating in the tree * * @member {boolean} */ this.stopped = false; /** - * The object to which event is dispatched. + * The object which caused this event to be dispatched. + * For listener callback see {@link PIXI.interaction.InteractionEvent.currentTarget}. * * @member {PIXI.DisplayObject} */ diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index ca2b14d..05f6628 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -105,15 +105,16 @@ this.interactionDOMElement = null; /** - * This property determins if mousemove and touchmove events are fired only when the cursror + * This property determines if mousemove and touchmove events are fired only when the cursror * is over the object. * Setting to true will make things work more in line with how the DOM verison works. * Setting to false can make things easier for things like dragging * It is currently set to false as this is how pixi used to work. This will be set to true in * future versions of pixi. * - * @private - * @member {boolean} + * @member {boolean} moveWhenInside + * @memberof PIXI.interaction.InteractionManager# + * @default false */ this.moveWhenInside = false; diff --git a/src/loaders/spritesheetParser.js b/src/loaders/spritesheetParser.js index 2d637b1..2b30b1c 100644 --- a/src/loaders/spritesheetParser.js +++ b/src/loaders/spritesheetParser.js @@ -43,14 +43,22 @@ const frames = resource.data.frames; const frameKeys = Object.keys(frames); const baseTexture = res.texture.baseTexture; - let resolution = core.utils.getResolutionOfUrl(resource.url); const scale = resource.data.meta.scale; - // for now (to keep things compatible) resolution overrides scale - // Support scale field on spritesheet - if (resolution === 1 && scale !== undefined && scale !== 1) + // Use a defaultValue of `null` to check if a url-based resolution is set + let resolution = core.utils.getResolutionOfUrl(resource.url, null); + + // No resolution found via URL + if (resolution === null) { - baseTexture.resolution = resolution = scale; + // Use the scale value or default to 1 + resolution = scale !== undefined ? scale : 1; + } + + // For non-1 resolutions, update baseTexture + if (resolution !== 1) + { + baseTexture.resolution = resolution; baseTexture.update(); } diff --git a/src/mesh/Mesh.js b/src/mesh/Mesh.js index 7f96afc..4621235 100644 --- a/src/mesh/Mesh.js +++ b/src/mesh/Mesh.js @@ -48,6 +48,31 @@ // uniforms// // state// + /** + * The tint applied to the mesh. This is a [r,g,b] value. A value of [1,1,1] will remove any + * tint effect. + * + * @member {number} + * @memberof PIXI.mesh.Mesh# + */ + this.tintRgb = new Float32Array([1, 1, 1]); + + /** + * A map of renderer IDs to webgl render data + * + * @private + * @member {object} + */ + this._glDatas = {}; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'mesh' + */ + this.pluginName = 'mesh'; } /** @@ -58,12 +83,34 @@ */ _renderWebGL(renderer) { - renderer.setObjectRenderer(renderer.plugins.mesh); - renderer.plugins.mesh.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** - * Calculates the bounds of the mesh. The bounds calculation takes the worldTransform into account. + * Renders the object using the Canvas renderer + * + * @private + * @param {PIXI.CanvasRenderer} renderer - The canvas renderer. + */ + _renderCanvas(renderer) + { + renderer.plugins[this.pluginName].render(this); + } + + /** + * When the texture is updated, this event will fire to update the scale and frame + * + * @private + */ + _onTextureUpdate() + { + /* empty */ + } + + /** + * Returns the bounds of the mesh as a rectangle. The bounds calculation takes the worldTransform into account. + * */ _calculateBounds() { diff --git a/test/core/Graphics.js b/test/core/Graphics.js index 0622cfc..50f775b 100644 --- a/test/core/Graphics.js +++ b/test/core/Graphics.js @@ -191,4 +191,21 @@ expect(graphics.currentPath).to.be.null; }); }); + + describe('_calculateBounds', () => + { + it('should only call updateLocalBounds once', () => + { + const graphics = new PIXI.Graphics(); + const spy = sinon.spy(graphics, 'updateLocalBounds'); + + graphics._calculateBounds(); + + expect(spy).to.have.been.calledOnce; + + graphics._calculateBounds(); + + expect(spy).to.have.been.calledOnce; + }); + }); }); diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/filters/blur/BlurFilter.js b/src/filters/blur/BlurFilter.js index 5b3c3a9..8a05893 100644 --- a/src/filters/blur/BlurFilter.js +++ b/src/filters/blur/BlurFilter.js @@ -15,14 +15,15 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { super(); - this.blurXFilter = new BlurXFilter(); - this.blurYFilter = new BlurYFilter(); + this.blurXFilter = new BlurXFilter(strength, quality, resolution, kernelSize); + this.blurYFilter = new BlurYFilter(strength, quality, resolution, kernelSize); this.resolution = 1; this.padding = 0; diff --git a/src/filters/blur/BlurXFilter.js b/src/filters/blur/BlurXFilter.js index 24181b6..338096c 100644 --- a/src/filters/blur/BlurXFilter.js +++ b/src/filters/blur/BlurXFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, true); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, true); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/filters/blur/BlurYFilter.js b/src/filters/blur/BlurYFilter.js index 267728b..94cbf37 100644 --- a/src/filters/blur/BlurYFilter.js +++ b/src/filters/blur/BlurYFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, false); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, false); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/interaction/InteractionEvent.js b/src/interaction/InteractionEvent.js index 0342469..75b2966 100644 --- a/src/interaction/InteractionEvent.js +++ b/src/interaction/InteractionEvent.js @@ -12,14 +12,15 @@ constructor() { /** - * Which this event will continue propagating in the tree + * Whether this event will continue propagating in the tree * * @member {boolean} */ this.stopped = false; /** - * The object to which event is dispatched. + * The object which caused this event to be dispatched. + * For listener callback see {@link PIXI.interaction.InteractionEvent.currentTarget}. * * @member {PIXI.DisplayObject} */ diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index ca2b14d..05f6628 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -105,15 +105,16 @@ this.interactionDOMElement = null; /** - * This property determins if mousemove and touchmove events are fired only when the cursror + * This property determines if mousemove and touchmove events are fired only when the cursror * is over the object. * Setting to true will make things work more in line with how the DOM verison works. * Setting to false can make things easier for things like dragging * It is currently set to false as this is how pixi used to work. This will be set to true in * future versions of pixi. * - * @private - * @member {boolean} + * @member {boolean} moveWhenInside + * @memberof PIXI.interaction.InteractionManager# + * @default false */ this.moveWhenInside = false; diff --git a/src/loaders/spritesheetParser.js b/src/loaders/spritesheetParser.js index 2d637b1..2b30b1c 100644 --- a/src/loaders/spritesheetParser.js +++ b/src/loaders/spritesheetParser.js @@ -43,14 +43,22 @@ const frames = resource.data.frames; const frameKeys = Object.keys(frames); const baseTexture = res.texture.baseTexture; - let resolution = core.utils.getResolutionOfUrl(resource.url); const scale = resource.data.meta.scale; - // for now (to keep things compatible) resolution overrides scale - // Support scale field on spritesheet - if (resolution === 1 && scale !== undefined && scale !== 1) + // Use a defaultValue of `null` to check if a url-based resolution is set + let resolution = core.utils.getResolutionOfUrl(resource.url, null); + + // No resolution found via URL + if (resolution === null) { - baseTexture.resolution = resolution = scale; + // Use the scale value or default to 1 + resolution = scale !== undefined ? scale : 1; + } + + // For non-1 resolutions, update baseTexture + if (resolution !== 1) + { + baseTexture.resolution = resolution; baseTexture.update(); } diff --git a/src/mesh/Mesh.js b/src/mesh/Mesh.js index 7f96afc..4621235 100644 --- a/src/mesh/Mesh.js +++ b/src/mesh/Mesh.js @@ -48,6 +48,31 @@ // uniforms// // state// + /** + * The tint applied to the mesh. This is a [r,g,b] value. A value of [1,1,1] will remove any + * tint effect. + * + * @member {number} + * @memberof PIXI.mesh.Mesh# + */ + this.tintRgb = new Float32Array([1, 1, 1]); + + /** + * A map of renderer IDs to webgl render data + * + * @private + * @member {object} + */ + this._glDatas = {}; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'mesh' + */ + this.pluginName = 'mesh'; } /** @@ -58,12 +83,34 @@ */ _renderWebGL(renderer) { - renderer.setObjectRenderer(renderer.plugins.mesh); - renderer.plugins.mesh.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** - * Calculates the bounds of the mesh. The bounds calculation takes the worldTransform into account. + * Renders the object using the Canvas renderer + * + * @private + * @param {PIXI.CanvasRenderer} renderer - The canvas renderer. + */ + _renderCanvas(renderer) + { + renderer.plugins[this.pluginName].render(this); + } + + /** + * When the texture is updated, this event will fire to update the scale and frame + * + * @private + */ + _onTextureUpdate() + { + /* empty */ + } + + /** + * Returns the bounds of the mesh as a rectangle. The bounds calculation takes the worldTransform into account. + * */ _calculateBounds() { diff --git a/test/core/Graphics.js b/test/core/Graphics.js index 0622cfc..50f775b 100644 --- a/test/core/Graphics.js +++ b/test/core/Graphics.js @@ -191,4 +191,21 @@ expect(graphics.currentPath).to.be.null; }); }); + + describe('_calculateBounds', () => + { + it('should only call updateLocalBounds once', () => + { + const graphics = new PIXI.Graphics(); + const spy = sinon.spy(graphics, 'updateLocalBounds'); + + graphics._calculateBounds(); + + expect(spy).to.have.been.calledOnce; + + graphics._calculateBounds(); + + expect(spy).to.have.been.calledOnce; + }); + }); }); diff --git a/test/interaction/InteractionManager.js b/test/interaction/InteractionManager.js new file mode 100644 index 0000000..ba3ecef --- /dev/null +++ b/test/interaction/InteractionManager.js @@ -0,0 +1,58 @@ +'use strict'; + +describe('PIXI.interaction.InteractionManager', function () +{ + describe('onClick', function () + { + function click(stage, x, y) + { + const renderer = new PIXI.CanvasRenderer(100, 100); + + renderer.sayHello = () => { /* empty */ }; + renderer.render(stage); + + renderer.plugins.interaction.mapPositionToPoint = (point) => + { + point.x = x; + point.y = y; + }; + + renderer.plugins.interaction.onMouseDown({ clientX: x, clientY: y, preventDefault: sinon.stub() }); + renderer.plugins.interaction.onMouseUp({ clientX: x, clientY: y, preventDefault: sinon.stub() }); + } + + it('should call handler when inside', function () + { + const stage = new PIXI.Container(); + const graphics = new PIXI.Graphics(); + const clickSpy = sinon.spy(); + + stage.addChild(graphics); + graphics.beginFill(0xFFFFFF); + graphics.drawRect(0, 0, 50, 50); + graphics.interactive = true; + graphics.on('click', clickSpy); + + click(stage, 10, 10); + + expect(clickSpy).to.have.been.calledOnce; + }); + + it('should not call handler when outside', function () + { + const stage = new PIXI.Container(); + const graphics = new PIXI.Graphics(); + const clickSpy = sinon.spy(); + + stage.addChild(graphics); + graphics.beginFill(0xFFFFFF); + graphics.drawRect(0, 0, 50, 50); + graphics.interactive = true; + graphics.on('click', clickSpy); + + click(stage, 60, 60); + + expect(clickSpy).to.not.have.been.called; + }); + }); +}); diff --git a/package.json b/package.json index dae5f9a..844f742 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pixi.js", - "version": "4.2.3", + "version": "4.3.0", "description": "Pixi.js is a fast lightweight 2D library that works across all devices.", "author": "Mat Groves", "contributors": [ @@ -34,8 +34,11 @@ "lintfix": "npm run lint --fix", "prebuild": "npm run lint", "build": "npm run dist", + "predist": "rimraf dist/**", "dist": "pixify -d dist -n PIXI -o pixi -t babelify", + "prelib": "rimraf lib/**", "lib": "babel src --out-dir lib -s", + "predocs": "rimraf docs/**", "docs": "jsdoc -c scripts/jsdoc.conf.json -R README.md", "publish:patch": "npm version patch --no-git-tag-version && npm publish", "publish:minor": "npm version minor --no-git-tag-version && npm publish", diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index 0adae1b..35ed5e6 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -80,13 +80,13 @@ { const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; - lt.tx = this.position._x - ((this.pivot._x * lt.a) + (this.pivot._y * lt.c)); - lt.ty = this.position._y - ((this.pivot._x * lt.b) + (this.pivot._y * lt.d)); + lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); + lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); } /** @@ -96,19 +96,20 @@ */ updateTransform(parentTransform) { - const pt = parentTransform.worldTransform; - const wt = this.worldTransform; const lt = this.localTransform; - lt.a = this._cx * this.scale._x; - lt.b = this._sx * this.scale._x; - lt.c = this._cy * this.scale._y; - lt.d = this._sy * this.scale._y; + lt.a = this._cx * this.scale.x; + lt.b = this._sx * this.scale.x; + lt.c = this._cy * this.scale.y; + lt.d = this._sy * this.scale.y; lt.tx = this.position.x - ((this.pivot.x * lt.a) + (this.pivot.y * lt.c)); lt.ty = this.position.y - ((this.pivot.x * lt.b) + (this.pivot.y * lt.d)); // concat the parent matrix with the objects transform. + const pt = parentTransform.worldTransform; + const wt = this.worldTransform; + wt.a = (lt.a * pt.a) + (lt.b * pt.c); wt.b = (lt.a * pt.b) + (lt.b * pt.d); wt.c = (lt.c * pt.a) + (lt.d * pt.c); diff --git a/src/core/graphics/Graphics.js b/src/core/graphics/Graphics.js index 6f0a417..45f7ab1 100644 --- a/src/core/graphics/Graphics.js +++ b/src/core/graphics/Graphics.js @@ -699,6 +699,9 @@ this.graphicsData.length = 0; } + this.currentPath = null; + this._spriteRect = null; + return this; } @@ -833,7 +836,6 @@ this.boundsDirty = this.dirty; this.updateLocalBounds(); - this.dirty++; this.cachedSpriteDirty = true; } diff --git a/src/core/renderers/webgl/ShaderManager.js b/src/core/renderers/webgl/ShaderManager.js index f731cb4..d541c88 100644 --- a/src/core/renderers/webgl/ShaderManager.js +++ b/src/core/renderers/webgl/ShaderManager.js @@ -31,13 +31,15 @@ this.gl = renderer.gl; } - bindShader(shader) + bindShader(shader, dontSync) { let glShader = shader.glShaders[this.renderer.CONTEXT_UID] || this.generateShader(shader); this.renderer._bindGLShader(glShader); -// this.syncUniforms(glShader, shader); - + if(!dontSync) + { + this.syncUniforms(glShader, shader); + } } generateShader(shader) diff --git a/src/core/renderers/webgl/TextureGarbageCollector.js b/src/core/renderers/webgl/TextureGarbageCollector.js index 8a3be33..ee76814 100644 --- a/src/core/renderers/webgl/TextureGarbageCollector.js +++ b/src/core/renderers/webgl/TextureGarbageCollector.js @@ -95,7 +95,8 @@ { const tm = this.renderer.textureManager; - if (displayObject._texture) + // only destroy non generated textures + if (displayObject._texture && displayObject._texture._glRenderTargets) { tm.destroyTexture(displayObject._texture, true); } diff --git a/src/core/renderers/webgl/WebGLRenderer.js b/src/core/renderers/webgl/WebGLRenderer.js index d82f0a4..7e31f1b 100644 --- a/src/core/renderers/webgl/WebGLRenderer.js +++ b/src/core/renderers/webgl/WebGLRenderer.js @@ -439,9 +439,9 @@ return this; } - bindShader(shader) + bindShader(shader, dontSync) { - this.shaderManager.bindShader(shader); + this.shaderManager.bindShader(shader, dontSync); } /** diff --git a/src/core/renderers/webgl/managers/FilterManager.js b/src/core/renderers/webgl/managers/FilterManager.js index 7c1556f..8dbbb51 100644 --- a/src/core/renderers/webgl/managers/FilterManager.js +++ b/src/core/renderers/webgl/managers/FilterManager.js @@ -533,6 +533,7 @@ renderTarget.resolution = resolution; renderTarget.defaultFrame.width = renderTarget.size.width = minWidth / resolution; renderTarget.defaultFrame.height = renderTarget.size.height = minHeight / resolution; + renderTarget.attachStencilBuffer(); return renderTarget; } diff --git a/src/core/renderers/webgl/utils/RenderTarget.js b/src/core/renderers/webgl/utils/RenderTarget.js index afe51ab..66b2574 100644 --- a/src/core/renderers/webgl/utils/RenderTarget.js +++ b/src/core/renderers/webgl/utils/RenderTarget.js @@ -162,6 +162,8 @@ this.setFrame(); + + this.resize(width, height); } diff --git a/src/core/sprites/Sprite.js b/src/core/sprites/Sprite.js index 3e58a00..025fef0 100644 --- a/src/core/sprites/Sprite.js +++ b/src/core/sprites/Sprite.js @@ -120,6 +120,15 @@ this._transformID = -1; this._textureID = -1; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'sprite' + */ + this.pluginName = 'sprite'; } /** @@ -282,8 +291,8 @@ { this.calculateVertices(); - renderer.setObjectRenderer(renderer.plugins.sprite); - renderer.plugins.sprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** @@ -294,7 +303,7 @@ */ _renderCanvas(renderer) { - renderer.plugins.sprite.render(this); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/core/text/TextStyle.js b/src/core/text/TextStyle.js index 779de13..faeb91c 100644 --- a/src/core/text/TextStyle.js +++ b/src/core/text/TextStyle.js @@ -435,22 +435,43 @@ * @param {number|number[]} color * @return {string} The color as a string. */ -function getColor(color) +function getSingleColor(color) { if (typeof color === 'number') { return hex2string(color); } - else if (Array.isArray(color)) + else if ( typeof color === 'string' ) { - for (let i = 0; i < color.length; ++i) + if ( color.indexOf('0x') === 0 ) { - if (typeof color[i] === 'number') - { - color[i] = hex2string(color[i]); - } + color = color.replace('0x', '#'); } } return color; } + +/** + * Utility function to convert hexadecimal colors to strings, and simply return the color if it's a string. + * This version can also convert array of colors + * + * @param {number|number[]} color + * @return {string} The color as a string. + */ +function getColor(color) +{ + if (!Array.isArray(color)) + { + return getSingleColor(color); + } + else + { + for (let i = 0; i < color.length; ++i) + { + color[i] = getSingleColor(color[i]); + } + + return color; + } +} diff --git a/src/core/utils/index.js b/src/core/utils/index.js index c82aaa4..2a7497b 100644 --- a/src/core/utils/index.js +++ b/src/core/utils/index.js @@ -103,9 +103,10 @@ * @memberof PIXI.utils * @function getResolutionOfUrl * @param {string} url - the image path + * @param {number} [defaultValue=1] - the defaultValue if no filename prefix is set. * @return {number} resolution / device pixel ratio of an asset */ -export function getResolutionOfUrl(url) +export function getResolutionOfUrl(url, defaultValue) { const resolution = settings.RETINA_PREFIX.exec(url); @@ -114,7 +115,7 @@ return parseFloat(resolution[1]); } - return 1; + return defaultValue !== undefined ? defaultValue : 1; } /** diff --git a/src/extras/TilingSprite.js b/src/extras/TilingSprite.js index b9352e6..a8bcfba 100644 --- a/src/extras/TilingSprite.js +++ b/src/extras/TilingSprite.js @@ -61,6 +61,15 @@ * @member {PIXI.extras.TextureTransform} */ this.uvTransform = texture.transform || new TextureTransform(texture); + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' method. + * + * @member {string} + * @default 'tilingSprite' + */ + this.pluginName = 'tilingSprite'; } /** * Changes frame clamping in corresponding textureTransform, shortcut @@ -158,8 +167,8 @@ this.tileTransform.updateLocalTransform(); this.uvTransform.update(); - renderer.setObjectRenderer(renderer.plugins.tilingSprite); - renderer.plugins.tilingSprite.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** diff --git a/src/filters/blur/BlurFilter.js b/src/filters/blur/BlurFilter.js index 5b3c3a9..8a05893 100644 --- a/src/filters/blur/BlurFilter.js +++ b/src/filters/blur/BlurFilter.js @@ -15,14 +15,15 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { super(); - this.blurXFilter = new BlurXFilter(); - this.blurYFilter = new BlurYFilter(); + this.blurXFilter = new BlurXFilter(strength, quality, resolution, kernelSize); + this.blurYFilter = new BlurYFilter(strength, quality, resolution, kernelSize); this.resolution = 1; this.padding = 0; diff --git a/src/filters/blur/BlurXFilter.js b/src/filters/blur/BlurXFilter.js index 24181b6..338096c 100644 --- a/src/filters/blur/BlurXFilter.js +++ b/src/filters/blur/BlurXFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, true); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, true); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/filters/blur/BlurYFilter.js b/src/filters/blur/BlurYFilter.js index 267728b..94cbf37 100644 --- a/src/filters/blur/BlurYFilter.js +++ b/src/filters/blur/BlurYFilter.js @@ -15,12 +15,14 @@ /** * @param {number} strength - The strength of the blur filter. * @param {number} quality - The quality of the blur filter. - * @param {number} resolution - The reoslution of the blur filter. + * @param {number} resolution - The resolution of the blur filter. + * @param {number} [kernelSize=5] - The kernelSize of the blur filter.Options: 5, 7, 9, 11, 13, 15. */ - constructor(strength, quality, resolution) + constructor(strength, quality, resolution, kernelSize) { - const vertSrc = generateBlurVertSource(5, false); - const fragSrc = generateBlurFragSource(5); + kernelSize = kernelSize || 5; + const vertSrc = generateBlurVertSource(kernelSize, false); + const fragSrc = generateBlurFragSource(kernelSize); super( // vertex shader diff --git a/src/interaction/InteractionEvent.js b/src/interaction/InteractionEvent.js index 0342469..75b2966 100644 --- a/src/interaction/InteractionEvent.js +++ b/src/interaction/InteractionEvent.js @@ -12,14 +12,15 @@ constructor() { /** - * Which this event will continue propagating in the tree + * Whether this event will continue propagating in the tree * * @member {boolean} */ this.stopped = false; /** - * The object to which event is dispatched. + * The object which caused this event to be dispatched. + * For listener callback see {@link PIXI.interaction.InteractionEvent.currentTarget}. * * @member {PIXI.DisplayObject} */ diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index ca2b14d..05f6628 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -105,15 +105,16 @@ this.interactionDOMElement = null; /** - * This property determins if mousemove and touchmove events are fired only when the cursror + * This property determines if mousemove and touchmove events are fired only when the cursror * is over the object. * Setting to true will make things work more in line with how the DOM verison works. * Setting to false can make things easier for things like dragging * It is currently set to false as this is how pixi used to work. This will be set to true in * future versions of pixi. * - * @private - * @member {boolean} + * @member {boolean} moveWhenInside + * @memberof PIXI.interaction.InteractionManager# + * @default false */ this.moveWhenInside = false; diff --git a/src/loaders/spritesheetParser.js b/src/loaders/spritesheetParser.js index 2d637b1..2b30b1c 100644 --- a/src/loaders/spritesheetParser.js +++ b/src/loaders/spritesheetParser.js @@ -43,14 +43,22 @@ const frames = resource.data.frames; const frameKeys = Object.keys(frames); const baseTexture = res.texture.baseTexture; - let resolution = core.utils.getResolutionOfUrl(resource.url); const scale = resource.data.meta.scale; - // for now (to keep things compatible) resolution overrides scale - // Support scale field on spritesheet - if (resolution === 1 && scale !== undefined && scale !== 1) + // Use a defaultValue of `null` to check if a url-based resolution is set + let resolution = core.utils.getResolutionOfUrl(resource.url, null); + + // No resolution found via URL + if (resolution === null) { - baseTexture.resolution = resolution = scale; + // Use the scale value or default to 1 + resolution = scale !== undefined ? scale : 1; + } + + // For non-1 resolutions, update baseTexture + if (resolution !== 1) + { + baseTexture.resolution = resolution; baseTexture.update(); } diff --git a/src/mesh/Mesh.js b/src/mesh/Mesh.js index 7f96afc..4621235 100644 --- a/src/mesh/Mesh.js +++ b/src/mesh/Mesh.js @@ -48,6 +48,31 @@ // uniforms// // state// + /** + * The tint applied to the mesh. This is a [r,g,b] value. A value of [1,1,1] will remove any + * tint effect. + * + * @member {number} + * @memberof PIXI.mesh.Mesh# + */ + this.tintRgb = new Float32Array([1, 1, 1]); + + /** + * A map of renderer IDs to webgl render data + * + * @private + * @member {object} + */ + this._glDatas = {}; + + /** + * Plugin that is responsible for rendering this element. + * Allows to customize the rendering process without overriding '_renderWebGL' & '_renderCanvas' methods. + * + * @member {string} + * @default 'mesh' + */ + this.pluginName = 'mesh'; } /** @@ -58,12 +83,34 @@ */ _renderWebGL(renderer) { - renderer.setObjectRenderer(renderer.plugins.mesh); - renderer.plugins.mesh.render(this); + renderer.setObjectRenderer(renderer.plugins[this.pluginName]); + renderer.plugins[this.pluginName].render(this); } /** - * Calculates the bounds of the mesh. The bounds calculation takes the worldTransform into account. + * Renders the object using the Canvas renderer + * + * @private + * @param {PIXI.CanvasRenderer} renderer - The canvas renderer. + */ + _renderCanvas(renderer) + { + renderer.plugins[this.pluginName].render(this); + } + + /** + * When the texture is updated, this event will fire to update the scale and frame + * + * @private + */ + _onTextureUpdate() + { + /* empty */ + } + + /** + * Returns the bounds of the mesh as a rectangle. The bounds calculation takes the worldTransform into account. + * */ _calculateBounds() { diff --git a/test/core/Graphics.js b/test/core/Graphics.js index 0622cfc..50f775b 100644 --- a/test/core/Graphics.js +++ b/test/core/Graphics.js @@ -191,4 +191,21 @@ expect(graphics.currentPath).to.be.null; }); }); + + describe('_calculateBounds', () => + { + it('should only call updateLocalBounds once', () => + { + const graphics = new PIXI.Graphics(); + const spy = sinon.spy(graphics, 'updateLocalBounds'); + + graphics._calculateBounds(); + + expect(spy).to.have.been.calledOnce; + + graphics._calculateBounds(); + + expect(spy).to.have.been.calledOnce; + }); + }); }); diff --git a/test/interaction/InteractionManager.js b/test/interaction/InteractionManager.js new file mode 100644 index 0000000..ba3ecef --- /dev/null +++ b/test/interaction/InteractionManager.js @@ -0,0 +1,58 @@ +'use strict'; + +describe('PIXI.interaction.InteractionManager', function () +{ + describe('onClick', function () + { + function click(stage, x, y) + { + const renderer = new PIXI.CanvasRenderer(100, 100); + + renderer.sayHello = () => { /* empty */ }; + renderer.render(stage); + + renderer.plugins.interaction.mapPositionToPoint = (point) => + { + point.x = x; + point.y = y; + }; + + renderer.plugins.interaction.onMouseDown({ clientX: x, clientY: y, preventDefault: sinon.stub() }); + renderer.plugins.interaction.onMouseUp({ clientX: x, clientY: y, preventDefault: sinon.stub() }); + } + + it('should call handler when inside', function () + { + const stage = new PIXI.Container(); + const graphics = new PIXI.Graphics(); + const clickSpy = sinon.spy(); + + stage.addChild(graphics); + graphics.beginFill(0xFFFFFF); + graphics.drawRect(0, 0, 50, 50); + graphics.interactive = true; + graphics.on('click', clickSpy); + + click(stage, 10, 10); + + expect(clickSpy).to.have.been.calledOnce; + }); + + it('should not call handler when outside', function () + { + const stage = new PIXI.Container(); + const graphics = new PIXI.Graphics(); + const clickSpy = sinon.spy(); + + stage.addChild(graphics); + graphics.beginFill(0xFFFFFF); + graphics.drawRect(0, 0, 50, 50); + graphics.interactive = true; + graphics.on('click', clickSpy); + + click(stage, 60, 60); + + expect(clickSpy).to.not.have.been.called; + }); + }); +}); diff --git a/test/interaction/index.js b/test/interaction/index.js index 9c88370..fd84330 100644 --- a/test/interaction/index.js +++ b/test/interaction/index.js @@ -1,3 +1,4 @@ 'use strict'; require('./InteractionData'); +require('./InteractionManager');