Add basic BSP and initial three.js boilerplate

sbuggay · Mar 19, 2020 · 5c073e4 · 5c073e4
1 parent 6734436
commit 5c073e4
Show file tree

Hide file tree

Showing 10 changed files with 947 additions and 0 deletions.
diff --git a/package.json b/package.json
@@ -0,0 +1,26 @@
+{
+  "name": "bspview",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "dependencies": {
+    "stats.js": "^0.17.0",
+    "three": "^0.114.0"
+  },
+  "devDependencies": {
+    "@types/stats.js": "^0.17.0",
+    "@types/three": "^0.103.2",
+    "ts-loader": "^6.2.1",
+    "typescript": "^3.7.5",
+    "webpack": "^4.41.5",
+    "webpack-cli": "^3.3.10",
+    "webpack-dev-server": "^3.10.3"
+  },
+  "scripts": {
+    "build": "webpack",
+    "start": "webpack-dev-server --open",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC"
+}
diff --git a/public/bsp/c1a0.bsp b/public/bsp/c1a0.bsp
diff --git a/public/index.html b/public/index.html
@@ -0,0 +1,16 @@
+<html>
+
+<head>
+    <style>
+        body, html {
+            padding: 0;
+            margin: 0;
+        }
+    </style>
+</head>
+
+<body>
+</body>
+<script src="./bundle.js"></script>
+
+</html>
diff --git a/src/bsp.ts b/src/bsp.ts
@@ -0,0 +1,101 @@
+
+// #define LUMP_ENTITIES      0
+// #define LUMP_PLANES        1
+// #define LUMP_TEXTURES      2
+// #define LUMP_VERTICES      3
+// #define LUMP_VISIBILITY    4
+// #define LUMP_NODES         5
+// #define LUMP_TEXINFO       6
+// #define LUMP_FACES         7
+// #define LUMP_LIGHTING      8
+// #define LUMP_CLIPNODES     9
+// #define LUMP_LEAVES       10
+// #define LUMP_MARKSURFACES 11
+// #define LUMP_EDGES        12
+// #define LUMP_SURFEDGES    13
+// #define LUMP_MODELS       14
+// #define HEADER_LUMPS      15
+
+// typedef struct _VECTOR3D
+// {
+//     float x, y, z;
+// } VECTOR3D;
+
+const lumps = [
+    "LUMP_ENTITIES",
+    "LUMP_PLANES",
+    "LUMP_TEXTURES",
+    "LUMP_VERTICES",
+    "LUMP_VISIBILITY",
+    "LUMP_NODES",
+    "LUMP_TEXINFO",
+    "LUMP_FACES",
+    "LUMP_LIGHTING",
+    "LUMP_CLIPNODES",
+    "LUMP_LEAVES",
+    "LUMP_MARKSURFACES",
+    "LUMP_EDGES",
+    "LUMP_SURFEDGES",
+    "LUMP_MODELS",
+    "HEADER_LUMPS"
+]
+
+interface Vector3D {
+    x: number;
+    y: number;
+    z: number;
+}
+
+interface BSP {
+    vertices: Vector3D[];
+    edges: number[][];
+}
+
+export function parseBSP(buffer: ArrayBuffer): BSP {
+    const view = new DataView(buffer);
+    console.log(view.getUint32(0, true));
+
+    const lumpData: { [key: string]: any } = {};
+
+    for (let i = 0; i < lumps.length; i++) {
+        let lumpType = lumps[i];
+        const offset = view.getUint32((i * 8) + 4, true);
+        const lumpLength = view.getUint32((i * 8) + 8, true);
+        lumpData[lumpType] = { offset, lumpLength };
+    }
+
+    console.table(lumpData);
+
+    // Parse vertices
+    const vertexView = new DataView(buffer, lumpData["LUMP_VERTICES"].offset, lumpData["LUMP_VERTICES"].lumpLength);
+    const vertices = [];
+    for (let offset = 0; offset < vertexView.byteLength; offset += 12) {
+        const x = vertexView.getFloat32(offset, true);
+        const y = vertexView.getFloat32(offset + 4, true);
+        const z = vertexView.getFloat32(offset + 8, true);
+        vertices.push({
+            x, y, z
+        });
+    }
+
+    const edgeView = new DataView(buffer, lumpData["LUMP_EDGES"].offset, lumpData["LUMP_EDGES"].lumpLength);
+    const edges = [];
+    for (let offset = 0; offset < edgeView.byteLength; offset += 4) {
+        const a = edgeView.getUint16(offset, true);
+        const b = edgeView.getUint16(offset + 2, true);
+        edges.push([a, b]);
+    }
+
+    const bsp: BSP = {
+        vertices,
+        edges
+    };
+
+    return bsp;
+}
+
+// function parseVector3D(buffer: ArrayBuffer) {
+//     return {
+//         x: buffer.
+//     }
+// }
diff --git a/src/entry.ts b/src/entry.ts
@@ -0,0 +1,63 @@
+import { main } from "./webgl";
+import { parseBSP } from "./bsp";
+import * as THREE from "three";
+
+import * as Stats from "stats.js";
+import { FlyControls } from "./flyControls";
+
+
+var scene = new THREE.Scene();
+var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 500);
+var renderer = new THREE.WebGLRenderer();
+renderer.setSize(window.innerWidth, window.innerHeight);
+document.body.appendChild(renderer.domElement);
+
+const clock = new THREE.Clock();
+
+
+fetch("/bsp/c1a0.bsp").then(async (response) => {
+    const buffer = await response.arrayBuffer();
+    const bsp = parseBSP(buffer);
+    bsp.edges.forEach(edge => {
+        var geometry = new THREE.Geometry();
+        const v1 = bsp.vertices[edge[0]];
+        const v2 = bsp.vertices[edge[1]];
+        geometry.vertices.push(
+            new THREE.Vector3(v1.x, v1.z, v1.y),
+            new THREE.Vector3(v2.x, v2.z, v2.y),
+        );
+        var material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
+        var seg = new THREE.LineSegments(geometry, material);
+        scene.add(seg);
+    });
+
+    var stats = new Stats();
+    stats.showPanel(0); // 0: fps, 1: ms, 2: mb, 3+: custom
+    document.body.appendChild(stats.dom);
+
+    const controls = new FlyControls(camera, renderer.domElement);
+
+    controls.movementSpeed = 1000;
+    controls.domElement = renderer.domElement;
+    controls.rollSpeed = Math.PI / 24;
+    controls.autoForward = false;
+    controls.dragToLook = false;
+
+
+    const render = function () {
+        var delta = clock.getDelta();
+
+        stats.begin();
+        renderer.render(scene, camera);
+        stats.end();
+
+        controls.update(delta);
+
+        requestAnimationFrame(render);
+    };
+
+    render();
+
+
+});
+