diff --git a/assets/index.d.ts b/assets/index.d.ts new file mode 100644 index 0000000..29fd204 --- /dev/null +++ b/assets/index.d.ts @@ -0,0 +1,4 @@ +declare module '*.jpg' { + const value: any + export = value; + } \ No newline at end of file diff --git a/assets/wood_floor_diff_4k.jpg b/assets/wood_floor_diff_4k.jpg new file mode 100644 index 0000000..dfeeefd Binary files /dev/null and b/assets/wood_floor_diff_4k.jpg differ diff --git a/src/index.ts b/src/index.ts index 2addbfe..923c609 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,6 @@ import * as BABYLON from '@babylonjs/core'; -import { SkyMaterial } from '@babylonjs/materials' +import { SkyMaterial } from '@babylonjs/materials'; +import img from '../assets/wood_floor_diff_4k.jpg'; const canvas = document.createElement('canvas'); canvas.id = "render-canvas"; @@ -22,7 +23,17 @@ skybox.material = skyMaterial; const light = new BABYLON.HemisphericLight('light1', new BABYLON.Vector3(1, 1, 0), scene); -const cube = BABYLON.MeshBuilder.CreateBox('box', {}, scene); +const cube = BABYLON.MeshBuilder.CreateBox('box', {size: 1}, scene); +cube.translate(new BABYLON.Vector3(0, 1, 0), 0.5001); + +const ground = BABYLON.MeshBuilder.CreateGround('ground', {width:15, height:15}, scene); +const groundMat = new BABYLON.StandardMaterial('groundMaterial', scene); +const woodTex = new BABYLON.Texture(img, scene); +woodTex.uScale = ground._width/2; +woodTex.vScale = ground._height/2; +groundMat.diffuseTexture = woodTex; +groundMat.backFaceCulling = false; +ground.material = groundMat; engine.runRenderLoop(() => { scene.render(); diff --git a/tsconfig.json b/tsconfig.json index 58b4185..a36036b 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -14,5 +14,5 @@ "skipLibCheck": true, "outDir": "./dist" }, - "include": ["src"] + "include": ["src", "assets"] } diff --git a/webpack.config.js b/webpack.config.js index 21f4cfc..24a792d 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -12,7 +12,11 @@ module.exports = { test: /\.ts$/, use: 'ts-loader', exclude: /node_modules/ - } + }, + { + test: /\.(png|svg|jpg|jpeg|gif)$/i, + type: 'asset/resource', + }, ] }, resolve: {