From f2fda5e6b68f0d45710ddff754c9717ab8650b12 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=9C=E7=81=AF?= <me@lampese.com>
Date: Mon, 24 Jul 2023 21:04:29 +0800
Subject: [PATCH] merge webviewer

---
 .eslintignore                |   3 +-
 .npmignore                   |   5 +-
 package.json                 |  10 +++-
 webviewer/public/index.html  | 106 +++++++++++++++++++++++++++++++++++
 webviewer/public/texture.png | Bin 0 -> 425 bytes
 5 files changed, 117 insertions(+), 7 deletions(-)
 create mode 100644 webviewer/public/index.html
 create mode 100644 webviewer/public/texture.png
diff --git a/.eslintignore b/.eslintignore
index b512c09..a4755c1 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -1 +1,2 @@
-node_modules
\ No newline at end of file
+webviewer
+node_modules
diff --git a/.npmignore b/.npmignore
index 4f78947..4c3a157 100644
--- a/.npmignore
+++ b/.npmignore
@@ -1,9 +1,8 @@
 index.ts
 tsconfig.json
-src
 build
-src/*.ts
-!src/*.d.ts
+webviewer
+*.ts
 .prettierrc
 .eslintrc
 .eslintignore
diff --git a/package.json b/package.json
index 9f43c15..24c547a 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@pureeval/voxel-geometry",
-	"version": "1.2.5",
+	"version": "1.2.6",
 	"type": "module",
 	"description": "voxel-geometry",
 	"devDependencies": {
@@ -13,10 +13,14 @@
 		"gulp-sourcemaps": "^3.0.0",
 		"gulp-typescript": "^6.0.0-alpha.1",
 		"source-map": "^0.7.4",
-		"typescript": "^4.9.4"
+		"typescript": "^4.9.4",
+		"express": "^4.18.2",
+		"three": "^0.126.1",
+		"ws": "^8.12.0"
 	},
 	"scripts": {
-		"lint": "eslint . --ext .ts"
+		"lint": "eslint . --ext .ts",
+		"webviewer": "tsc && node ./webviewer/server.js"
 	},
 	"main": "index.js",
 	"repository": {
diff --git a/webviewer/public/index.html b/webviewer/public/index.html
new file mode 100644
index 0000000..d1864c7
--- /dev/null
+++ b/webviewer/public/index.html
@@ -0,0 +1,106 @@
+<html>
+
+<head>
+    <meta charset="utf-8" />
+    <title>VoxelGeometry Viewer</title>
+    <style>
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+
+<body>
+    <script async src="https://unpkg.com/es-module-shims@1.3.6/dist/es-module-shims.js"></script>
+    <script type="importmap">
+            {
+                "imports": {
+                    "three": "/node_modules/three/build/three.module.js",
+                    "three/addons/": "/node_modules/three/examples/jsm/"
+                }
+            }
+        </script>
+    <script type="module">
+        import * as THREE from "three";
+        import { OrbitControls } from "three/addons/controls/OrbitControls.js";
+
+        const createScene = () => {
+            let scene = new THREE.Scene();
+            scene.background = new THREE.Color(0xbfd1e5);
+            return scene;
+        };
+
+        let scene = createScene();
+
+        const createCamera = () => {
+            return new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
+        };
+
+        const camera = createCamera();
+
+        const createRenderer = () => {
+            const renderer = new THREE.WebGLRenderer({
+                antialias: true,
+            });
+            renderer.setPixelRatio(window.devicePixelRatio);
+            renderer.setSize(window.innerWidth, window.innerHeight);
+            document.body.appendChild(renderer.domElement);
+            return renderer;
+        };
+
+        const renderer = createRenderer();
+
+        const createMaterial = () => {
+            const texture = new THREE.TextureLoader().load("./texture.png");
+            const material = new THREE.MeshBasicMaterial({
+                map: texture,
+                side: THREE.DoubleSide,
+            });
+            material.transparent = true;
+            texture.magFilter = THREE.NearestFilter;
+            return material;
+        };
+
+        const material = createMaterial();
+
+        const geometry = new THREE.BoxGeometry(1, 1, 1);
+
+        const createBlock = (x, y, z) => {
+            const cube = new THREE.Mesh(geometry, material);
+            scene.add(cube);
+            cube.position.x = x;
+            cube.position.y = y;
+            cube.position.z = z;
+        };
+
+        const clear = () => {
+            scene = createScene();
+        };
+
+        camera.position.z = 5;
+
+        const controls = new OrbitControls(camera, renderer.domElement);
+        controls.target.set(1, 1, 1);
+        controls.update();
+
+        (function animate() {
+            requestAnimationFrame(animate);
+            renderer.render(scene, camera);
+        })();
+
+        const ws = new WebSocket("ws://127.0.0.1:2333");
+
+        ws.onmessage = function (msg) {
+            const op = JSON.parse(msg.data);
+            if (op["op"] == "clear") {
+                clear();
+            } else {
+                for (let x of op["raw"]) {
+                    createBlock(x[0], x[1], x[2]);
+                }
+            }
+        };
+    </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/webviewer/public/texture.png b/webviewer/public/texture.png
new file mode 100644
index 0000000000000000000000000000000000000000..60957f01794f9ecc0ad1eb8ce72749060c7d435b
GIT binary patch
literal 425
zcmV;a0apHrP)<h;3K|Lk000e1NJLTq000mG000mO1^@s6AM^iV00001b5ch_0Itp)
z=>Px$V@X6oR5*==lfi1^Fc5}62Mx8YxGcWxW$8oo-1mQgLg~4^ZDF%Z99c3Wa1V+U
zIaykPk&yoRX67H<JUu?H&IfGQ^4+R+&IcyvFwO^l{(4{>$8Q1Cabmb1%K7!>8DqPa
zaU6Mje`DCEM=?@@W<Mh$n5Y08&U@DEvar2NrJ1O#VJ-j>L5$F}Jpii8behWht`@2$
zdeim=Qdbkt=VtNfxsn1<RYU~8!W!lx&OKkl00wI>fDFl*vN#*3QPG%^tan{{b8g!L
zKv=>}rs+6s64ce0TG)3zeb-+qsvOTPW{5`JwjftM&wfT#({~1CNWF~np_B-4{P<l)
zR(lhc0KjtmO9RM{F?nFSwq#wyTt+A&ge8=~jVH4&=UuMg@b5r0f<{eyWmsO#;y1xJ
zCZ7I$lo8bdrz_CVC(U5(1u*Of_|Lzvk9sp!NK=@cOMusx=WPaSQ?Jf_c?a+bU?|Lq
TOUU0+00000NkvXXu0mjfb0EC*

literal 0
HcmV?d00001

