Skip to content

fix: replace console.log/warn with p5._friendlyError in p5.Texture (fixes #8585) #8586

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
MASTERsj01 wants to merge 1 commit into
base: main
Choose a base branch
from
+38 −34
Open

fix: replace console.log/warn with p5._friendlyError in p5.Texture (fixes #8585) #8586

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
72 changes: 38 additions & 34 deletions src/webgl/p5.Texture.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ import * as constants from '../core/constants';
* formats that are not implemented in p5. Defaults to gl.UNSIGNED_BYTE.
*/
p5.Texture = class Texture {
constructor (renderer, obj, settings) {
constructor(renderer, obj, settings) {
this._renderer = renderer;

const gl = this._renderer.GL;
Expand All @@ -61,28 +61,28 @@ p5.Texture = class Texture {

const support = checkWebGLCapabilities(renderer);
if (this.glFormat === gl.HALF_FLOAT && !support.halfFloat) {
console.log('This device does not support dataType HALF_FLOAT. Falling back to FLOAT.');
p5._friendlyError('This device does not support dataType HALF_FLOAT. Falling back to FLOAT.', 'p5.Texture');
this.glDataType = gl.FLOAT;
}
if (
this.glFormat === gl.HALF_FLOAT &&
(this.glMinFilter === gl.LINEAR || this.glMagFilter === gl.LINEAR) &&
!support.halfFloatLinear
) {
console.log('This device does not support linear filtering for dataType FLOAT. Falling back to NEAREST.');
p5._friendlyError('This device does not support linear filtering for dataType FLOAT. Falling back to NEAREST.', 'p5.Texture');
if (this.glMinFilter === gl.LINEAR) this.glMinFilter = gl.NEAREST;
if (this.glMagFilter === gl.LINEAR) this.glMagFilter = gl.NEAREST;
}
if (this.glFormat === gl.FLOAT && !support.float) {
console.log('This device does not support dataType FLOAT. Falling back to UNSIGNED_BYTE.');
p5._friendlyError('This device does not support dataType FLOAT. Falling back to UNSIGNED_BYTE.', 'p5.Texture');
this.glDataType = gl.UNSIGNED_BYTE;
}
if (
this.glFormat === gl.FLOAT &&
(this.glMinFilter === gl.LINEAR || this.glMagFilter === gl.LINEAR) &&
!support.floatLinear
) {
console.log('This device does not support linear filtering for dataType FLOAT. Falling back to NEAREST.');
p5._friendlyError('This device does not support linear filtering for dataType FLOAT. Falling back to NEAREST.', 'p5.Texture');
if (this.glMinFilter === gl.LINEAR) this.glMinFilter = gl.NEAREST;
if (this.glMagFilter === gl.LINEAR) this.glMagFilter = gl.NEAREST;
}
Expand Down Expand Up @@ -112,20 +112,20 @@ p5.Texture = class Texture {
return this;
}

_getTextureDataFromSource () {
_getTextureDataFromSource() {
let textureData;
if (this.isFramebufferTexture) {
textureData = this.src.rawTexture();
} else if (this.isSrcP5Image) {
// param is a p5.Image
// param is a p5.Image
textureData = this.src.canvas;
} else if (
this.isSrcMediaElement ||
this.isSrcP5Graphics ||
this.isSrcP5Renderer ||
this.isSrcHTMLElement
this.isSrcP5Graphics ||
this.isSrcP5Renderer ||
this.isSrcHTMLElement
) {
// if param is a video HTML element
// if param is a video HTML element
if (this.src._ensureCanvas) {
this.src._ensureCanvas();
}
Expand All @@ -143,7 +143,7 @@ p5.Texture = class Texture {
* @private
* @method init
*/
init (data) {
init(data) {
const gl = this._renderer.GL;
if (!this.isFramebufferTexture) {
this.glTex = gl.createTexture();
Expand All @@ -166,8 +166,8 @@ p5.Texture = class Texture {
this.height === 0 ||
(this.isSrcMediaElement && !this.src.loadedmetadata)
) {
// assign a 1×1 empty texture initially, because data is not yet ready,
// so that no errors occur in gl console!
// assign a 1×1 empty texture initially, because data is not yet ready,
// so that no errors occur in gl console!
const tmpdata = new Uint8Array([1, 1, 1, 1]);
gl.texImage2D(
this.glTarget,
Expand All @@ -181,7 +181,7 @@ p5.Texture = class Texture {
tmpdata
);
} else {
// data is ready: just push the texture!
// data is ready: just push the texture!
gl.texImage2D(
this.glTarget,
0,
Expand All @@ -200,7 +200,7 @@ p5.Texture = class Texture {
* not the data has occurred, this method simply re-uploads the texture.
* @method update
*/
update () {
update() {
const data = this.src;
if (data.width === 0 || data.height === 0) {
return false; // nothing to do!
Expand Down Expand Up @@ -299,7 +299,7 @@ p5.Texture = class Texture {
* Binds the texture to the appropriate GL target.
* @method bindTexture
*/
bindTexture () {
bindTexture() {
// bind texture using gl context + glTarget and
// generated gl texture object
const gl = this._renderer.GL;
Expand All @@ -312,7 +312,7 @@ p5.Texture = class Texture {
* Unbinds the texture from the appropriate GL target.
* @method unbindTexture
*/
unbindTexture () {
unbindTexture() {
// unbind per above, disable texturing on glTarget
const gl = this._renderer.GL;
gl.bindTexture(this.glTarget, null);
Expand All @@ -337,7 +337,7 @@ p5.Texture = class Texture {
* textures are magnified. Options are LINEAR or NEAREST
* @todo implement mipmapping filters
*/
setInterpolation (downScale, upScale) {
setInterpolation(downScale, upScale) {
const gl = this._renderer.GL;

this.glMinFilter = this.glFilter(downScale);
Expand Down Expand Up @@ -367,7 +367,7 @@ p5.Texture = class Texture {
* @param {String} wrapX Controls the horizontal texture wrapping behavior
* @param {String} wrapY Controls the vertical texture wrapping behavior
*/
setWrapMode (wrapX, wrapY) {
setWrapMode(wrapX, wrapY) {
const gl = this._renderer.GL;

// for webgl 1 we need to check if the texture is power of two
Expand All @@ -393,24 +393,26 @@ p5.Texture = class Texture {
if (wrapX === constants.REPEAT) {
if (
this._renderer.webglVersion === constants.WEBGL2 ||
(widthPowerOfTwo && heightPowerOfTwo)
(widthPowerOfTwo && heightPowerOfTwo)
) {
this.glWrapS = gl.REPEAT;
} else {
console.warn(
'You tried to set the wrap mode to REPEAT but the texture size is not a power of two. Setting to CLAMP instead'
p5._friendlyError(
'You tried to set the wrap mode to REPEAT but the texture size is not a power of two. Setting to CLAMP instead.',
'p5.Texture.setWrapMode'
);
this.glWrapS = gl.CLAMP_TO_EDGE;
}
} else if (wrapX === constants.MIRROR) {
if (
this._renderer.webglVersion === constants.WEBGL2 ||
(widthPowerOfTwo && heightPowerOfTwo)
(widthPowerOfTwo && heightPowerOfTwo)
) {
this.glWrapS = gl.MIRRORED_REPEAT;
} else {
console.warn(
'You tried to set the wrap mode to MIRROR but the texture size is not a power of two. Setting to CLAMP instead'
p5._friendlyError(
'You tried to set the wrap mode to MIRROR but the texture size is not a power of two. Setting to CLAMP instead.',
'p5.Texture.setWrapMode'
);
this.glWrapS = gl.CLAMP_TO_EDGE;
}
Expand All @@ -422,24 +424,26 @@ p5.Texture = class Texture {
if (wrapY === constants.REPEAT) {
if (
this._renderer.webglVersion === constants.WEBGL2 ||
(widthPowerOfTwo && heightPowerOfTwo)
(widthPowerOfTwo && heightPowerOfTwo)
) {
this.glWrapT = gl.REPEAT;
} else {
console.warn(
'You tried to set the wrap mode to REPEAT but the texture size is not a power of two. Setting to CLAMP instead'
p5._friendlyError(
'You tried to set the wrap mode to REPEAT but the texture size is not a power of two. Setting to CLAMP instead.',
'p5.Texture.setWrapMode'
);
this.glWrapT = gl.CLAMP_TO_EDGE;
}
} else if (wrapY === constants.MIRROR) {
if (
this._renderer.webglVersion === constants.WEBGL2 ||
(widthPowerOfTwo && heightPowerOfTwo)
(widthPowerOfTwo && heightPowerOfTwo)
) {
this.glWrapT = gl.MIRRORED_REPEAT;
} else {
console.warn(
'You tried to set the wrap mode to MIRROR but the texture size is not a power of two. Setting to CLAMP instead'
p5._friendlyError(
'You tried to set the wrap mode to MIRROR but the texture size is not a power of two. Setting to CLAMP instead.',
'p5.Texture.setWrapMode'
);
this.glWrapT = gl.CLAMP_TO_EDGE;
}
Expand Down Expand Up @@ -517,14 +521,14 @@ export class MipmapTexture extends p5.Texture {
this.unbindTexture();
}

update() {}
update() { }
}

export function checkWebGLCapabilities({ GL, webglVersion }) {
const gl = GL;
const supportsFloat = webglVersion === constants.WEBGL2
? (gl.getExtension('EXT_color_buffer_float') &&
gl.getExtension('EXT_float_blend'))
gl.getExtension('EXT_float_blend'))
: gl.getExtension('OES_texture_float');
const supportsFloatLinear = supportsFloat &&
gl.getExtension('OES_texture_float_linear');
Expand Down