Update avatar palette

This commit is contained in:
Bill 2021-08-31 23:47:28 -04:00
parent 106bad89e4
commit fe4f8e09e3
2 changed files with 34 additions and 31 deletions

View File

@ -19,25 +19,27 @@ uniform int channel;
void main(void) { void main(void) {
vec4 currentColor = texture2D(uSampler, vTextureCoord); vec4 currentColor = texture2D(uSampler, vTextureCoord);
vec4 adjusted = currentColor;
if(currentColor.a > 0.0)
{
if(channel == 0) if(channel == 0)
{ {
vec2 index = vec2(int(currentColor.r * 255.0), 0.5); vec2 index = vec2(int(currentColor.r), 0.5);
vec4 newColor = texture2D(lut, index); adjusted = texture2D(lut, index);
gl_FragColor = vec4(newColor.r, newColor.g, newColor.b, currentColor.a);
} else if(channel == 1) { } else if(channel == 1) {
vec2 index = vec2(int(currentColor.g * 255.0), 0.5); vec2 index = vec2(int(currentColor.g), 0.5);
vec4 newColor = texture2D(lut, index); adjusted = texture2D(lut, index);
gl_FragColor = vec4(newColor.r, newColor.g, newColor.b, currentColor.a);
} else if(channel == 2) { } else if(channel == 2) {
vec2 index = vec2(int(currentColor.b * 255.0), 0.5); vec2 index = vec2(int(currentColor.b), 0.5);
vec4 newColor = texture2D(lut, index); adjusted = texture2D(lut, index);
gl_FragColor = vec4(newColor.r, newColor.g, newColor.b, currentColor.a);
} else if(channel == 3) { } else if(channel == 3) {
vec2 index = vec2(int(currentColor.a * 255.0), 0.5); vec2 index = vec2(int(currentColor.a), 0.5);
vec4 newColor = texture2D(lut, index); adjusted = texture2D(lut, index);
gl_FragColor = vec4(newColor.r, newColor.g, newColor.b, currentColor.a); }
} }
gl_FragColor = vec4(adjusted.r, adjusted.g, adjusted.b, currentColor.a);
}`; }`;
export class PaletteMapFilter extends NitroFilter export class PaletteMapFilter extends NitroFilter
@ -50,15 +52,19 @@ export class PaletteMapFilter extends NitroFilter
super(vertex, fragment); super(vertex, fragment);
this._channel = this.getChannelForPalette(reds, greens, blues, alphas); this._channel = this.getChannelForPalette(reds, greens, blues, alphas);
const lut = this.getLutForPalette(reds); const lut = this.getLutForPalette(reds);
this._lut = NitroTexture.fromBuffer(Uint8Array.from(lut), lut.length / 4, 1); this._lut = NitroTexture.fromBuffer(Float32Array.from(lut), lut.length / 4, 1);
// this._lut.baseTexture.mipmap = MIPMAP_MODES.ON;
// this._lut.baseTexture.wrapMode = WRAP_MODES.CLAMP;
this.uniforms.lut = this._lut; this.uniforms.lut = this._lut;
this.uniforms.channel = this._channel; this.uniforms.channel = this._channel;
this.uniforms.lut.baseTexture.mipmap = false;
} }
private getLutForPalette(data: number[]): number[] private getLutForPalette(data: number[]): number[]
{ {
const lut = []; const lut = [];
for(let i = 0; i < data.length; i++) for(let i = 0; i < data.length; i++)
{ {
// R // R
@ -70,7 +76,7 @@ export class PaletteMapFilter extends NitroFilter
// A // A
lut[(i * 4) + 3] = ((data[i] >> 24) & 0xFF) / 0xff; lut[(i * 4) + 3] = ((data[i] >> 24) & 0xFF) / 0xff;
} }
console.log(lut);
return lut; return lut;
} }

View File

@ -5,7 +5,6 @@ import { Rectangle } from '@pixi/math';
import { Sprite } from '@pixi/sprite'; import { Sprite } from '@pixi/sprite';
import { NitroContainer, NitroSprite } from '../../core'; import { NitroContainer, NitroSprite } from '../../core';
import { AdvancedMap } from '../../core/utils/AdvancedMap'; import { AdvancedMap } from '../../core/utils/AdvancedMap';
import { PaletteMapFilter } from '../../core/utils/PaletteMapFilter';
import { IGraphicAsset } from '../../room/object/visualization/utils/IGraphicAsset'; import { IGraphicAsset } from '../../room/object/visualization/utils/IGraphicAsset';
import { TextureUtils } from '../../room/utils/TextureUtils'; import { TextureUtils } from '../../room/utils/TextureUtils';
import { Nitro } from '../Nitro'; import { Nitro } from '../Nitro';
@ -396,7 +395,7 @@ export class AvatarImage implements IAvatarImage, IAvatarEffectListener
{ {
this.convertToGrayscale(container); this.convertToGrayscale(container);
container.filters.push(new PaletteMapFilter(this._avatarSpriteData.reds, [], [], [])); //container.filters.push(new PaletteMapFilter(this._avatarSpriteData.reds, [], [], []));
} }
if(!cache) if(!cache)
@ -418,13 +417,13 @@ export class AvatarImage implements IAvatarImage, IAvatarEffectListener
if(!this._reusableTexture) return null; if(!this._reusableTexture) return null;
// if(this._avatarSpriteData) if(this._avatarSpriteData)
// { {
// if(this._avatarSpriteData.paletteIsGrayscale) if(this._avatarSpriteData.paletteIsGrayscale)
// { {
// this._reusableTexture = this.applyPalette(this._reusableTexture, this._avatarSpriteData.reds, [], []); this._reusableTexture = this.applyPalette(this._reusableTexture, this._avatarSpriteData.reds, [], []);
// } }
// } }
this._image = this._reusableTexture; this._image = this._reusableTexture;
this._changes = false; this._changes = false;
@ -434,7 +433,6 @@ export class AvatarImage implements IAvatarImage, IAvatarEffectListener
public applyPalette(texture: RenderTexture, reds: number[] = [], greens: number[] = [], blues: number[] = []): RenderTexture public applyPalette(texture: RenderTexture, reds: number[] = [], greens: number[] = [], blues: number[] = []): RenderTexture
{ {
const textureCanvas = TextureUtils.generateCanvas(texture); const textureCanvas = TextureUtils.generateCanvas(texture);
const textureCtx = textureCanvas.getContext('2d'); const textureCtx = textureCanvas.getContext('2d');
const textureImageData = textureCtx.getImageData(0, 0, textureCanvas.width, textureCanvas.height); const textureImageData = textureCtx.getImageData(0, 0, textureCanvas.width, textureCanvas.height);
@ -470,7 +468,6 @@ export class AvatarImage implements IAvatarImage, IAvatarEffectListener
data[ i + 1] = ((paletteColor >> 8) & 0xFF); data[ i + 1] = ((paletteColor >> 8) & 0xFF);
data[ i + 2] = (paletteColor & 0xFF); data[ i + 2] = (paletteColor & 0xFF);
} }
} }
textureCtx.putImageData(textureImageData, 0, 0); textureCtx.putImageData(textureImageData, 0, 0);