azures04/crafatar
1
0
Fork 0
mirror of https://github.com/azures04/crafatar.git synced 2026-03-21 23:41:18 +01:00
Code Issues Packages Projects Releases Wiki Activity

clean up renders again

Browse Source 
- improved readability a lot
- now applies overlays directly to underlying skin part *before* transforming
This commit is contained in:
jomo 2015-11-23 21:58:47 +01:00
parent 6e6eff5299
commit 7eed1fa09b
1 changed files with 77 additions and 151 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

222
lib/renders.js
View File

@ -74,6 +74,7 @@ function flip(src) {
return dst; return dst;
} }
// skew for isometric perspective
var skew_a = 26 / 45; // 0.57777777 var skew_a = 26 / 45; // 0.57777777
var skew_b = skew_a * 2; // 1.15555555 var skew_b = skew_a * 2; // 1.15555555
@ -89,92 +90,75 @@ exp.draw_model = function(rid, img, scale, overlay, is_body, callback) {
var old_skin = skin.height === 32; var old_skin = skin.height === 32;
var arm_width = 4; var arm_width = 4;
var parts = { /* eslint-disable no-multi-spaces */
head: { var head_top = resize(removeTransparency(getPart(skin, 8, 0, 8, 8, 1)), scale);
front: resize(removeTransparency(getPart(skin, 8, 8, 8, 8, 1)), scale), var head_front = resize(removeTransparency(getPart(skin, 8, 8, 8, 8, 1)), scale);
right: resize(removeTransparency(getPart(skin, 0, 8, 8, 8, 1)), scale), var head_right = resize(removeTransparency(getPart(skin, 0, 8, 8, 8, 1)), scale);
top: resize(removeTransparency(getPart(skin, 8, 0, 8, 8, 1)), scale),
}, var arm_right_top = resize(removeTransparency(getPart(skin, 44, 16, arm_width, 4, 1)), scale);
arm: { var arm_right_front = resize(removeTransparency(getPart(skin, 44, 20, arm_width, 12, 1)), scale);
right: { var arm_right_side = resize(removeTransparency(getPart(skin, 40, 20, 4, 12, 1)), scale);
front: resize(removeTransparency(getPart(skin, 44, 20, arm_width, 12, 1)), scale),
side: resize(removeTransparency(getPart(skin, 40, 20, 4, 12, 1)), scale), var arm_left_top = old_skin ? flip(arm_right_top) : resize(removeTransparency(getPart(skin, 36, 48, arm_width, 4, 1)), scale);
}, var arm_left_front = old_skin ? flip(arm_right_front) : resize(removeTransparency(getPart(skin, 36, 52, arm_width, 12, 1)), scale);
left: {
front: null, var leg_right_front = resize(removeTransparency(getPart(skin, 4, 20, 4, 12, 1)), scale);
}, var leg_right_side = resize(removeTransparency(getPart(skin, 0, 20, 4, 12, 1)), scale);
},
leg: { var leg_left_front = old_skin ? flip(leg_right_front) : resize(removeTransparency(getPart(skin, 20, 52, 4, 12, 1)), scale);
right: {
front: resize(removeTransparency(getPart(skin, 4, 20, 4, 12, 1)), scale), var body_front = resize(removeTransparency(getPart(skin, 20, 20, 8, 12, 1)), scale);
side: resize(removeTransparency(getPart(skin, 0, 20, 4, 12, 1)), scale), /* eslint-enable no-multi-spaces */
},
left: { if (overlay) {
front: null, if (hasTransparency(getPart(skin, 32, 0, 32, 32, 1))) {
// render head overlay
head_top.getContext("2d").drawImage(getPart(skin, 40, 0, 8, 8, scale), 0, 0);
head_front.getContext("2d").drawImage(getPart(skin, 40, 8, 8, 8, scale), 0, 0);
head_right.getContext("2d").drawImage(getPart(skin, 32, 8, 8, 8, scale), 0, 0);
} }
},
shoulder: {
right: resize(removeTransparency(getPart(skin, 44, 16, arm_width, 4, 1)), scale),
left: null,
},
body: resize(removeTransparency(getPart(skin, 20, 20, 8, 12, 1)), scale),
};
var overlays = {
head: {},
arm: {right: {}, left: {}},
leg: {right: {}, left: {}},
shoulder: {},
body: {},
};
// overlays
var render_head = overlay && hasTransparency(getPart(skin, 32, 0, 32, 32, 1));
var render_body;
var render_rleg;
var render_lleg;
var render_larm;
var render_rarm;
// head overlay is shifted 32px right
overlays.head.front = overlay && render_head && getPart(skin, 8 + 32, 8, 8, 8, scale);
overlays.head.right = overlay && render_head && getPart(skin, 0 + 32, 8, 8, 8, scale);
overlays.head.top = overlay && render_head && getPart(skin, 8 + 32, 0, 8, 8, scale);
if ( old_skin) {
parts.arm.left.front = flip(parts.arm.right.front);
parts.leg.left.front = flip(parts.leg.right.front);
parts.shoulder.left = flip(parts.shoulder.right);
} else {
// 1.8 skin - has separate left/right arms & legs
parts.arm.left.front = resize(removeTransparency(getPart(skin, 36, 52, arm_width, 12, 1)), scale);
parts.leg.left.front = resize(removeTransparency(getPart(skin, 20, 52, 4, 12, 1)), scale);
parts.shoulder.left = resize(removeTransparency(getPart(skin, 36, 48, arm_width, 4, 1)), scale);
if (!old_skin) {
// See #117 // See #117
// if MC-89760 gets fixed, we can (probably) simply check the whole skin for transparency // if MC-89760 gets fixed, we can (probably) simply check the whole skin for transparency
render_body = overlay && hasTransparency(getPart(skin, 16, 32, 32, 16, 1));
render_rleg = overlay && hasTransparency(getPart(skin, 0, 32, 16, 16, 1));
render_lleg = overlay && hasTransparency(getPart(skin, 0, 48, 16, 16, 1));
render_larm = overlay && hasTransparency(getPart(skin, 40, 32, 16, 16, 1));
render_rarm = overlay && hasTransparency(getPart(skin, 48, 48, 16, 16, 1));
// body overlay is shifted 16px down /* eslint-disable no-multi-spaces */
overlays.body.front = render_body && getPart(skin, 20, 20 + 16, 8, 12, scale); var body_region = getPart(skin, 16, 32, 32, 16, 1);
var right_arm_region = getPart(skin, 48, 48, 16, 16, 1);
var left_arm_region = getPart(skin, 40, 32, 16, 16, 1);
var right_leg_region = getPart(skin, 0, 32, 16, 16, 1);
var left_leg_region = getPart(skin, 0, 48, 16, 16, 1);
/* eslint-enable no-multi-spaces */
// right arm overlay is shifted 16px down if (hasTransparency(body_region)) {
overlays.arm.right.front = render_rarm && getPart(skin, 44, 20 + 16, arm_width, 12, scale); // render body overlay
overlays.arm.right.side = render_rarm && getPart(skin, 40, 20 + 16, 4, 12, scale); body_front.getContext("2d").drawImage(getPart(skin, 20, 36, 8, 12, scale), 0, 0);
overlays.shoulder.right = render_rarm && getPart(skin, 44, 16 + 16, arm_width, 4, scale); }
// left arm overlay is shifted 16px right if (hasTransparency(right_arm_region)) {
overlays.arm.left.front = render_larm && getPart(skin, 36 + 16, 52, arm_width, 12, scale); // render right arm overlay
overlays.shoulder.left = render_larm && getPart(skin, 36 + 16, 48, arm_width, 4, scale); arm_right_top.getContext("2d").drawImage(getPart(skin, 44, 32, arm_width, 4, scale), 0, 0);
arm_right_front.getContext("2d").drawImage(getPart(skin, 44, 36, arm_width, 12, scale), 0, 0);
arm_right_side.getContext("2d").drawImage(getPart(skin, 40, 36, 4, 12, scale), 0, 0);
}
// right leg overlay is shifted 16px down if (hasTransparency(left_arm_region)) {
overlays.leg.right.front = render_rleg && getPart(skin, 4, 20 + 16, 4, 12, scale); // render left arm overlay
overlays.leg.right.side = render_rleg && getPart(skin, 0, 20 + 16, 4, 12, scale); arm_left_top.getContext("2d").drawImage(getPart(skin, 36 + 16, 48, arm_width, 4, scale), 0, 0);
// left leg overlay is shifted 16px left arm_left_front.getContext("2d").drawImage(getPart(skin, 36 + 16, 52, arm_width, 12, scale), 0, 0);
overlays.leg.left.front = render_lleg && getPart(skin, 20 - 16, 52, 4, 12, scale); }
if (hasTransparency(right_leg_region)) {
// render right leg overlay
leg_right_front.getContext("2d").drawImage(getPart(skin, 4, 36, 4, 12, scale), 0, 0);
leg_right_side.getContext("2d").drawImage(getPart(skin, 0, 36, 4, 12, scale), 0, 0);
}
if (hasTransparency(left_leg_region)) {
// render left leg overlay
leg_left_front.getContext("2d").drawImage(getPart(skin, 4, 52, 4, 12, scale), 0, 0);
}
}
} }
var x = 0; var x = 0;
@ -192,37 +176,11 @@ exp.draw_model = function(rid, img, scale, overlay, is_body, callback) {
var frontc = front.getContext("2d"); var frontc = front.getContext("2d");
frontc.patternQuality = "fast"; frontc.patternQuality = "fast";
frontc.drawImage(parts.arm.right.front, (4 - arm_width) * scale, 0 * scale, arm_width * scale, 12 * scale); frontc.drawImage(arm_right_front, (4 - arm_width) * scale, 0 * scale, arm_width * scale, 12 * scale);
frontc.drawImage(parts.arm.left.front, 12 * scale, 0 * scale, arm_width * scale, 12 * scale); frontc.drawImage(arm_left_front, 12 * scale, 0 * scale, arm_width * scale, 12 * scale);
frontc.drawImage(parts.body, 4 * scale, 0 * scale, 8 * scale, 12 * scale); frontc.drawImage(body_front, 4 * scale, 0 * scale, 8 * scale, 12 * scale);
frontc.drawImage(parts.leg.right.front, 4 * scale, 12 * scale, 4 * scale, 12 * scale); frontc.drawImage(leg_right_front, 4 * scale, 12 * scale, 4 * scale, 12 * scale);
frontc.drawImage(parts.leg.left.front, 8 * scale, 12 * scale, 4 * scale, 12 * scale); frontc.drawImage(leg_left_front, 8 * scale, 12 * scale, 4 * scale, 12 * scale);
// front overlay
var fronto = new Canvas();
if (!old_skin) {
// pre-render front overlay onto separate canvas
fronto.width = scale * 16;
fronto.height = scale * 24;
var frontoc = fronto.getContext("2d");
frontoc.patternQuality = "fast";
if (render_rarm) {
frontoc.drawImage(overlays.arm.right.front, (4 - arm_width) * scale, 0 * scale, arm_width * scale, 12 * scale + 1);
}
if (render_larm) {
frontoc.drawImage(overlays.arm.left.front, 12 * scale, 0 * scale, arm_width * scale, 12 * scale + 1);
}
if (render_body) {
frontoc.drawImage(overlays.body.front, 4 * scale, 0 * scale, 8 * scale, 12 * scale);
}
if (render_rleg) {
frontoc.drawImage(overlays.leg.right.front, 4 * scale, 12 * scale, 4 * scale, 12 * scale);
}
if (render_lleg) {
frontoc.drawImage(overlays.leg.left.front, 8 * scale, 12 * scale, 4 * scale, 12 * scale);
}
}
// top // top
@ -230,47 +188,28 @@ exp.draw_model = function(rid, img, scale, overlay, is_body, callback) {
y = scale * -arm_width; y = scale * -arm_width;
z = z_offset + scale * 8; z = z_offset + scale * 8;
ctx.setTransform(1, -skew_a, 1, skew_a, 0, 0); ctx.setTransform(1, -skew_a, 1, skew_a, 0, 0);
ctx.drawImage(parts.shoulder.right, y - z - 0.5, x + z, parts.shoulder.right.width + 1, parts.shoulder.right.height + 1); ctx.drawImage(arm_right_top, y - z - 0.5, x + z, arm_right_top.width + 1, arm_right_top.height + 1);
if (render_rarm) {
x -= 1;
ctx.drawImage(overlays.shoulder.right, y - z, x + z, overlays.shoulder.right.width + 2, overlays.shoulder.right.height + 2);
}
y = scale * 8; y = scale * 8;
ctx.drawImage(parts.shoulder.left, y - z, x + z, parts.shoulder.left.width, parts.shoulder.left.height + 1); ctx.drawImage(arm_left_top, y - z, x + z, arm_left_top.width, arm_left_top.height + 1);
if (render_larm) {
console.log(overlays.shoulder.left);
z += 0.5;
ctx.drawImage(overlays.shoulder.left, y - z, x + z, overlays.shoulder.left.width + 1, overlays.shoulder.left.height + 1);
}
// right side // right side
ctx.setTransform(1, skew_a, 0, skew_b, 0, 0); ctx.setTransform(1, skew_a, 0, skew_b, 0, 0);
x = x_offset + scale * 2; x = x_offset + scale * 2;
y = 0; y = 0;
z = z_offset + scale * 20; z = z_offset + scale * 20;
ctx.drawImage(parts.leg.right.side, x + y, z - y, parts.leg.right.side.width, parts.leg.right.side.height); ctx.drawImage(leg_right_side, x + y, z - y, leg_right_side.width, leg_right_side.height);
if (render_rleg) {
ctx.drawImage(overlays.leg.right.side, x + y, z - y, overlays.leg.right.side.width, overlays.leg.right.side.height + 0.5);
}
x = x_offset + scale * 2; x = x_offset + scale * 2;
y = scale * -arm_width; y = scale * -arm_width;
z = z_offset + scale * 8; z = z_offset + scale * 8;
ctx.drawImage(parts.arm.right.side, x + y, z - y - 0.5, parts.arm.right.side.width, parts.arm.right.side.height + 1); ctx.drawImage(arm_right_side, x + y, z - y - 0.5, arm_right_side.width, arm_right_side.height + 1);
if (render_rarm) {
z -= 1;
ctx.drawImage(overlays.arm.right.side, x + y, z - y, overlays.arm.right.side.width, overlays.arm.right.side.height + 2);
}
// front // front
z = z_offset + scale * 12; z = z_offset + scale * 12;
y = 0; y = 0;
ctx.setTransform(1, -skew_a, 0, skew_b, 0, skew_a); ctx.setTransform(1, -skew_a, 0, skew_b, 0, skew_a);
ctx.drawImage(front, y + x, x + z - 0.5, front.width, front.height); ctx.drawImage(front, y + x, x + z - 0.5, front.width, front.height);
if (!old_skin) {
ctx.drawImage(fronto, y + x, x + z - 1, fronto.width, fronto.height + 1);
}
} }
// head top // head top
@ -278,34 +217,21 @@ exp.draw_model = function(rid, img, scale, overlay, is_body, callback) {
y = -0.5; y = -0.5;
z = z_offset; z = z_offset;
ctx.setTransform(1, -skew_a, 1, skew_a, 0, 0); ctx.setTransform(1, -skew_a, 1, skew_a, 0, 0);
ctx.drawImage(parts.head.top, y - z, x + z, parts.head.top.width, parts.head.top.height + 1); ctx.drawImage(head_top, y - z, x + z, head_top.width, head_top.height + 1);
if (render_head) {
x -= 0.5;
z -= 0.5;
ctx.drawImage(overlays.head.top, y - z, x + z, overlays.head.top.width + 0.5, overlays.head.top.height + 1.5);
}
// head front // head front
x = x_offset + 8 * scale; x = x_offset + 8 * scale;
y = 0; y = 0;
z = z_offset - 0.5; z = z_offset - 0.5;
ctx.setTransform(1, -skew_a, 0, skew_b, 0, skew_a); ctx.setTransform(1, -skew_a, 0, skew_b, 0, skew_a);
ctx.drawImage(parts.head.front, y + x, x + z, parts.head.front.width, parts.head.front.height); ctx.drawImage(head_front, y + x, x + z, head_front.width, head_front.height);
if (render_head) {
z -= 1;
ctx.drawImage(overlays.head.front, y + x, x + z, overlays.head.front.width, overlays.head.front.height + 2);
}
// head right // head right
x = x_offset; x = x_offset;
y = 0; y = 0;
z = z_offset; z = z_offset;
ctx.setTransform(1, skew_a, 0, skew_b, 0, 0); ctx.setTransform(1, skew_a, 0, skew_b, 0, 0);
ctx.drawImage(parts.head.right, x + y, z - y - 0.5, parts.head.right.width, parts.head.right.height + 1); ctx.drawImage(head_right, x + y, z - y - 0.5, head_right.width, head_right.height + 1);
if (render_head) {
z -= 1;
ctx.drawImage(overlays.head.right, x + y, z - y - 0.5, overlays.head.right.width, overlays.head.right.height + 3);
}
canvas.toBuffer(function(err, buf) { canvas.toBuffer(function(err, buf) {
if (err) { if (err) {