implement entity model rendering
(cherry picked from commit a0e5d51290cf521d511f90e23445206a14c4a772)
This commit is contained in:
LabyStudio
@@ -0,0 +1,156 @@
|
||||
window.ModelRenderer = class {
|
||||
|
||||
/**
|
||||
* Create cube object
|
||||
*
|
||||
* @param textureOffsetX x offset position on the texture
|
||||
* @param textureOffsetY y offset position on the texture
|
||||
*/
|
||||
constructor(textureOffsetX, textureOffsetY) {
|
||||
this.textureOffsetX = textureOffsetX;
|
||||
this.textureOffsetY = textureOffsetY;
|
||||
|
||||
this.xRotation = 0;
|
||||
this.yRotation = 0;
|
||||
this.zRotation = 0;
|
||||
|
||||
this.x = 0;
|
||||
this.y = 0;
|
||||
this.z = 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the texture offset position of the cube
|
||||
*
|
||||
* @param textureOffsetX Offset position x
|
||||
* @param textureOffsetY Offset position y
|
||||
*/
|
||||
setTextureOffset(textureOffsetX, textureOffsetY) {
|
||||
this.textureOffsetX = textureOffsetX;
|
||||
this.textureOffsetY = textureOffsetY;
|
||||
|
||||
this.xRotation = 0;
|
||||
this.yRotation = 0;
|
||||
this.zRotation = 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Create box using offset position and width, height and depth
|
||||
*
|
||||
* @param offsetX X offset of the render position
|
||||
* @param offsetY Y offset of the render position
|
||||
* @param offsetZ Z offset of the render position
|
||||
* @param width Cube width
|
||||
* @param height Cube height
|
||||
* @param depth Cube depth
|
||||
*/
|
||||
setBox(offsetX, offsetY, offsetZ, width, height, depth) {
|
||||
this.polygons = [];
|
||||
|
||||
let x = offsetX + width;
|
||||
let y = offsetY + height;
|
||||
let z = offsetZ + depth;
|
||||
|
||||
// Create bottom vertex points of cube
|
||||
let vertexBottom1 = new Vertex(offsetX, offsetY, offsetZ, 0.0, 0.0);
|
||||
let vertexBottom2 = new Vertex(x, offsetY, offsetZ, 0.0, 8.0);
|
||||
let vertexBottom3 = new Vertex(offsetX, offsetY, z, 0.0, 0.0);
|
||||
let vertexBottom4 = new Vertex(x, offsetY, z, 0.0, 8.0);
|
||||
|
||||
// Create top vertex points of cube
|
||||
let vertexTop1 = new Vertex(x, y, z, 8.0, 8.0);
|
||||
let vertexTop2 = new Vertex(offsetX, y, z, 8.0, 0.0);
|
||||
let vertexTop3 = new Vertex(x, y, offsetZ, 8.0, 8.0);
|
||||
let vertexTop4 = new Vertex(offsetX, y, offsetZ, 8.0, 0.0);
|
||||
|
||||
// Create polygons for each cube side
|
||||
this.polygons[0] = new Polygon(
|
||||
[vertexBottom4, vertexBottom2, vertexTop3, vertexTop1],
|
||||
this.textureOffsetX + depth + width,
|
||||
this.textureOffsetY + depth,
|
||||
this.textureOffsetX + depth + width + depth,
|
||||
this.textureOffsetY + depth + height
|
||||
);
|
||||
|
||||
this.polygons[1] = new Polygon(
|
||||
[vertexBottom1, vertexBottom3, vertexTop2, vertexTop4],
|
||||
this.textureOffsetX,
|
||||
this.textureOffsetY + depth,
|
||||
this.textureOffsetX + depth,
|
||||
this.textureOffsetY + depth + height
|
||||
);
|
||||
|
||||
this.polygons[2] = new Polygon(
|
||||
[vertexBottom4, vertexBottom3, vertexBottom1, vertexBottom2],
|
||||
this.textureOffsetX + depth,
|
||||
this.textureOffsetY,
|
||||
this.textureOffsetX + depth + width,
|
||||
this.textureOffsetY + depth
|
||||
);
|
||||
|
||||
this.polygons[3] = new Polygon(
|
||||
[vertexTop3, vertexTop4, vertexTop2, vertexTop1],
|
||||
this.textureOffsetX + depth + width,
|
||||
this.textureOffsetY,
|
||||
this.textureOffsetX + depth + width + width,
|
||||
this.textureOffsetY + depth
|
||||
);
|
||||
|
||||
this.polygons[4] = new Polygon(
|
||||
[vertexBottom2, vertexBottom1, vertexTop4, vertexTop3],
|
||||
this.textureOffsetX + depth,
|
||||
this.textureOffsetY + depth,
|
||||
this.textureOffsetX + depth + width,
|
||||
this.textureOffsetY + depth + height
|
||||
);
|
||||
|
||||
this.polygons[5] = new Polygon(
|
||||
[vertexBottom3, vertexBottom4, vertexTop1, vertexTop2],
|
||||
this.textureOffsetX + depth + width + depth,
|
||||
this.textureOffsetY + depth,
|
||||
this.textureOffsetX + depth + width + depth + width,
|
||||
this.textureOffsetY + depth + height
|
||||
);
|
||||
|
||||
return this;
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the absolute position of the cube
|
||||
*
|
||||
* @param x Absolute x position of cube
|
||||
* @param y Absolute y position of cube
|
||||
* @param z Absolute z position of cube
|
||||
*/
|
||||
setPosition(x, y, z) {
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.z = z;
|
||||
}
|
||||
|
||||
rebuild(tessellator, entity) {
|
||||
// Start drawing
|
||||
tessellator.startDrawing();
|
||||
|
||||
// Render polygons
|
||||
for (let i = 0; i < 6; i++) {
|
||||
let polygon = this.polygons[i];
|
||||
polygon.render(tessellator);
|
||||
}
|
||||
|
||||
// Finish drawing
|
||||
tessellator.draw(entity.group);
|
||||
}
|
||||
|
||||
render(entity) {
|
||||
entity.group.position.setX(this.x);
|
||||
entity.group.position.setY(this.y);
|
||||
entity.group.position.setZ(this.z);
|
||||
|
||||
entity.group.rotation.order = 'ZYX';
|
||||
entity.group.rotation.x = this.xRotation;
|
||||
entity.group.rotation.y = this.yRotation;
|
||||
entity.group.rotation.z = this.zRotation;
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,41 @@
|
||||
window.Polygon = class {
|
||||
|
||||
/**
|
||||
* Bind UV mappings on the vertices
|
||||
*
|
||||
* @param vertices Vertex array
|
||||
* @param minU Minimum U coordinate
|
||||
* @param minV Minimum V coordinate
|
||||
* @param maxU Maximum U coordinate
|
||||
* @param maxV Maximum V coordinate
|
||||
*/
|
||||
constructor(vertices, minU, minV, maxU, maxV) {
|
||||
this.vertices = vertices;
|
||||
this.vertexCount = vertices.length;
|
||||
|
||||
// Map UV on vertices
|
||||
vertices[0] = vertices[0].remap(maxU, minV);
|
||||
vertices[1] = vertices[1].remap(minU, minV);
|
||||
vertices[2] = vertices[2].remap(minU, maxV);
|
||||
vertices[3] = vertices[3].remap(maxU, maxV);
|
||||
}
|
||||
|
||||
render(tessellator) {
|
||||
// Set color of polygon
|
||||
tessellator.setColor(1, 1, 1);
|
||||
|
||||
// Render all vertices
|
||||
for (let i = 3; i >= 0; i--) {
|
||||
let vertex = this.vertices[i];
|
||||
|
||||
// Bind UV mappings and render vertex
|
||||
tessellator.addVertexWithUV(
|
||||
vertex.position.x,
|
||||
vertex.position.y,
|
||||
vertex.position.z,
|
||||
vertex.u / 64.0,
|
||||
vertex.v / 32.0
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,29 @@
|
||||
window.Vertex = class {
|
||||
|
||||
/**
|
||||
* A vertex contains a 3 float vector position and UV coordinates
|
||||
*
|
||||
* @param x X position
|
||||
* @param y Y position
|
||||
* @param z Z position
|
||||
* @param u U mapping
|
||||
* @param v V mapping
|
||||
*/
|
||||
constructor(x, y, z, u, v) {
|
||||
this.position = new Vector3(x, y, z);
|
||||
this.u = u;
|
||||
this.v = v;
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a new vertex of the current one with different UV mappings
|
||||
*
|
||||
* @param u New U mapping
|
||||
* @param v New V mapping
|
||||
* @return New vertex with the vector position of the current one
|
||||
*/
|
||||
remap(u, v) {
|
||||
return new Vertex(this.position.x, this.position.y, this.position.z, u, v);
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user