From 73190f2419ea7b44cab111239ba57780f0be51ed Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Sun, 24 Dec 2023 10:58:10 +0530 Subject: [PATCH 01/14] Update loadModel() --- src/webgl/loading.js | 24 +++++++++++------------- 1 file changed, 11 insertions(+), 13 deletions(-) diff --git a/src/webgl/loading.js b/src/webgl/loading.js index 1e616b052f..193dfd5a8c 100755 --- a/src/webgl/loading.js +++ b/src/webgl/loading.js @@ -98,27 +98,25 @@ import './p5.Geometry'; /** * @method loadModel * @param {String} path - * @param {function(p5.Geometry)} [successCallback] - * @param {function(Event)} [failureCallback] - * @param {String} [fileType] + * @param {Object} [options] + * @param {function(p5.Geometry)} [options.successCallback] + * @param {function(Event)} [options.failureCallback] + * @param {String} [options.fileType] + * @param {boolean} [options.normalize] * @return {p5.Geometry} the p5.Geometry object */ -p5.prototype.loadModel = function(path) { +p5.prototype.loadModel = function(path,options) { p5._validateParameters('loadModel', arguments); let normalize; let successCallback; let failureCallback; let fileType = path.slice(-4); - if (typeof arguments[1] === 'boolean') { - normalize = arguments[1]; - successCallback = arguments[2]; - failureCallback = arguments[3]; - if (typeof arguments[4] !== 'undefined') { - fileType = arguments[4]; - } + if (options && typeof options === 'object') { + normalize = options.normalize || false; + successCallback = options.successCallback; + failureCallback = options.failureCallback; } else { - normalize = false; - successCallback = arguments[1]; + successCallback = typeof arguments[1] === 'function' ? arguments[1] : undefined; failureCallback = arguments[2]; if (typeof arguments[3] !== 'undefined') { fileType = arguments[3]; From c56caaee0c2274eea3c91d6264d813a2ab442821 Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Sun, 24 Dec 2023 11:00:04 +0530 Subject: [PATCH 02/14] introduce flipU() and flipV() models --- src/webgl/p5.Geometry.js | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/src/webgl/p5.Geometry.js b/src/webgl/p5.Geometry.js index 76c8ed8ad4..3a52f14ef5 100644 --- a/src/webgl/p5.Geometry.js +++ b/src/webgl/p5.Geometry.js @@ -142,6 +142,24 @@ p5.Geometry = class Geometry { this.vertexColors = []; return this; } + flipU() { + this.uvs = this.uvs.flat().map((val, index) => { + if (index % 2 === 0) { + return 1 - val; + } else { + return val; + } + }); + } + flipV() { + this.uvs = this.uvs.flat().map((val, index) => { + if (index % 2 === 0) { + return val; + } else { + return 1 - val; + } + }); + } /** * computes faces for geometry objects based on the vertices. * @method computeFaces From 1120c237494d39c8a8a178b3f92cbf330eae296d Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Thu, 28 Dec 2023 13:18:50 +0530 Subject: [PATCH 03/14] additional third function signature added --- src/webgl/loading.js | 82 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 82 insertions(+) diff --git a/src/webgl/loading.js b/src/webgl/loading.js index 193dfd5a8c..a4e9479aa0 100755 --- a/src/webgl/loading.js +++ b/src/webgl/loading.js @@ -95,6 +95,88 @@ import './p5.Geometry'; * @alt * Vertically rotating 3-d teapot with red, green and blue gradient. */ +/** + * @method loadModel + * @param {String} path + * @param {function(p5.Geometry)} [successCallback] + * @param {function(Event)} [failureCallback] + * @param {String} [fileType] + * @return {p5.Geometry} the p5.Geometry object + */ +p5.prototype.loadModel = function(path) { + p5._validateParameters('loadModel', arguments); + let normalize; + let successCallback; + let failureCallback; + let fileType = path.slice(-4); + if (typeof arguments[1] === 'boolean') { + normalize = arguments[1]; + successCallback = arguments[2]; + failureCallback = arguments[3]; + if (typeof arguments[4] !== 'undefined') { + fileType = arguments[4]; + } + } else { + normalize = false; + successCallback = arguments[1]; + failureCallback = arguments[2]; + if (typeof arguments[3] !== 'undefined') { + fileType = arguments[3]; + } + } + + const model = new p5.Geometry(); + model.gid = `${path}|${normalize}`; + const self = this; + + if (fileType.match(/\.stl$/i)) { + this.httpDo( + path, + 'GET', + 'arrayBuffer', + arrayBuffer => { + parseSTL(model, arrayBuffer); + + if (normalize) { + model.normalize(); + } + self._decrementPreload(); + if (typeof successCallback === 'function') { + successCallback(model); + } + }, + failureCallback + ); + } else if (fileType.match(/\.obj$/i)) { + this.loadStrings( + path, + strings => { + parseObj(model, strings); + + if (normalize) { + model.normalize(); + } + + self._decrementPreload(); + if (typeof successCallback === 'function') { + successCallback(model); + } + }, + failureCallback + ); + } else { + p5._friendlyFileLoadError(3, path); + + if (failureCallback) { + failureCallback(); + } else { + p5._friendlyError( + 'Sorry, the file type is invalid. Only OBJ and STL files are supported.' + ); + } + } + return model; +}; /** * @method loadModel * @param {String} path From a0e70f1e622c6de32cf47a43061a4baf4fbeed73 Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Thu, 28 Dec 2023 14:09:49 +0530 Subject: [PATCH 04/14] updated options signature to handle all cases --- src/webgl/loading.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/webgl/loading.js b/src/webgl/loading.js index a4e9479aa0..a752ba7f58 100755 --- a/src/webgl/loading.js +++ b/src/webgl/loading.js @@ -189,7 +189,7 @@ p5.prototype.loadModel = function(path) { */ p5.prototype.loadModel = function(path,options) { p5._validateParameters('loadModel', arguments); - let normalize; + let normalize= false; let successCallback; let failureCallback; let fileType = path.slice(-4); @@ -197,6 +197,14 @@ p5.prototype.loadModel = function(path,options) { normalize = options.normalize || false; successCallback = options.successCallback; failureCallback = options.failureCallback; + fileType = options.fileType || fileType; + } else if (typeof options === 'boolean') { + normalize = options; + successCallback = arguments[2]; + failureCallback = arguments[3]; + if (typeof arguments[4] !== 'undefined') { + fileType = arguments[4]; + } } else { successCallback = typeof arguments[1] === 'function' ? arguments[1] : undefined; failureCallback = arguments[2]; From 23158171d68f089456d97f95e33b1b2249060d87 Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Thu, 28 Dec 2023 21:17:01 +0530 Subject: [PATCH 05/14] Update loading.js --- src/webgl/loading.js | 71 -------------------------------------------- 1 file changed, 71 deletions(-) diff --git a/src/webgl/loading.js b/src/webgl/loading.js index a752ba7f58..6006fdf6e7 100755 --- a/src/webgl/loading.js +++ b/src/webgl/loading.js @@ -103,77 +103,6 @@ import './p5.Geometry'; * @param {String} [fileType] * @return {p5.Geometry} the p5.Geometry object */ -p5.prototype.loadModel = function(path) { - p5._validateParameters('loadModel', arguments); - let normalize; - let successCallback; - let failureCallback; - let fileType = path.slice(-4); - if (typeof arguments[1] === 'boolean') { - normalize = arguments[1]; - successCallback = arguments[2]; - failureCallback = arguments[3]; - if (typeof arguments[4] !== 'undefined') { - fileType = arguments[4]; - } - } else { - normalize = false; - successCallback = arguments[1]; - failureCallback = arguments[2]; - if (typeof arguments[3] !== 'undefined') { - fileType = arguments[3]; - } - } - - const model = new p5.Geometry(); - model.gid = `${path}|${normalize}`; - const self = this; - - if (fileType.match(/\.stl$/i)) { - this.httpDo( - path, - 'GET', - 'arrayBuffer', - arrayBuffer => { - parseSTL(model, arrayBuffer); - - if (normalize) { - model.normalize(); - } - self._decrementPreload(); - if (typeof successCallback === 'function') { - successCallback(model); - } - }, - failureCallback - ); - } else if (fileType.match(/\.obj$/i)) { - this.loadStrings( - path, - strings => { - parseObj(model, strings); - - if (normalize) { - model.normalize(); - } - - self._decrementPreload(); - if (typeof successCallback === 'function') { - successCallback(model); - } - }, - failureCallback - ); - } else { - p5._friendlyFileLoadError(3, path); - - if (failureCallback) { - failureCallback(); - } else { - p5._friendlyError( - 'Sorry, the file type is invalid. Only OBJ and STL files are supported.' - ); - } } return model; }; From d29e00e07fb87c7142d2e8c0f60b34bbd16194c6 Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Thu, 28 Dec 2023 21:18:56 +0530 Subject: [PATCH 06/14] Update loading.js --- src/webgl/loading.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/webgl/loading.js b/src/webgl/loading.js index 6006fdf6e7..bef4a38317 100755 --- a/src/webgl/loading.js +++ b/src/webgl/loading.js @@ -103,7 +103,6 @@ import './p5.Geometry'; * @param {String} [fileType] * @return {p5.Geometry} the p5.Geometry object */ - } return model; }; /** From be10630a25015de15cbdefe712ef7f5c352070fc Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Thu, 28 Dec 2023 22:05:13 +0530 Subject: [PATCH 07/14] flipU and flipV properties added to the object --- src/webgl/loading.js | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/src/webgl/loading.js b/src/webgl/loading.js index bef4a38317..b2a63dc462 100755 --- a/src/webgl/loading.js +++ b/src/webgl/loading.js @@ -113,6 +113,8 @@ import './p5.Geometry'; * @param {function(Event)} [options.failureCallback] * @param {String} [options.fileType] * @param {boolean} [options.normalize] + * @param {boolean} [options.flipU] + * @param {boolean} [options.flipV] * @return {p5.Geometry} the p5.Geometry object */ p5.prototype.loadModel = function(path,options) { @@ -120,12 +122,16 @@ p5.prototype.loadModel = function(path,options) { let normalize= false; let successCallback; let failureCallback; + let flipU = false; + let flipV = false; let fileType = path.slice(-4); if (options && typeof options === 'object') { normalize = options.normalize || false; successCallback = options.successCallback; failureCallback = options.failureCallback; fileType = options.fileType || fileType; + flipU = options.flipU || false; + flipV = options.flipV || false; } else if (typeof options === 'boolean') { normalize = options; successCallback = arguments[2]; @@ -156,6 +162,15 @@ p5.prototype.loadModel = function(path,options) { if (normalize) { model.normalize(); } + + if (flipU) { + model.flipU(); + } + + if (flipV) { + model.flipV(); + } + self._decrementPreload(); if (typeof successCallback === 'function') { successCallback(model); @@ -173,6 +188,14 @@ p5.prototype.loadModel = function(path,options) { model.normalize(); } + if (flipU) { + model.flipU(); + } + + if (flipV) { + model.flipV(); + } + self._decrementPreload(); if (typeof successCallback === 'function') { successCallback(model); From a3c691a6d859eb51829e14f325e3a5dcfcf779c2 Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Thu, 28 Dec 2023 23:13:22 +0530 Subject: [PATCH 08/14] Update loading.js --- src/webgl/loading.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/webgl/loading.js b/src/webgl/loading.js index b2a63dc462..36b01376b3 100755 --- a/src/webgl/loading.js +++ b/src/webgl/loading.js @@ -103,8 +103,6 @@ import './p5.Geometry'; * @param {String} [fileType] * @return {p5.Geometry} the p5.Geometry object */ - return model; -}; /** * @method loadModel * @param {String} path From fdcc1429bdb305ce3646563ee19308f2bc81b1f8 Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Thu, 28 Dec 2023 23:15:35 +0530 Subject: [PATCH 09/14] Update loading.js From 4670f71f5291569d3807ceadbe8459cf5d9c010a Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Thu, 28 Dec 2023 23:26:09 +0530 Subject: [PATCH 10/14] Update loading.js --- src/webgl/loading.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webgl/loading.js b/src/webgl/loading.js index 36b01376b3..f525aa8ad3 100755 --- a/src/webgl/loading.js +++ b/src/webgl/loading.js @@ -168,7 +168,7 @@ p5.prototype.loadModel = function(path,options) { if (flipV) { model.flipV(); } - + self._decrementPreload(); if (typeof successCallback === 'function') { successCallback(model); From 9c53617dea5e7f4eb9d5b753f02cc2c5ee75dc34 Mon Sep 17 00:00:00 2001 From: Deveshi Dwivedi <120312681+deveshidwivedi@users.noreply.github.com> Date: Fri, 29 Dec 2023 00:26:16 +0530 Subject: [PATCH 11/14] added example codes --- src/webgl/p5.Geometry.js | 70 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 70 insertions(+) diff --git a/src/webgl/p5.Geometry.js b/src/webgl/p5.Geometry.js index 3a52f14ef5..c5992b40aa 100644 --- a/src/webgl/p5.Geometry.js +++ b/src/webgl/p5.Geometry.js @@ -142,6 +142,41 @@ p5.Geometry = class Geometry { this.vertexColors = []; return this; } + /** + * Flips the U texture coordinates of the model. + * @method flipU + * @for p5.Geometry + * + * @returns {p5.Geometry} + * + * @example + *
+ * let modelU;
+ *
+ * function preload() {
+ * modelU = loadModel('path/to/your/model.obj');
+ *
+ * modelU.flipU();
+ * }
+ *
+ * function setup() {
+ * createCanvas(400, 400, WEBGL);
+ * background(200);
+ *
+ * // Original model (no texture coordinate flipping)
+ * fill('orange');
+ * translate(-100, 0, 0);
+ * model(modelU);
+ *
+ * // Flipped U texture coordinates model
+ * fill('blue');
+ * translate(200, 0, 0);
+ * model(modelU);
+ * }
+ *
+ *
+ * let modelV;
+ *
+ * function preload() {
+ * modelV = loadModel('path/to/your/model.obj');
+ *
+ * modelV.flipV();
+ * }
+ *
+ * function setup() {
+ * createCanvas(400, 400, WEBGL);
+ * background(200);
+ *
+ * // Original model (no texture coordinate flipping)
+ * fill('orange');
+ * translate(-100, 0, 0);
+ * model(modelV);
+ *
+ * // Flipped V texture coordinates model
+ * fill('purple');
+ * translate(200, 0, 0);
+ * model(modelV);
+ * }
+ *
+ *
- * let modelU;
+ * let img;
+ * let model1;
+ * let model2;
*
* function preload() {
- * modelU = loadModel('path/to/your/model.obj');
- *
- * modelU.flipU();
+ * img = loadImage('assets/laDefense.jpg');
* }
*
* function setup() {
- * createCanvas(400, 400, WEBGL);
+ * createCanvas(150, 150, WEBGL);
* background(200);
*
- * // Original model (no texture coordinate flipping)
- * fill('orange');
- * translate(-100, 0, 0);
- * model(modelU);
+ * model1 = createShape(50, 50);
+ * model2 = createShape(50, 50);
+ * model2.flipU();
+ * }
+ *
+ * function draw() {
+ * background(0);
+ *
+ * // original
+ * push();
+ * translate(-40, 0, 0);
+ * texture(img);
+ * noStroke();
+ * plane(50);
+ * model(model1);
+ * pop();
+ *
+ * // flipped
+ * push();
+ * translate(40, 0, 0);
+ * texture(img);
+ * noStroke();
+ * plane(50);
+ * model(model2);
+ * pop();
+ * }
*
- * // Flipped U texture coordinates model
- * fill('blue');
- * translate(200, 0, 0);
- * model(modelU);
+ * function createShape(w, h) {
+ * return buildGeometry(() => {
+ * textureMode(NORMAL);
+ * beginShape();
+ * vertex(-w / 2, -h / 2, 0, 0);
+ * vertex(w / 2, -h / 2, 1, 0);
+ * vertex(w / 2, h / 2, 1, 1);
+ * vertex(-w / 2, h / 2, 0, 1);
+ * endShape(CLOSE);
+ * });
* }
*
*
- * let modelV;
+ * let img;
+ * let model1;
+ * let model2;
*
* function preload() {
- * modelV = loadModel('path/to/your/model.obj');
- *
- * modelV.flipV();
+ * img = loadImage('assets/laDefense.jpg');
* }
*
* function setup() {
- * createCanvas(400, 400, WEBGL);
+ * createCanvas(150, 150, WEBGL);
* background(200);
*
- * // Original model (no texture coordinate flipping)
- * fill('orange');
- * translate(-100, 0, 0);
- * model(modelV);
+ * model1 = createShape(50, 50);
+ * model2 = createShape(50, 50);
+ * model2.flipV();
+ * }
+ *
+ * function draw() {
+ * background(0);
+ *
+ * // original
+ * push();
+ * translate(-40, 0, 0);
+ * texture(img);
+ * noStroke();
+ * plane(50);
+ * model(model1);
+ * pop();
+ *
+ * // flipped
+ * push();
+ * translate(40, 0, 0);
+ * texture(img);
+ * noStroke();
+ * plane(50);
+ * model(model2);
+ * pop();
+ * }
*
- * // Flipped V texture coordinates model
- * fill('purple');
- * translate(200, 0, 0);
- * model(modelV);
+ * function createShape(w, h) {
+ * return buildGeometry(() => {
+ * textureMode(NORMAL);
+ * beginShape();
+ * vertex(-w / 2, -h / 2, 0, 0);
+ * vertex(w / 2, -h / 2, 1, 0);
+ * vertex(w / 2, h / 2, 1, 1);
+ * vertex(-w / 2, h / 2, 0, 1);
+ * endShape(CLOSE);
+ * });
* }
*
*