Skip to content
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.

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

fix: remove depreciated encodings with r136 #108

Merged
merged 5 commits into from
Jan 1, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
12 changes: 0 additions & 12 deletions src/loaders/HDRCubeTextureLoader.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,7 @@ import {
LinearEncoding,
LinearFilter,
Loader,
NearestFilter,
RGBAFormat,
RGBEEncoding,
RGBFormat,
UnsignedByteType,
} from 'three'
import { RGBELoader } from '../loaders/RGBELoader.js'

Expand Down Expand Up @@ -40,14 +36,6 @@ class HDRCubeTextureLoader extends Loader {
texture.type = this.type

switch (texture.type) {
case UnsignedByteType:
texture.encoding = RGBEEncoding
texture.format = RGBAFormat
texture.minFilter = NearestFilter
texture.magFilter = NearestFilter
texture.generateMipmaps = false
break

case FloatType:
texture.encoding = LinearEncoding
texture.format = RGBFormat
Expand Down
28 changes: 1 addition & 27 deletions src/loaders/RGBELoader.js
Original file line number Diff line number Diff line change
@@ -1,16 +1,4 @@
import {
DataTextureLoader,
DataUtils,
FloatType,
HalfFloatType,
LinearEncoding,
LinearFilter,
NearestFilter,
RGBEEncoding,
RGBEFormat,
RGBFormat,
UnsignedByteType,
} from 'three'
import { DataTextureLoader, DataUtils, FloatType, HalfFloatType, LinearEncoding, LinearFilter, RGBFormat } from 'three'

// https://github.com/mrdoob/three.js/issues/5552
// http://en.wikipedia.org/wiki/RGBE_image_format
Expand Down Expand Up @@ -310,12 +298,6 @@ class RGBELoader extends DataTextureLoader {
let numElements

switch (this.type) {
case UnsignedByteType:
data = image_rgba_data
format = RGBEFormat // handled as THREE.RGBAFormat in shaders
type = UnsignedByteType
break

case FloatType:
numElements = (image_rgba_data.length / 4) * 3
const floatArray = new Float32Array(numElements)
Expand Down Expand Up @@ -371,14 +353,6 @@ class RGBELoader extends DataTextureLoader {
load(url, onLoad, onProgress, onError) {
function onLoadCallback(texture, texData) {
switch (texture.type) {
case UnsignedByteType:
texture.encoding = RGBEEncoding
texture.minFilter = NearestFilter
texture.magFilter = NearestFilter
texture.generateMipmaps = false
texture.flipY = true
break

case FloatType:
texture.encoding = LinearEncoding
texture.minFilter = LinearFilter
Expand Down
52 changes: 47 additions & 5 deletions src/loaders/RGBMLoader.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,23 @@
import { DataTextureLoader, UnsignedByteType, RGBAFormat, LinearFilter, CubeTexture, RGBM7Encoding } from 'three'
import { DataTextureLoader, RGBAFormat, LinearFilter, CubeTexture, HalfFloatType, DataUtils } from 'three'

class RGBMLoader extends DataTextureLoader {
constructor(manager) {
super(manager)

this.type = HalfFloatType
this.maxRange = 7 // more information about this property at https://iwasbeingirony.blogspot.com/2010/06/difference-between-rgbm-and-rgbd.html
}

setDataType(value) {
this.type = value
return this
}

setMaxRange(value) {
this.maxRange = value
return this
}

loadCubemap(urls, onLoad, onProgress, onError) {
const texture = new CubeTexture()

Expand Down Expand Up @@ -31,7 +48,7 @@ class RGBMLoader extends DataTextureLoader {
loadTexture(i)
}

texture.encoding = RGBM7Encoding
texture.type = this.type
texture.format = RGBAFormat
texture.minFilter = LinearFilter
texture.generateMipmaps = false
Expand All @@ -43,14 +60,39 @@ class RGBMLoader extends DataTextureLoader {
const img = UPNG.decode(buffer)
const rgba = UPNG.toRGBA8(img)[0]

const data = new Uint8Array(rgba)
const size = img.width * img.height * 4

const output = this.type === HalfFloatType ? new Uint16Array(size) : new Float32Array(size)

// decode RGBM

for (let i = 0; i < data.length; i += 4) {
const r = data[i + 0] / 255
const g = data[i + 1] / 255
const b = data[i + 2] / 255
const a = data[i + 3] / 255

if (this.type === HalfFloatType) {
output[i + 0] = DataUtils.toHalfFloat(Math.min(r * a * this.maxRange, 65504))
output[i + 1] = DataUtils.toHalfFloat(Math.min(g * a * this.maxRange, 65504))
output[i + 2] = DataUtils.toHalfFloat(Math.min(b * a * this.maxRange, 65504))
output[i + 3] = DataUtils.toHalfFloat(1)
} else {
output[i + 0] = r * a * this.maxRange
output[i + 1] = g * a * this.maxRange
output[i + 2] = b * a * this.maxRange
output[i + 3] = 1
}
}

return {
width: img.width,
height: img.height,
data: new Uint8Array(rgba),
data: output,
format: RGBAFormat,
type: UnsignedByteType,
type: this.type,
flipY: true,
encoding: RGBM7Encoding,
}
}
}
Expand Down
4 changes: 2 additions & 2 deletions src/nodes/core/NodeBuilder.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import {
CubeUVReflectionMapping,
CubeUVRefractionMapping,
LinearEncoding,
GammaEncoding,
sRGBEncoding,
} from 'three'

import { NodeUniform } from './NodeUniform'
Expand Down Expand Up @@ -775,7 +775,7 @@ NodeBuilder.prototype = {
}

if (encoding === LinearEncoding && this.context.gamma) {
encoding = GammaEncoding
encoding = sRGBEncoding
}

return encoding
Expand Down
134 changes: 1 addition & 133 deletions src/nodes/utils/ColorSpaceNode.js
Original file line number Diff line number Diff line change
@@ -1,18 +1,8 @@
import {
GammaEncoding,
LinearEncoding,
RGBEEncoding,
RGBM7Encoding,
RGBM16Encoding,
RGBDEncoding,
sRGBEncoding,
} from 'three'
import { LinearEncoding, sRGBEncoding } from 'three'

import { TempNode } from '../core/TempNode'
import { ConstNode } from '../core/ConstNode'
import { FloatNode } from '../inputs/FloatNode'
import { FunctionNode } from '../core/FunctionNode'
import { ExpressionNode } from '../core/ExpressionNode'

function ColorSpaceNode(input, method) {
TempNode.call(this, 'v4')
Expand All @@ -23,30 +13,8 @@ function ColorSpaceNode(input, method) {
}

ColorSpaceNode.Nodes = (function () {
// For a discussion of what this is, please read this: http://lousodrome.net/blog/light/2013/05/26/gamma-correct-and-hdr-rendering-in-a-32-bits-buffer/

var LinearToLinear = new FunctionNode(['vec4 LinearToLinear( in vec4 value ) {', ' return value;', '}'].join('\n'))

var GammaToLinear = new FunctionNode(
[
'vec4 GammaToLinear( in vec4 value, in float gammaFactor ) {',

' return vec4( pow( value.xyz, vec3( gammaFactor ) ), value.w );',

'}',
].join('\n'),
)

var LinearToGamma = new FunctionNode(
[
'vec4 LinearToGamma( in vec4 value, in float gammaFactor ) {',

' return vec4( pow( value.xyz, vec3( 1.0 / gammaFactor ) ), value.w );',

'}',
].join('\n'),
)

var sRGBToLinear = new FunctionNode(
[
'vec4 sRGBToLinear( in vec4 value ) {',
Expand All @@ -67,79 +35,6 @@ ColorSpaceNode.Nodes = (function () {
].join('\n'),
)

var RGBEToLinear = new FunctionNode(
[
'vec4 RGBEToLinear( in vec4 value ) {',

' return vec4( value.rgb * exp2( value.a * 255.0 - 128.0 ), 1.0 );',

'}',
].join('\n'),
)

var LinearToRGBE = new FunctionNode(
[
'vec4 LinearToRGBE( in vec4 value ) {',

' float maxComponent = max( max( value.r, value.g ), value.b );',
' float fExp = clamp( ceil( log2( maxComponent ) ), -128.0, 127.0 );',
' return vec4( value.rgb / exp2( fExp ), ( fExp + 128.0 ) / 255.0 );',
// return vec4( value.brg, ( 3.0 + 128.0 ) / 256.0 );

'}',
].join('\n'),
)

// reference: http://iwasbeingirony.blogspot.ca/2010/06/difference-between-rgbm-and-rgbd.html

var RGBMToLinear = new FunctionNode(
[
'vec3 RGBMToLinear( in vec4 value, in float maxRange ) {',

' return vec4( value.xyz * value.w * maxRange, 1.0 );',

'}',
].join('\n'),
)

var LinearToRGBM = new FunctionNode(
[
'vec3 LinearToRGBM( in vec4 value, in float maxRange ) {',

' float maxRGB = max( value.x, max( value.g, value.b ) );',
' float M = clamp( maxRGB / maxRange, 0.0, 1.0 );',
' M = ceil( M * 255.0 ) / 255.0;',
' return vec4( value.rgb / ( M * maxRange ), M );',

'}',
].join('\n'),
)

// reference: http://iwasbeingirony.blogspot.ca/2010/06/difference-between-rgbm-and-rgbd.html

var RGBDToLinear = new FunctionNode(
[
'vec3 RGBDToLinear( in vec4 value, in float maxRange ) {',

' return vec4( value.rgb * ( ( maxRange / 255.0 ) / value.a ), 1.0 );',

'}',
].join('\n'),
)

var LinearToRGBD = new FunctionNode(
[
'vec3 LinearToRGBD( in vec4 value, in float maxRange ) {',

' float maxRGB = max( value.x, max( value.g, value.b ) );',
' float D = max( maxRange / maxRGB, 1.0 );',
' D = clamp( floor( D ) / 255.0, 0.0, 1.0 );',
' return vec4( value.rgb * ( D * ( 255.0 / maxRange ) ), D );',

'}',
].join('\n'),
)

// LogLuv reference: http://graphicrants.blogspot.ca/2009/04/rgbm-color-encoding.html

// M matrix, for encoding
Expand Down Expand Up @@ -191,16 +86,8 @@ ColorSpaceNode.Nodes = (function () {

return {
LinearToLinear: LinearToLinear,
GammaToLinear: GammaToLinear,
LinearToGamma: LinearToGamma,
sRGBToLinear: sRGBToLinear,
LinearTosRGB: LinearTosRGB,
RGBEToLinear: RGBEToLinear,
LinearToRGBE: LinearToRGBE,
RGBMToLinear: RGBMToLinear,
LinearToRGBM: LinearToRGBM,
RGBDToLinear: RGBDToLinear,
LinearToRGBD: LinearToRGBD,
cLogLuvM: cLogLuvM,
LinearToLogLuv: LinearToLogLuv,
cLogLuvInverseM: cLogLuvInverseM,
Expand All @@ -210,21 +97,12 @@ ColorSpaceNode.Nodes = (function () {

ColorSpaceNode.LINEAR_TO_LINEAR = 'LinearToLinear'

ColorSpaceNode.GAMMA_TO_LINEAR = 'GammaToLinear'
ColorSpaceNode.LINEAR_TO_GAMMA = 'LinearToGamma'

ColorSpaceNode.SRGB_TO_LINEAR = 'sRGBToLinear'
ColorSpaceNode.LINEAR_TO_SRGB = 'LinearTosRGB'

ColorSpaceNode.RGBE_TO_LINEAR = 'RGBEToLinear'
ColorSpaceNode.LINEAR_TO_RGBE = 'LinearToRGBE'

ColorSpaceNode.RGBM_TO_LINEAR = 'RGBMToLinear'
ColorSpaceNode.LINEAR_TO_RGBM = 'LinearToRGBM'

ColorSpaceNode.RGBD_TO_LINEAR = 'RGBDToLinear'
ColorSpaceNode.LINEAR_TO_RGBD = 'LinearToRGBD'

ColorSpaceNode.LINEAR_TO_LOG_LUV = 'LinearToLogLuv'
ColorSpaceNode.LOG_LUV_TO_LINEAR = 'LogLuvToLinear'

Expand All @@ -234,16 +112,6 @@ ColorSpaceNode.getEncodingComponents = function (encoding) {
return ['Linear']
case sRGBEncoding:
return ['sRGB']
case RGBEEncoding:
return ['RGBE']
case RGBM7Encoding:
return ['RGBM', new FloatNode(7.0).setReadonly(true)]
case RGBM16Encoding:
return ['RGBM', new FloatNode(16.0).setReadonly(true)]
case RGBDEncoding:
return ['RGBD', new FloatNode(256.0).setReadonly(true)]
case GammaEncoding:
return ['Gamma', new ExpressionNode('float( GAMMA_FACTOR )', 'f')]
}
}

Expand Down
2 changes: 1 addition & 1 deletion src/shaders/GammaCorrectionShader.ts
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ const GammaCorrectionShader: GammaCorrectionShaderImpl = {

' vec4 tex = texture2D( tDiffuse, vUv );',

' gl_FragColor = LinearTosRGB( tex );', // optional: LinearToGamma( tex, float( GAMMA_FACTOR ) );
' gl_FragColor = LinearTosRGB( tex );',

'}',
].join('\n'),
Expand Down