diff --git a/javascript/MaterialXView/package-lock.json b/javascript/MaterialXView/package-lock.json index 7a8e6f71d7..d5338a3517 100644 --- a/javascript/MaterialXView/package-lock.json +++ b/javascript/MaterialXView/package-lock.json @@ -10,7 +10,7 @@ "license": "ISC", "dependencies": { "dat.gui": "^0.7.9", - "three": "^0.136.0", + "three": "^0.152.2", "webpack": "^5.89.0" }, "devDependencies": { @@ -161,9 +161,9 @@ } }, "node_modules/@types/eslint": { - "version": "8.44.8", - "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.44.8.tgz", - "integrity": "sha512-4K8GavROwhrYl2QXDXm0Rv9epkA8GBFu0EI+XrrnnuCl7u8CWBRusX7fXJfanhZTDWSAL24gDI/UqXyUM0Injw==", + "version": "8.44.9", + "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.44.9.tgz", + "integrity": "sha512-6yBxcvwnnYoYT1Uk2d+jvIfsuP4mb2EdIxFnrPABj5a/838qe5bGkNLFOiipX4ULQ7XVQvTxOh7jO+BTAiqsEw==", "dependencies": { "@types/estree": "*", "@types/json-schema": "*" @@ -806,9 +806,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001566", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001566.tgz", - "integrity": "sha512-ggIhCsTxmITBAMmK8yZjEhCO5/47jKXPu6Dha/wuCS4JePVL+3uiDEBuhu2aIoT+bqTOR8L76Ip1ARL9xYsEJA==", + "version": "1.0.30001570", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001570.tgz", + "integrity": "sha512-+3e0ASu4sw1SWaoCtvPeyXp+5PsjigkSt8OXZbF9StH5pQWbxEjLAZE3n8Aup5udop1uRiKA7a4utUk/uoSpUw==", "funding": [ { "type": "opencollective", @@ -1245,9 +1245,9 @@ "dev": true }, "node_modules/electron-to-chromium": { - "version": "1.4.609", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.609.tgz", - "integrity": "sha512-ihiCP7PJmjoGNuLpl7TjNA8pCQWu09vGyjlPYw1Rqww4gvNuCcmvl+44G+2QyJ6S2K4o+wbTS++Xz0YN8Q9ERw==" + "version": "1.4.613", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.613.tgz", + "integrity": "sha512-r4x5+FowKG6q+/Wj0W9nidx7QO31BJwmR2uEo+Qh3YLGQ8SbBAFuDFpTxzly/I2gsbrFwBuIjrMp423L3O5U3w==" }, "node_modules/encodeurl": { "version": "1.0.2", @@ -3542,9 +3542,9 @@ "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==" }, "node_modules/three": { - "version": "0.136.0", - "resolved": "https://registry.npmjs.org/three/-/three-0.136.0.tgz", - "integrity": "sha512-+fEMX7nYLz2ZesVP/dyifli5Jf8gR3XPAnFJveQ80aMhibFduzrADnjMbARXh8+W9qLK7rshJCjAIL/6cDxC+A==" + "version": "0.152.2", + "resolved": "https://registry.npmjs.org/three/-/three-0.152.2.tgz", + "integrity": "sha512-Ff9zIpSfkkqcBcpdiFo2f35vA9ZucO+N8TNacJOqaEE6DrB0eufItVMib8bK8Pcju/ZNT6a7blE1GhTpkdsILw==" }, "node_modules/thunky": { "version": "1.1.0", @@ -4066,9 +4066,9 @@ "dev": true }, "node_modules/ws": { - "version": "8.14.2", - "resolved": "https://registry.npmjs.org/ws/-/ws-8.14.2.tgz", - "integrity": "sha512-wEBG1ftX4jcglPxgFCMJmZ2PLtSbJ2Peg6TmpJFTbe9GZYOQCDPdMYu/Tm0/bGZkw8paZnJY45J4K2PZrLYq8g==", + "version": "8.15.1", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.15.1.tgz", + "integrity": "sha512-W5OZiCjXEmk0yZ66ZN82beM5Sz7l7coYxpRkzS+p9PP+ToQry8szKh+61eNktr7EA9DOwvFGhfC605jDHbP6QQ==", "dev": true, "engines": { "node": ">=10.0.0" diff --git a/javascript/MaterialXView/package.json b/javascript/MaterialXView/package.json index 8912357208..9518156883 100644 --- a/javascript/MaterialXView/package.json +++ b/javascript/MaterialXView/package.json @@ -11,7 +11,7 @@ "license": "ISC", "dependencies": { "dat.gui": "^0.7.9", - "three": "^0.136.0", + "three": "^0.152.2", "webpack": "^5.89.0" }, "devDependencies": { diff --git a/javascript/MaterialXView/source/helper.js b/javascript/MaterialXView/source/helper.js index 111dfd9b5d..98441a605f 100644 --- a/javascript/MaterialXView/source/helper.js +++ b/javascript/MaterialXView/source/helper.js @@ -19,59 +19,15 @@ const IMAGE_PATH_SEPARATOR = "/"; */ export function prepareEnvTexture(texture, capabilities) { - const rgbaTexture = RGBToRGBA_Float(texture); - rgbaTexture.wrapS = THREE.RepeatWrapping; - rgbaTexture.anisotropy = capabilities.getMaxAnisotropy(); - rgbaTexture.minFilter = THREE.LinearMipmapLinearFilter; - rgbaTexture.magFilter = THREE.LinearFilter; - rgbaTexture.generateMipmaps = true; - rgbaTexture.needsUpdate = true; + let newTexture = new THREE.DataTexture(texture.image.data, texture.image.width, texture.image.height, texture.format, texture.type); + newTexture.wrapS = THREE.RepeatWrapping; + newTexture.anisotropy = capabilities.getMaxAnisotropy(); + newTexture.minFilter = THREE.LinearMipmapLinearFilter; + newTexture.magFilter = THREE.LinearFilter; + newTexture.generateMipmaps = true; + newTexture.needsUpdate = true; - return rgbaTexture; -} - -/** - * Create a new (half)float texture containing an alpha channel with a value of 1 from a RGB (half)float texture. - * @param {THREE.Texture} texture - */ -function RGBToRGBA_Float(texture) -{ - const w = texture.image.width; - const h = texture.image.height; - const dataSize = texture.image.data.length; - const stride = dataSize / (w *h); - // No need to convert to RGBA if already 4 channel. - if (stride == 3) - { - const rgbData = texture.image.data; - const length = (rgbData.length / 3) * 4; - let rgbaData; - - switch (texture.type) - { - case THREE.FloatType: - rgbaData = new Float32Array(length); - break; - case THREE.HalfFloatType: - rgbaData = new Uint16Array(length); - break; - default: - break; - } - - if (rgbaData) - { - for (let i = 0; i < length / 4; i++) - { - rgbaData[(i * 4) + 0] = rgbData[(i * 3) + 0]; - rgbaData[(i * 4) + 1] = rgbData[(i * 3) + 1]; - rgbaData[(i * 4) + 2] = rgbData[(i * 3) + 2]; - rgbaData[(i * 4) + 3] = 1.0; - } - return new THREE.DataTexture(rgbaData, texture.image.width, texture.image.height, THREE.RGBAFormat, texture.type); - } - } - return texture; + return newTexture; } /** diff --git a/javascript/MaterialXView/source/index.js b/javascript/MaterialXView/source/index.js index 56e2e1f5a2..fa729ce4a6 100644 --- a/javascript/MaterialXView/source/index.js +++ b/javascript/MaterialXView/source/index.js @@ -83,10 +83,10 @@ function init() viewer.getEditor().initialize(); const hdrLoader = viewer.getHdrLoader(); - const fileLooder = viewer.getFileLoader(); + const fileLoader = viewer.getFileLoader(); Promise.all([ new Promise(resolve => hdrLoader.setDataType(THREE.FloatType).load('Lights/san_giuseppe_bridge_split.hdr', resolve)), - new Promise(resolve => fileLooder.load('Lights/san_giuseppe_bridge_split.mtlx', resolve)), + new Promise(resolve => fileLoader.load('Lights/san_giuseppe_bridge_split.mtlx', resolve)), new Promise(resolve => hdrLoader.setDataType(THREE.FloatType).load('Lights/irradiance/san_giuseppe_bridge_split.hdr', resolve)), new Promise(function (resolve) { MaterialX().then((module) => {