Fakultas Ilmu Komputer UI

Commit f818c30d authored by Albertus Angga's avatar Albertus Angga
Browse files

Clean up code structure

parent 9d3fd0dd
function getScaledVertexPointsAndNormals(vertices, polygonIndices, scaleFactor) {
if (!scaleFactor) {
scaleFactor = 1;
}
let initPoints = [];
for (let i = 0; i < polygonIndices.length; i++) {
let v = vertices[polygonIndices[i]]
initPoints.push([
v[0] * scaleFactor,
v[1] * scaleFactor,
v[2] * scaleFactor,
1.0])
}
let a = initPoints[0]
let b = initPoints[1]
let c = initPoints[2]
// Compute normal from the direction of first 3 points.
var t1 = subtract(b, a);
var t2 = subtract(c, b);
var normal = cross(t1, t2);
normal = vec4(normal);
// Duplicate points using triangle fan style
let normals = [];
let points = [];
for (let i = 1; i < initPoints.length - 1; i++) {
b = initPoints[i];
c = initPoints[i+1];
points.push(a);
points.push(b);
points.push(c);
normals.push(normal);
normals.push(normal);
normals.push(normal);
}
return {
points,
normals
}
}
function getScaledModelPointsAndNormals(vertices, polygonIndices, scaleFactor) {
if (!scaleFactor) {
scaleFactor = 1;
}
// Estimate array size
let totalPoints = 0
polygonIndices.forEach(indices => {
totalPoints += (indices.length - 2) * 3
})
// Init array with size totalPoints
let points = new Array(totalPoints);
let normals = new Array(totalPoints);
let pointCnt = 0;
polygonIndices.forEach(indices => {
let initPoints = [];
for (let i = 0; i < indices.length; i++) {
let v = vertices[indices[i]]
initPoints.push([
v[0] * scaleFactor,
v[1] * scaleFactor,
v[2] * scaleFactor,
1.0])
}
let a = initPoints[0]
let b = initPoints[1]
let c = initPoints[2]
// Compute normal from the direction of first 3 points.
var t1 = subtract(b, a);
var t2 = subtract(c, b);
var normal = cross(t1, t2);
normal = vec4(normal);
// Duplicate points using triangle fan style
for (let i = 1; i < initPoints.length - 1; i++) {
b = initPoints[i];
c = initPoints[i+1];
points[pointCnt] = a;
normals[pointCnt++] = normal;
points[pointCnt] = b;
normals[pointCnt++] = normal;
points[pointCnt] = c;
normals[pointCnt++] = normal;
}
})
return {
points,
normals
}
}
/*
// Appending new data to points and normals array, without allocating space.
// Inspecting performance shows scripting takes ~600ms for 20000 vertex.
var vertices = objVertsData.vertices;
objVertsData.indices.forEach(polygonIndices => {
let faceData = getScaledVertexPointsAndNormals(vertices, polygonIndices)
pointsArray = [...pointsArray, ...faceData.points];
normalsArray = [...normalsArray, ...faceData.normals];
});
numVertices = pointsArray.length;
*/
/*
// Appending new data to points & normals array, but this time,
// allocating single model vertex count.
// Scripting takes ~200ms.
var facesData = getScaledModelPointsAndNormals(
objVertsData.vertices, objVertsData.indices
)
pointsArray = [...pointsArray, ...facesData.points];
normalsArray = [...normalsArray, ...facesData.normals];
numVertices = pointsArray.length;
*/
......@@ -3,8 +3,8 @@
<title>Link</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="lib/css/bootstrap.min.css">
<link rel="stylesheet" href="no-2.css">
<link rel="stylesheet" href="no-2-mobile.css">
<link rel="stylesheet" href="index.css">
<link rel="stylesheet" href="index-mobile.css">
<script id="vertex-shader" type="x-shader/x-vertex">
attribute vec4 vPosition;
attribute vec3 vNormal;
......@@ -75,34 +75,34 @@ void main()
}
</script>
<script type="text/javascript" src="./lib/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="./lib/js/popper-1.16.0.min.js"></script>
<script type="text/javascript" src="./lib/js/bootstrap.min.js"></script>
<script type="text/javascript" src="lib/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="lib/js/popper-1.16.0.min.js"></script>
<script type="text/javascript" src="lib/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../Common/webgl-utils.js"></script>
<script type="text/javascript" src="../Common/initShaders.js"></script>
<script type="text/javascript" src="../Common/MV.js"></script>
<script type="text/javascript" src="./m4.js"></script>
<script type="text/javascript" src="lib/js/webgl/webgl-utils.js"></script>
<script type="text/javascript" src="lib/js/webgl/initShaders.js"></script>
<script type="text/javascript" src="lib/js/webgl/MV.js"></script>
<script type="text/javascript" src="lib/js/webgl/m4.js"></script>
<script type="text/javascript" src="./utils.js"></script>
<script type="text/javascript" src="./event-dispatcher.js"></script>
<script type="text/javascript" src="modules/utils.js"></script>
<script type="text/javascript" src="modules/event-dispatcher.js"></script>
<script type="text/javascript" src="./scene-graph.js"></script>
<script type="text/javascript" src="./object-node.js"></script>
<script type="text/javascript" src="./model.js"></script>
<script type="text/javascript" src="./animation-manager.js"></script>
<script type="text/javascript" src="./renderer.js"></script>
<script type="text/javascript" src="modules/scene-graph.js"></script>
<script type="text/javascript" src="modules/object-node.js"></script>
<script type="text/javascript" src="modules/model.js"></script>
<script type="text/javascript" src="modules/animation-manager.js"></script>
<script type="text/javascript" src="modules/renderer.js"></script>
<script type="text/javascript" src="../temp/objects-materials.js"></script>
<script type="text/javascript" src="../temp/objects-data.js"></script>
<script type="text/javascript" src="../temp/objects-vertices.js"></script>
<script type="text/javascript" src="../temp/objects-animations.js"></script>
<script type="text/javascript" src="./camera-coordinates.js"></script>
<script type="text/javascript" src="resources/objects/objects-materials.js"></script>
<script type="text/javascript" src="resources/objects/objects-data.js"></script>
<script type="text/javascript" src="resources/objects/objects-vertices.js"></script>
<script type="text/javascript" src="resources/objects/objects-animations.js"></script>
<script type="text/javascript" src="modules/camera-coordinates.js"></script>
<script type="text/javascript" src="./module-navigable-camera.js"></script>
<script type="text/javascript" src="./module-select-object.js"></script>
<script type="text/javascript" src="modules/module-navigable-camera.js"></script>
<script type="text/javascript" src="modules/module-select-object.js"></script>
<script type="text/javascript" src="./no-2.js"></script>
<script type="text/javascript" src="index.js"></script>
<body>
......@@ -123,7 +123,7 @@ void main()
<div id="menu-toggler-wrapper" class="show-menu">
<button type="button" class="btn btn-primary" id="menu-toggler-button">
<span class="button-text">Tutup</span>
<img class="arrow" src="arrow.svg" />
<img class="arrow" src="resources/images/arrow.svg" />
</button>
<div class="menu">
<div class="submenu">
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment