├── .gitignore
├── .vscode
├── launch.json
└── tasks.json
├── BRICK
└── brickwall001c.tga
├── LICENSE
├── README.md
├── dist
└── WebBSP.js
├── gulpfile.js
├── index.html
├── main.css
├── package-lock.json
├── package.json
├── src
├── BSP
│ ├── BSP.ts
│ ├── Lumps
│ │ ├── BrushLump.ts
│ │ ├── BrushSideLump.ts
│ │ ├── CubemapLump.ts
│ │ ├── DispInfoLump.ts
│ │ ├── DispTrisLump.ts
│ │ ├── DispVertLump.ts
│ │ ├── EdgeLump.ts
│ │ ├── EntityLump.ts
│ │ ├── FaceLump.ts
│ │ ├── GameLump.ts
│ │ ├── GenericLump.ts
│ │ ├── LeafAmbientIndexHDRLump.ts
│ │ ├── LeafAmbientIndexLump.ts
│ │ ├── LeafAmbientLightingLump.ts
│ │ ├── LeafBrushLump.ts
│ │ ├── LeafFaceLump.ts
│ │ ├── LeafLump.ts
│ │ ├── LightingLump.ts
│ │ ├── Lump.ts
│ │ ├── LumpHeader.ts
│ │ ├── LumpType.ts
│ │ ├── ModelLump.ts
│ │ ├── NodeLump.ts
│ │ ├── OriginalFaceLump.ts
│ │ ├── PlaneLump.ts
│ │ ├── SurfEdgeLump.ts
│ │ ├── TexDataLump.ts
│ │ ├── TexDataStringDataLump.ts
│ │ ├── TexDataStringTableLump.ts
│ │ ├── TexInfoLump.ts
│ │ └── VertexLump.ts
│ ├── Structs
│ │ ├── Brush.ts
│ │ ├── BrushSide.ts
│ │ ├── ColorRGBExp32.ts
│ │ ├── CompressedLightCube.ts
│ │ ├── Cubemap.ts
│ │ ├── DispCornerNeighbor.ts
│ │ ├── DispInfo.ts
│ │ ├── DispNeighbor.ts
│ │ ├── DispSubNeighbor.ts
│ │ ├── DispVert.ts
│ │ ├── Edge.ts
│ │ ├── Enums.ts
│ │ ├── Face.ts
│ │ ├── GameLumpStruct.ts
│ │ ├── Leaf.ts
│ │ ├── LeafAmbientIndex.ts
│ │ ├── LeafAmbientLighting.ts
│ │ ├── Model.ts
│ │ ├── Node.ts
│ │ ├── Plane.ts
│ │ ├── TexData.ts
│ │ └── TexInfo.ts
│ └── Utils
│ │ └── BinaryReader.ts
├── KeyboardListener.ts
├── MouseHandler.ts
├── Rendering
│ ├── Camera
│ │ ├── CameraState.ts
│ │ ├── ICamera.ts
│ │ ├── OrthoCamera.ts
│ │ └── PerspectiveCamera.ts
│ ├── EngineCore.ts
│ ├── EngineState.ts
│ ├── IEngineComponent.ts
│ ├── Messaging
│ │ ├── Message.ts
│ │ └── MessageQueue.ts
│ ├── RenderObjects
│ │ ├── BSP
│ │ │ ├── BSPFace.ts
│ │ │ ├── BSPMesh.ts
│ │ │ ├── BSPModel.ts
│ │ │ └── Tree.ts
│ │ │ │ ├── BSPLeaf.ts
│ │ │ │ ├── BSPNode.ts
│ │ │ │ ├── BSPTree.ts
│ │ │ │ └── IBSPTree.ts
│ │ ├── BSPResourceManager.ts
│ │ ├── IRenderable.ts
│ │ └── RenderObject.ts
│ ├── Shaders
│ │ ├── LayoutLocations.ts
│ │ ├── Shader.ts
│ │ ├── ShaderSource.ts
│ │ └── UniformLocations.ts
│ └── Textures
│ │ ├── Texture.ts
│ │ └── TextureDictionary.ts
├── Structs
│ └── Vertex.ts
├── Utils
│ ├── AddRange.ts
│ ├── KeyPress.ts
│ ├── LZMA
│ │ └── lzma.ts
│ ├── LimitAngle.ts
│ ├── MeshFactory.ts
│ ├── WrapAngle.ts
│ └── ZipArray.ts
└── main.ts
├── tsconfig.json
├── tsconfig.watch.json
└── tslint.json
/.gitignore:
--------------------------------------------------------------------------------
1 | *.js
2 | *.js.map
3 |
4 | .tmp/
5 | node_modules/
6 |
7 | #Allow the final bundled file to be included
8 | !WebBSP.js
--------------------------------------------------------------------------------
/.vscode/launch.json:
--------------------------------------------------------------------------------
1 | {
2 | // Use IntelliSense to learn about possible attributes.
3 | // Hover to view descriptions of existing attributes.
4 | // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
5 | "version": "0.2.0",
6 | "configurations": [
7 | {
8 | "type": "chrome",
9 | "request": "attach",
10 | "name": "Attach to Chrome",
11 | "port": 3000,
12 | "webRoot": "${workspaceFolder}"
13 | },
14 | {
15 | "type": "chrome",
16 | "request": "launch",
17 | "name": "Launch Chrome against localhost",
18 | "sourceMaps": true,
19 | "url": "http://localhost:8080",
20 | "webRoot": "${workspaceFolder}"
21 | }
22 | ]
23 | }
--------------------------------------------------------------------------------
/.vscode/tasks.json:
--------------------------------------------------------------------------------
1 | {
2 | // See https://go.microsoft.com/fwlink/?LinkId=733558
3 | // for the documentation about the tasks.json format
4 | "version": "2.0.0",
5 | "tasks": [
6 | {
7 | "type": "typescript",
8 | "tsconfig": "tsconfig.json",
9 | "problemMatcher": [
10 | "$tsc"
11 | ]
12 | },
13 | {
14 | "type": "gulp",
15 | "task": "watch",
16 | "problemMatcher": [
17 | "$gulp-tsc"
18 | ]
19 | }
20 | ]
21 | }
--------------------------------------------------------------------------------
/BRICK/brickwall001c.tga:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Exactol/WebGL-BSP/b199eb9a1419b5a3a47091e63ae48c63958a18e9/BRICK/brickwall001c.tga
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | GNU GENERAL PUBLIC LICENSE
2 | Version 3, 29 June 2007
3 |
4 | Copyright (C) 2007 Free Software Foundation, Inc.
635 | Copyright (C)
636 |
637 | This program is free software: you can redistribute it and/or modify
638 | it under the terms of the GNU General Public License as published by
639 | the Free Software Foundation, either version 3 of the License, or
640 | (at your option) any later version.
641 |
642 | This program is distributed in the hope that it will be useful,
643 | but WITHOUT ANY WARRANTY; without even the implied warranty of
644 | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
645 | GNU General Public License for more details.
646 |
647 | You should have received a copy of the GNU General Public License
648 | along with this program. If not, see Copyright (C)
656 | This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
657 | This is free software, and you are welcome to redistribute it
658 | under certain conditions; type `show c' for details.
659 |
660 | The hypothetical commands `show w' and `show c' should show the appropriate
661 | parts of the General Public License. Of course, your program's commands
662 | might be different; for a GUI interface, you would use an "about box".
663 |
664 | You should also get your employer (if you work as a programmer) or school,
665 | if any, to sign a "copyright disclaimer" for the program, if necessary.
666 | For more information on this, and how to apply and follow the GNU GPL, see
667 | .
675 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # WebGL-BSP
2 | A 3D Source Engine BSP renderer
3 |
4 | Currently can display faces and displacements with estimated colors using reflectivity data.
5 |
6 | 
7 |
--------------------------------------------------------------------------------
/gulpfile.js:
--------------------------------------------------------------------------------
1 | const gulp = require("gulp"),
2 | browserify = require("browserify"),
3 | source = require("vinyl-source-stream"),
4 | buffer = require("vinyl-buffer"),
5 | tsc = require("gulp-typescript"),
6 | sourcemaps = require("gulp-sourcemaps"),
7 | uglify = require("gulp-uglify-es").default,
8 | runSequence = require("run-sequence").use(gulp),
9 | clean = require("gulp-clean"),
10 | gutil = require("gulp-util"),
11 | plumber = require("gulp-plumber")
12 | debug = require("gulp-debug")
13 | print = require("gulp-print").default
14 | watchify = require("watchify")
15 | watch = require("gulp-watch")
16 | browserSync = require("browser-sync");
17 |
18 |
19 | const path = {
20 | src: "src/**/*.ts",
21 | typeSrc: "@types/**/*.ts",
22 | jsDest: ".tmp/",
23 | finalDest: "dist/"
24 |
25 | }
26 | const tsProject = tsc.createProject("tsconfig.json");
27 | const tsWatchProject = tsc.createProject("tsconfig.watch.json");
28 |
29 | const libraryName = "WebBSP";
30 |
31 | var bundler = watchify(browserify({
32 | debug: true,
33 | standalone: libraryName,
34 | detectGlobals: true,
35 | cache: {},
36 | packageCache: {},
37 | fullPaths: true
38 | }));
39 |
40 | bundler.on("update", watchBundleUglify);
41 |
42 | gulp.task("build", function() {
43 | return gulp.src([path.src, path.typeSrc])
44 | .pipe(tsProject())
45 | .on('error', function (err) { gutil.log(gutil.colors.red('[Error]'), err.toString()); })
46 | .pipe(gulp.dest(path.jsDest));
47 | });
48 |
49 | gulp.task("bundle-uglify", () => {
50 | var mainJsFile = path.jsDest + "/main.js";
51 | var outputFileName = libraryName + ".js";
52 |
53 | var bundler = browserify({
54 | debug: true,
55 | standalone: libraryName,
56 | detectGlobals: true,
57 | });
58 |
59 | return bundler.add(mainJsFile)
60 | .bundle()
61 | .pipe(source(outputFileName))
62 | .pipe(buffer())
63 | .pipe(sourcemaps.init({loadMaps: true}))
64 | .pipe(uglify())
65 | .on('error', function (err) { gutil.log(gutil.colors.red('[Error]'), err.toString()); })
66 | .pipe(sourcemaps.write("./"))
67 | .pipe(gulp.dest(path.finalDest));
68 | });
69 |
70 | function watchBundleUglify() {
71 | var mainJsFile = path.jsDest + "/main.js";
72 | var outputFileName = libraryName + ".js";
73 |
74 | return bundler.add(mainJsFile)
75 | .bundle()
76 | .pipe(source(outputFileName))
77 | .pipe(buffer())
78 | .pipe(sourcemaps.init({loadMaps: true}))
79 | .pipe(uglify())
80 | .on('error', function (err) { gutil.log(gutil.colors.red('[Error]'), err.toString()); })
81 | .pipe(sourcemaps.write("./"))
82 | .pipe(gulp.dest(path.finalDest));
83 | }
84 |
85 | gulp.task("clean", function() {
86 | return (
87 | gulp.src([path.jsDest, path.finalDest], {read: false})
88 | .pipe(clean()));
89 | });
90 |
91 | gulp.task("build-and-bundle", function() {
92 | runSequence("clean", "build", "bundle-uglify")
93 | });
94 |
95 | gulp.task("watch", () => {
96 | browserSync.init({
97 | server: {
98 | baseDir: "./",
99 | injectChanges: true,
100 | }
101 | });
102 | watch(path.src, (file) => {
103 | // for some reason gulp dest will not send output file to it's subdirectory, so it needs to be calculated
104 | const subPath = getSubDirPath(file.path);
105 | console.log(subPath);
106 | gulp.src(file.path)
107 | .pipe(plumber())
108 | .pipe(debug({title: "Compiling:"}))
109 | .pipe(tsWatchProject())
110 | .on("error", function (err) { gutil.log(gutil.colors.red('[Error]'), err.toString()); })
111 | .pipe(gulp.dest(path.jsDest + subPath))
112 | .pipe(print((filepath) => `Compiled: ${filepath}`));
113 | watchBundleUglify();
114 | browserSync.reload();
115 | });
116 | });
117 |
118 | function getSubDirPath(fullFilePath) {
119 | let fileSplit = fullFilePath.split("\\");
120 |
121 | // remove file name
122 | fileSplit.pop();
123 |
124 | // reconstruct string and split on \src\
125 | fileSplit = fileSplit.join("\\").split("\\src\\");
126 |
127 | if (fileSplit.length == 1) {
128 | // when file is not in subdirectory return nothing
129 | return "";
130 | }
131 | return fileSplit.pop();
132 | }
133 |
134 | gulp.task("default", ["build-and-bundle"]);
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | WebGL BSP
7 | (array: T[], numTimesRepeat: number): T[] {
86 | const retArray: T[] = [];
87 | for (let i = 0; i < numTimesRepeat; i++) {
88 | addRange(retArray, array);
89 | }
90 | return retArray;
91 | }
--------------------------------------------------------------------------------
/src/Structs/Vertex.ts:
--------------------------------------------------------------------------------
1 | import {vec2, vec4, vec3} from "gl-matrix";
2 |
3 | export const TRUE = 1;
4 | export const FALSE = 0;
5 |
6 | export class Vertex {
7 | // public size = (3 + 4 + 4) * 4; // size of struct in bytes
8 |
9 | public position: vec3;
10 | public normal: vec3;
11 | public fallbackColor: vec4;
12 | public textureLoaded: number;
13 | public texCoord: vec2;
14 | public texIndex: number;
15 |
16 | constructor(_pos: vec3, _norm: vec3 = vec3.create(), fallbackColor = vec4.create(),
17 | textureLoaded = FALSE, texCoord: vec2 = vec2.fromValues(0, 1), texIndex = 255) {
18 | this.position = _pos;
19 | this.normal = _norm;
20 | this.fallbackColor = fallbackColor;
21 | this.textureLoaded = textureLoaded;
22 | this.texCoord = texCoord;
23 | this.texIndex = texIndex;
24 | }
25 | }
--------------------------------------------------------------------------------
/src/Utils/AddRange.ts:
--------------------------------------------------------------------------------
1 | export function addRange(arr1, arr2) {
2 | arr2.forEach((item) => {
3 | arr1.push(item);
4 | });
5 | }
--------------------------------------------------------------------------------
/src/Utils/KeyPress.ts:
--------------------------------------------------------------------------------
1 | export enum Key {
2 | A = "A",
3 | B = "B",
4 | C = "C",
5 | D = "D",
6 | E = "E",
7 | F = "F",
8 | G = "G",
9 | H = "H",
10 | I = "I",
11 | J = "J",
12 | K = "K",
13 | L = "L",
14 | M = "M",
15 | N = "N",
16 | O = "O",
17 | P = "P",
18 | Q = "Q",
19 | R = "R",
20 | S = "S",
21 | T = "T",
22 | U = "U",
23 | V = "V",
24 | W = "W",
25 | X = "X",
26 | Y = "Y",
27 | Z = "Z",
28 | Escape = "Escape",
29 | }
30 |
31 | export enum KeyModifier {
32 | Shift = "Shift",
33 | }
34 |
35 | export enum KeyState {
36 | Keyup,
37 | Keydown,
38 | }
39 |
40 | export class KeyPress {
41 | public key: Key | null;
42 | public state: KeyState | undefined | null;
43 | public modifier: KeyModifier | undefined | null;
44 |
45 | constructor(key: Key | null, state?: KeyState, modifier?: KeyModifier) {
46 | this.key = key;
47 | this.modifier = modifier;
48 | this.state = state;
49 | }
50 | }
--------------------------------------------------------------------------------
/src/Utils/LZMA/lzma.ts:
--------------------------------------------------------------------------------
1 | // export class LZMA {
2 |
3 | // }
--------------------------------------------------------------------------------
/src/Utils/LimitAngle.ts:
--------------------------------------------------------------------------------
1 | // limit angle between min and max
2 | export function limitAngle(angle: number, min: number, max: number) {
3 | if (angle < min) {
4 | return min;
5 | } else if (angle > max) {
6 | return max;
7 | } else {
8 | return angle;
9 | }
10 | }
--------------------------------------------------------------------------------
/src/Utils/MeshFactory.ts:
--------------------------------------------------------------------------------
1 | // import { Vertex } from "../Structs/Vertex";
2 | // import { vec3, vec4 } from "gl-matrix";
3 | export class MeshFactory {
4 |
5 | }
6 | // export class MeshFactory {
7 | // public static createSolidCube(SideLength: number = 10, color: vec4 = vec4.fromValues(1, 0, 0, 1)): Vertex[] {
8 | // const halfSideLength = SideLength / 2; // half side length, otherwise creates cube with 2x length requested
9 |
10 | // return [
11 | // new Vertex(vec3.fromValues(-halfSideLength, -halfSideLength, -halfSideLength), color),
12 | // new Vertex(vec3.fromValues(-halfSideLength, -halfSideLength, halfSideLength), color),
13 | // new Vertex(vec3.fromValues(-halfSideLength, halfSideLength, -halfSideLength), color),
14 | // new Vertex(vec3.fromValues(-halfSideLength, halfSideLength, -halfSideLength), color),
15 | // new Vertex(vec3.fromValues(-halfSideLength, -halfSideLength, halfSideLength), color),
16 | // new Vertex(vec3.fromValues(-halfSideLength, halfSideLength, halfSideLength), color),
17 |
18 | // new Vertex(vec3.fromValues(halfSideLength, -halfSideLength, -halfSideLength), color),
19 | // new Vertex(vec3.fromValues(halfSideLength, halfSideLength, -halfSideLength), color),
20 | // new Vertex(vec3.fromValues(halfSideLength, -halfSideLength, halfSideLength), color),
21 | // new Vertex(vec3.fromValues(halfSideLength, -halfSideLength, halfSideLength), color),
22 | // new Vertex(vec3.fromValues(halfSideLength, halfSideLength, -halfSideLength), color),
23 | // new Vertex(vec3.fromValues(halfSideLength, halfSideLength, halfSideLength), color),
24 |
25 | // new Vertex(vec3.fromValues(-halfSideLength, -halfSideLength, -halfSideLength), color),
26 | // new Vertex(vec3.fromValues(halfSideLength, -halfSideLength, -halfSideLength), color),
27 | // new Vertex(vec3.fromValues(-halfSideLength, -halfSideLength, halfSideLength), color),
28 | // new Vertex(vec3.fromValues(-halfSideLength, -halfSideLength, halfSideLength), color),
29 | // new Vertex(vec3.fromValues(halfSideLength, -halfSideLength, -halfSideLength), color),
30 | // new Vertex(vec3.fromValues(halfSideLength, -halfSideLength, halfSideLength), color),
31 |
32 | // new Vertex(vec3.fromValues(-halfSideLength, halfSideLength, -halfSideLength), color),
33 | // new Vertex(vec3.fromValues(-halfSideLength, halfSideLength, halfSideLength), color),
34 | // new Vertex(vec3.fromValues(halfSideLength, halfSideLength, -halfSideLength), color),
35 | // new Vertex(vec3.fromValues(halfSideLength, halfSideLength, -halfSideLength), color),
36 | // new Vertex(vec3.fromValues(-halfSideLength, halfSideLength, halfSideLength), color),
37 | // new Vertex(vec3.fromValues(halfSideLength, halfSideLength, halfSideLength), color),
38 |
39 | // new Vertex(vec3.fromValues(-halfSideLength, -halfSideLength, -halfSideLength), color),
40 | // new Vertex(vec3.fromValues(-halfSideLength, halfSideLength, -halfSideLength), color),
41 | // new Vertex(vec3.fromValues(halfSideLength, -halfSideLength, -halfSideLength), color),
42 | // new Vertex(vec3.fromValues(halfSideLength, -halfSideLength, -halfSideLength), color),
43 | // new Vertex(vec3.fromValues(-halfSideLength, halfSideLength, -halfSideLength), color),
44 | // new Vertex(vec3.fromValues(halfSideLength, halfSideLength, -halfSideLength), color),
45 |
46 | // new Vertex(vec3.fromValues(-halfSideLength, -halfSideLength, halfSideLength), color),
47 | // new Vertex(vec3.fromValues(halfSideLength, -halfSideLength, halfSideLength), color),
48 | // new Vertex(vec3.fromValues(-halfSideLength, halfSideLength, halfSideLength), color),
49 | // new Vertex(vec3.fromValues(-halfSideLength, halfSideLength, halfSideLength), color),
50 | // new Vertex(vec3.fromValues(halfSideLength, -halfSideLength, halfSideLength), color),
51 | // new Vertex(vec3.fromValues(halfSideLength, halfSideLength, halfSideLength), color)
52 | // ];
53 | // }
54 | // }
--------------------------------------------------------------------------------
/src/Utils/WrapAngle.ts:
--------------------------------------------------------------------------------
1 | // wrap angle between 0 and 360 degrees
2 | export function wrapAngle(angle: number) {
3 |
4 | while (angle >= 360) {
5 | angle -= 360;
6 | }
7 |
8 | while (angle < 0) {
9 | angle += 360;
10 | }
11 | return angle;
12 | }
--------------------------------------------------------------------------------
/src/Utils/ZipArray.ts:
--------------------------------------------------------------------------------
1 | // source https://gist.github.com/jonschlinkert/2c5e5cd8c3a561616e8572dd95ae15e3
2 | export function zip(a, b) {
3 | const arr: any[] = [];
4 | for (const key in a) {
5 | if (a.hasOwnProperty(key)) {
6 | arr.push([a[key], b[key]]);
7 | }
8 | }
9 | return arr;
10 | }
--------------------------------------------------------------------------------
/src/main.ts:
--------------------------------------------------------------------------------
1 | import { EngineCore } from "./Rendering/EngineCore";
2 | import { MeshFactory } from "./Utils/MeshFactory";
3 | import { RenderObject } from "./Rendering/RenderObjects/RenderObject";
4 | import { Vertex } from "./Structs/Vertex";
5 | import { vec4, vec3 } from "gl-matrix";
6 | import { BSP } from "./BSP/BSP";
7 | import { LumpType } from "./BSP/Lumps/LumpType";
8 | import { BSPMesh } from "./Rendering/RenderObjects/BSP/BSPMesh";
9 | import { DispInfoLump } from "./BSP/Lumps/DispInfoLump";
10 | import { FaceLump } from "./BSP/Lumps/FaceLump";
11 | import { DispVert } from "./BSP/Structs/DispVert";
12 | import { DispVertLump } from "./BSP/Lumps/DispVertLump";
13 | import { DispTrisLump } from "./BSP/Lumps/DispTrisLump";
14 | import { LeafLump } from "./BSP/Lumps/LeafLump";
15 |
16 | // export function so it can be called globally
17 | // @ts-ignore
18 | window.initWebGL = initWebGL;
19 |
20 | function initWebGL(): void {
21 | const bspRenderer = new BSPRenderer();
22 | }
23 |
24 | class BSPRenderer {
25 | public gl!: WebGL2RenderingContext | null;
26 | public renderer!: EngineCore;
27 |
28 | constructor() {
29 | const canvas: HTMLCanvasElement = document.getElementById("canvas") as HTMLCanvasElement;
30 | if (!canvas) {
31 | alert("Could not find canvas");
32 | return;
33 | }
34 |
35 | // get webgl2 context
36 | this.gl = canvas.getContext("webgl2");
37 |
38 | if (!this.gl) {
39 | alert("Unable to initialize WebGL2. Your browser may not support it.");
40 | return;
41 | }
42 |
43 | console.log("WebGL Version: " + this.gl.VERSION);
44 | console.log("WebGL Shader Language Version: " + this.gl.SHADING_LANGUAGE_VERSION);
45 |
46 | this.renderer = new EngineCore(this.gl);
47 | this.renderer.main();
48 |
49 | this.setupBtnListeners();
50 | }
51 |
52 | public setupBtnListeners() {
53 | // setup button listener for open file dialog
54 | const openBtn = document.getElementById("openBtn");
55 | if (openBtn == null) {
56 | console.log("Open button was null");
57 | return;
58 | }
59 | openBtn.addEventListener("click", this.openFileBtnCallback.bind(this), false);
60 |
61 | const fileDialog = document.getElementById("fileDialog") as HTMLInputElement;
62 | fileDialog.value = "";
63 |
64 | if (!fileDialog) {
65 | return;
66 | }
67 |
68 | if (fileDialog == null) {
69 | console.log("fileDialog was null");
70 | return;
71 | }
72 |
73 | // event that handles when file is selected
74 | fileDialog.addEventListener("change", () => {
75 | if (fileDialog.files == null) {
76 | console.log("selected files were null");
77 | return;
78 | }
79 |
80 | const file = fileDialog.files[0];
81 | if (file == null) {
82 | return;
83 | }
84 |
85 | // console.log(file);
86 | if (file.name.match(/.*\.(bsp)$/gm)) {
87 | const reader = new FileReader();
88 |
89 | reader.onload = this.readBSP.bind(this);
90 | reader.readAsArrayBuffer(file);
91 | } else {
92 | console.log("Only BSP files are supported");
93 | }
94 | }, false);
95 | }
96 |
97 | public openFileBtnCallback() {
98 | const fileDialog = document.getElementById("fileDialog") as HTMLInputElement;
99 |
100 | if (fileDialog == null) {
101 | console.log("fileDialog was null");
102 | return;
103 | }
104 |
105 | fileDialog.click();
106 | }
107 |
108 | public readBSP(e: FileReaderProgressEvent) {
109 | if (e.target == null) {
110 | throw new Error("BSP Read Error");
111 | }
112 | const bsp = new BSP(e.target.result);
113 |
114 | if (this.gl == null) {
115 | return;
116 | }
117 | // const lump = bsp.readLump(LumpType.Leafs) as LeafLump;
118 | // console.log(lump.toString());
119 | // bsp.printLumps();
120 | this.renderer.clearRenderObjects();
121 | this.renderer.addRenderableObject(new BSPMesh(this.gl, bsp));
122 | // start rendering frames
123 | this.renderer.renderFrame = true;
124 | }
125 | }
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | /* Basic Options */
4 | "target": "es6",
5 | "module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
6 | "noImplicitAny": false,
7 | // "moduleResolution": "node",
8 | // "watch": true,
9 | // "lib": [], /* Specify library files to be included in the compilation. */
10 | // "allowJs": true, /* Allow javascript files to be compiled. */
11 | // "checkJs": true, /* Report errors in .js files. */
12 | // "jsx": "preserve", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
13 | // "declaration": true, /* Generates corresponding '.d.ts' file. */
14 | "sourceMap": true, /* Generates corresponding '.map' file. */
15 | // "outFile": "../main.js", /* Concatenate and emit output to single file. */
16 | // "outDir": "../", /* Redirect output structure to the directory. */
17 | // "rootDir": "./", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
18 | // "removeComments": true, /* Do not emit comments to output. */
19 | // "noEmit": true, /* Do not emit outputs. */
20 | // "importHelpers": true, /* Import emit helpers from 'tslib'. */
21 | // "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
22 | "isolatedModules": false, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
23 |
24 | /* Strict Type-Checking Options */
25 | "strict": true, /* Enable all strict type-checking options. */
26 | // "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */
27 | // "strictNullChecks": true, /* Enable strict null checks. */
28 | // "strictFunctionTypes": true, /* Enable strict checking of function types. */
29 | // "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */
30 | // "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */
31 | // "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */
32 |
33 | /* Additional Checks */
34 | // "noUnusedLocals": true, /* Report errors on unused locals. */
35 | // "noUnusedParameters": true, /* Report errors on unused parameters. */
36 | // "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
37 | // "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
38 |
39 | /* Module Resolution Options */
40 | // "moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
41 | // "baseUrl": "./", /* Base directory to resolve non-absolute module names. */
42 | // "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
43 | // "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */
44 | "typeRoots": ["node_modules/@types/"], /* List of folders to include type definitions from. */
45 | // "types": [], /* Type declaration files to be included in compilation. */
46 | // "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
47 | "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
48 | // "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */
49 |
50 | /* Source Map Options */
51 | // "sourceRoot": "./", /* Specify the location where debugger should locate TypeScript files instead of source locations. */
52 | // "mapRoot": "./", /* Specify the location where debugger should locate map files instead of generated locations. */
53 | // "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */
54 | // "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
55 |
56 | /* Experimental Options */
57 | // "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
58 | // "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
59 | }
60 | }
--------------------------------------------------------------------------------
/tsconfig.watch.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | /* Basic Options */
4 | "target": "es5",
5 | "module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
6 | "noImplicitAny": false,
7 | // "moduleResolution": "node",
8 | // "watch": true,
9 | // "lib": [], /* Specify library files to be included in the compilation. */
10 | // "allowJs": true, /* Allow javascript files to be compiled. */
11 | // "checkJs": true, /* Report errors in .js files. */
12 | // "jsx": "preserve", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
13 | // "declaration": true, /* Generates corresponding '.d.ts' file. */
14 | "sourceMap": true, /* Generates corresponding '.map' file. */
15 | // "outFile": "../main.js", /* Concatenate and emit output to single file. */
16 | // "outDir": "../", /* Redirect output structure to the directory. */
17 | // "rootDir": "./", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
18 | // "removeComments": true, /* Do not emit comments to output. */
19 | // "noEmit": true, /* Do not emit outputs. */
20 | // "importHelpers": true, /* Import emit helpers from 'tslib'. */
21 | // "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
22 | "isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
23 |
24 | /* Strict Type-Checking Options */
25 | "strict": true, /* Enable all strict type-checking options. */
26 | // "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */
27 | // "strictNullChecks": true, /* Enable strict null checks. */
28 | // "strictFunctionTypes": true, /* Enable strict checking of function types. */
29 | // "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */
30 | // "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */
31 | // "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */
32 |
33 | /* Additional Checks */
34 | // "noUnusedLocals": true, /* Report errors on unused locals. */
35 | // "noUnusedParameters": true, /* Report errors on unused parameters. */
36 | // "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
37 | // "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
38 |
39 | /* Module Resolution Options */
40 | // "moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
41 | // "baseUrl": "./", /* Base directory to resolve non-absolute module names. */
42 | // "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
43 | // "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */
44 | "typeRoots": ["node_modules/@types/"], /* List of folders to include type definitions from. */
45 | // "types": [], /* Type declaration files to be included in compilation. */
46 | // "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
47 | "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
48 | // "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */
49 |
50 | /* Source Map Options */
51 | // "sourceRoot": "./", /* Specify the location where debugger should locate TypeScript files instead of source locations. */
52 | // "mapRoot": "./", /* Specify the location where debugger should locate map files instead of generated locations. */
53 | // "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */
54 | // "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
55 |
56 | /* Experimental Options */
57 | // "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
58 | // "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
59 | }
60 | }
--------------------------------------------------------------------------------
/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "defaultSeverity": "error",
3 | "extends": [
4 | "tslint:recommended"
5 | ],
6 | "jsRules": {},
7 | "rules": {
8 | "no-empty": false,
9 | "indent": true,
10 | "variable-name": false,
11 | "no-console": false,
12 | "no-trailing-whitespace": false,
13 | "no-bitwise": false,
14 | "eofline": false,
15 | "no-consecutive-blank-lines": false,
16 | "ordered-imports": false,
17 | "max-classes-per-file": false,
18 | "trailing-comma": false,
19 | "member-ordering": false,
20 | "align": false,
21 | "prefer-for-of": false
22 | },
23 | "rulesDirectory": []
24 | }
--------------------------------------------------------------------------------