jeena/chuck.js
1
0
Fork 0
mirror of https://github.com/logsol/chuck.js.git synced 2026-05-11 18:47:35 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

colorfull shirts

Browse source
This commit is contained in:
Jeena 2014-07-12 16:23:17 +02:00
parent 40cdf9867e
commit 2213a50623
4 changed files with 163 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

31
app/Game/Client/GameObjects/Doll.js
View file

@ -2,10 +2,11 @@ define([
"Game/Core/GameObjects/Doll",
"Game/Config/Settings",
"Lib/Utilities/NotificationCenter",
"Lib/Utilities/Exception"
"Lib/Utilities/Exception",
"Lib/Utilities/ColorConverter"
],
function (Parent, Settings, Nc, Exception) {
function (Parent, Settings, Nc, Exception, ColorConverter) {
function Doll(physicsEngine, uid, player) {
this.animationDef = {
@ -28,6 +29,10 @@ function (Parent, Settings, Nc, Exception) {
this.headMesh = null;
this.holdingArmMesh = null;
var converter = new ColorConverter();
this.primaryColor = converter.getColorByName(player.getNickname());
console.log(this.primaryColor.toString(16))
Parent.call(this, physicsEngine, uid, player);
}
@ -66,6 +71,17 @@ function (Parent, Settings, Nc, Exception) {
Doll.prototype.createMesh = function() {
var self = this;
var setShirtColor = function (mesh) {
Nc.trigger(Nc.ns.client.view.mesh.addFilter, mesh, 'colorRangeReplace', {
minColor: 0x3b4a31,
maxColor: 0x657f54,
newColor: self.primaryColor,
brightnessOffset: 0.56
});
}
// Body
var padF = function(n) {
@ -98,6 +114,8 @@ function (Parent, Settings, Nc, Exception) {
var callback = function(mesh) {
self.animatedMeshesContainer[arm][key] = mesh;
Nc.trigger(Nc.ns.client.view.mesh.add, mesh);
setShirtColor(mesh);
};
Nc.trigger(Nc.ns.client.view.animatedMesh.create, texturePaths, callback, {
@ -119,11 +137,6 @@ function (Parent, Settings, Nc, Exception) {
var callback = function (mesh) {
self.headMesh = mesh;
Nc.trigger(Nc.ns.client.view.mesh.add, mesh);
Nc.trigger(Nc.ns.client.view.mesh.addFilter, mesh, 'pixelate', {
sizeX: 4,
sizeY: 4
});
}
Nc.trigger(Nc.ns.client.view.mesh.create, texturePath, callback, {
pivot: {
@ -134,10 +147,14 @@ function (Parent, Settings, Nc, Exception) {
height: 12
});
// Holding arm
texturePath = Settings.GRAPHICS_PATH + "Characters/Chuck/holdingArm.png";
var callback = function (mesh) {
self.holdingArmMesh = mesh;
Nc.trigger(Nc.ns.client.view.mesh.add, mesh);
setShirtColor(mesh);
}
Nc.trigger(Nc.ns.client.view.mesh.create, texturePath, callback, {
visible: false,

89
app/Game/Client/View/Views/Pixi/ColorRangeReplaceFilter.js Normal file
View file

@ -0,0 +1,89 @@
define([
"Lib/Vendor/Pixi"
],
function (PIXI) {
var Parent = PIXI.AbstractFilter;
function ColorRangeReplaceFilter() {
Parent.call(this);
this.passes = [this];
// set the uniforms
this.uniforms = {
minColor: {type: '3fv', value: [0,0,0]},
maxColor: {type: '3fv', value: [0,0,0]},
newColor: {type: '3fv', value: [0,0,0]},
brightnessOffset: {type: '1f', value: 0}
};
this.fragmentSrc = [
'precision mediump float;',
'varying vec2 vTextureCoord;',
'varying vec4 vColor;',
'uniform sampler2D uSampler;',
'uniform vec3 minColor;',
'uniform vec3 maxColor;',
'uniform vec3 newColor;',
'uniform float brightnessOffset;',
'void main(void) {',
' vec4 pixel = texture2D(uSampler, vTextureCoord);',
' if(pixel.x >= minColor.x && pixel.y >= minColor.y && pixel.z >= minColor.z',
' && pixel.w == 1.0',
' && pixel.x <= maxColor.x && pixel.y <= maxColor.y && pixel.z <= maxColor.z) {',
' pixel.rgb = mix(pixel.rgb, vec3(0.2126*pixel.r + 0.7152*pixel.g + 0.0722*pixel.b), 1.0);', // desaturate to gray
' pixel.rgb += brightnessOffset;',
' pixel.rgb *= newColor;',
' }',
' gl_FragColor = pixel;',
'}'
];
}
ColorRangeReplaceFilter.prototype = Object.create(Parent.prototype);
ColorRangeReplaceFilter.prototype.constructor = ColorRangeReplaceFilter;
Object.defineProperty(ColorRangeReplaceFilter.prototype, 'minColor', {
get: function() {
return PIXI.rgb2hex(this.uniforms.minColor.value);
},
set: function(value) {
this.uniforms.minColor.value = PIXI.hex2rgb(value);
}
});
Object.defineProperty(ColorRangeReplaceFilter.prototype, 'maxColor', {
get: function() {
return PIXI.rgb2hex(this.uniforms.maxColor.value);
},
set: function(value) {
this.uniforms.maxColor.value = PIXI.hex2rgb(value);
}
});
Object.defineProperty(ColorRangeReplaceFilter.prototype, 'newColor', {
get: function() {
return PIXI.rgb2hex(this.uniforms.newColor.value);
},
set: function(value) {
this.uniforms.newColor.value = PIXI.hex2rgb(value);
}
});
Object.defineProperty(ColorRangeReplaceFilter.prototype, 'brightnessOffset', {
get: function() {
return this.uniforms.brightnessOffset.value;
},
set: function(value) {
this.uniforms.brightnessOffset.value = value;
}
});
return ColorRangeReplaceFilter;
});

72
app/Game/Client/View/Views/PixiView.js
View file

@ -1,76 +1,22 @@
define([
"Game/Client/View/Views/AbstractView",
"Game/Client/View/DomController",
"Lib/Vendor/Pixi",
"Lib/Vendor/Pixi",
"Game/Client/View/Views/Pixi/ColorRangeReplaceFilter",
"Game/Config/Settings",
"Lib/Utilities/NotificationCenter",
"Lib/Utilities/Exception"
],
function (Parent, DomController, PIXI, Settings, Nc, Exception) {
function (Parent, DomController, PIXI, ColorRangeReplaceFilter, Settings, Nc, Exception) {
var AVAILABLE_MESH_FILTERS = {
"blur": PIXI.BlurFilter,
"desaturate": PIXI.GrayFilter,
"pixelate": PIXI.PixelateFilter,
"colorRangeReplace": ColorRangeReplace,
"colorRangeReplace": ColorRangeReplaceFilter,
};
var ColorRangeReplace = function() {
PIXI.AbstractFilter.call( this );
this.passes = [this];
// set the uniforms
this.uniforms = {
matrix: {type: 'mat4', value: [1,0,0,0,
0,1,0,0,
0,0,1,0,
0,0,0,1]},
gray: {type: '1f', value: 1},
shirtColor: {type: '4fv', value: [1,1,1,1]}
};
this.fragmentSrc = [
'precision mediump float;',
'varying vec2 vTextureCoord;',
'varying vec4 vColor;',
'uniform float invert;',
'uniform mat4 matrix;',
'uniform sampler2D uSampler;',
'uniform float gray;',
'uniform vec4 shirtColor;',
'void main(void) {',
' vec4 pixel = texture2D(uSampler, vTextureCoord);',
' vec3 min_color = vec3(49.0/256.0, 64.0/256.0, 39.0/256.0);',
' vec3 max_color = vec3(106.0/256.0, 131.0/256.0, 90.0/256.0);',
' if(pixel.x >= min_color.x && pixel.y >= min_color.y && pixel.z >= min_color.z',
' &&',
' pixel.x <= max_color.x && pixel.y <= max_color.y && pixel.z <= max_color.z) {',
' pixel.rgb = mix(pixel.rgb, vec3(0.2126*pixel.r + 0.7152*pixel.g + 0.0722*pixel.b), gray);',
' pixel = pixel * shirtColor;',
' }',
' gl_FragColor = pixel;',
// ' gl_FragColor = texture2D(uSampler, vTextureCoord) * matrix;',
// ' gl_FragColor = gl_FragColor;',
'}'
];
};
/*
ColorMatrixFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
ColorMatrixFilter.prototype.constructor = ColorMatrixFilter;
Object.defineProperty(ColorMatrixFilter.prototype, 'matrix', {
get: function() {
return this.uniforms.matrix.value;
},
set: function(value) {
this.uniforms.matrix.value = value;
}
});
*/
function PixiView () {
Parent.call(this);
@ -196,9 +142,10 @@ function (Parent, DomController, PIXI, Settings, Nc, Exception) {
break;
case 'colorRangeReplace':
if (options.min) filter.min = options.min;
if (options.max) filter.max = options.max;
if (options.new) filter.new = options.new;
if (options.minColor) filter.minColor = options.minColor;
if (options.maxColor) filter.maxColor = options.maxColor;
if (options.newColor) filter.newColor = options.newColor;
if (options.brightnessOffset) filter.brightnessOffset = options.brightnessOffset;
break;
case 'pixelate':
@ -221,8 +168,6 @@ function (Parent, DomController, PIXI, Settings, Nc, Exception) {
filters.push(filter);
mesh.filters = filters;
console.log(mesh.filters)
};
PixiView.prototype.removeFilter = function(mesh, filterName) {
@ -456,6 +401,7 @@ function (Parent, DomController, PIXI, Settings, Nc, Exception) {
};
PixiView.prototype.onZoomIn = function() {
console.log("onZoomIn")
if(this.currentZoom + Settings.ZOOM_FACTOR <= Settings.ZOOM_MAX) {
this.currentZoom += Settings.ZOOM_FACTOR;
}