175 lines
4.7 KiB
HTML
175 lines
4.7 KiB
HTML
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Kepler</title>
|
||
|
|
</head>
|
||
|
|
<link rel="stylesheet" type="text/css" href="../loading-bar.css"/>
|
||
|
|
<script type="text/javascript" src="../loading-bar.js"></script>
|
||
|
|
|
||
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.js"></script>
|
||
|
|
|
||
|
|
<link rel="stylesheet" href="../style.css" type="text/css">
|
||
|
|
|
||
|
|
<script type="module">
|
||
|
|
|
||
|
|
import keplerEngine from '../engine/kepler.js';
|
||
|
|
import entity from '../engine/entity.js';
|
||
|
|
import material from '../engine/material.js';
|
||
|
|
import sampler2D from '../engine/sampler2D.js';
|
||
|
|
|
||
|
|
import {matrix4} from '../engine/math.js';
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
var kepler = new keplerEngine();
|
||
|
|
|
||
|
|
kepler.bar = new ldBar(".preloader");
|
||
|
|
|
||
|
|
kepler.initialize = function() {
|
||
|
|
|
||
|
|
this.resources.addTexture("media/textures/white.png", 'white');
|
||
|
|
this.resources.addTexture("media/textures/rotrandom.png", 'random');
|
||
|
|
this.resources.addTexture("media/textures/0_floorTiles_diff.png", 'floorTiles_diff');
|
||
|
|
this.resources.addTexture("media/textures/0_floorTiles_ddn.png", 'floorTiles_normal');
|
||
|
|
|
||
|
|
this.resources.addTexture("media/textures/cubemaps-1024/positive_x.png", 'positive_x');
|
||
|
|
this.resources.addTexture("media/textures/cubemaps-1024/positive_y.png", 'positive_y');
|
||
|
|
this.resources.addTexture("media/textures/cubemaps-1024/positive_z.png", 'positive_z');
|
||
|
|
|
||
|
|
this.resources.addTexture("media/textures/cubemaps-1024/negative_x.png", 'negative_x');
|
||
|
|
this.resources.addTexture("media/textures/cubemaps-1024/negative_y.png", 'negative_y');
|
||
|
|
this.resources.addTexture("media/textures/cubemaps-1024/negative_z.png", 'negative_z');
|
||
|
|
|
||
|
|
//this.assimpLoader.load("room.json");
|
||
|
|
//this.assimpLoader.load("laren2.json");
|
||
|
|
}
|
||
|
|
|
||
|
|
kepler.callback = function() {
|
||
|
|
|
||
|
|
var engine = this;
|
||
|
|
|
||
|
|
var light = new entity( engine );
|
||
|
|
light.type = "PointLight";
|
||
|
|
light.name = "PhotometricLight003";
|
||
|
|
light.transform.local = matrix4.identity();
|
||
|
|
light.transform.world = matrix4.setTranslation( light.transform.local, [100.0702958800057496, 120.042, 4100] );
|
||
|
|
light.mesh = false;
|
||
|
|
light.attenuation = 1.5;
|
||
|
|
light.SourceRadius = 0;
|
||
|
|
light.SourceLength = 0;
|
||
|
|
|
||
|
|
engine.system.scene.rootEntity.addChild(light);
|
||
|
|
engine.system.scene.addEntity( light );
|
||
|
|
console.log(engine);
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
var currentMaterial = new material(engine);
|
||
|
|
|
||
|
|
var normalTexture = engine.resources.getTexture("floorTiles_normal");
|
||
|
|
var normalSampler = new sampler2D(engine);
|
||
|
|
normalSampler.addTexture(normalTexture);
|
||
|
|
currentMaterial.addNormal(normalSampler);
|
||
|
|
|
||
|
|
var diffuseTexture = engine.resources.getTexture("floorTiles_diff");
|
||
|
|
var diffuseSampler = new sampler2D(engine);
|
||
|
|
diffuseSampler.addTexture(diffuseTexture);
|
||
|
|
|
||
|
|
currentMaterial.addTexture( diffuseSampler );
|
||
|
|
currentMaterial.roughness = .0;
|
||
|
|
currentMaterial.shadingModelID = 256;
|
||
|
|
|
||
|
|
//material.diffuseColor = [88,175,255];
|
||
|
|
currentMaterial.alpha = 1;
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
var currentMesh = engine.primitives.createCube(10);
|
||
|
|
//var mesh = this.primitives.createSphere(2.6, 200, 200)
|
||
|
|
|
||
|
|
currentMesh.addMaterial(currentMaterial);
|
||
|
|
|
||
|
|
|
||
|
|
var box = new entity( engine );
|
||
|
|
box.addMesh(currentMesh);
|
||
|
|
box.name = "new box";
|
||
|
|
box.alpha = 0;
|
||
|
|
box.transform.position = [0, -10, 0];
|
||
|
|
box.transform.update();
|
||
|
|
|
||
|
|
box.mesh.boundingBox.fitBoxToPoints_(box.mesh.vertexPositionBuffer.data, box.transform.world);
|
||
|
|
|
||
|
|
|
||
|
|
engine.system.scene.addEntity( box );
|
||
|
|
|
||
|
|
engine.system.scene.rootEntity.addChild(box);
|
||
|
|
|
||
|
|
|
||
|
|
var skyMaterial = new material(engine);
|
||
|
|
|
||
|
|
|
||
|
|
var diffuseTexture = engine.resources.getTexture("white");
|
||
|
|
var diffuseSampler = new sampler2D( engine );
|
||
|
|
diffuseSampler.addTexture(diffuseTexture);
|
||
|
|
|
||
|
|
skyMaterial.addTexture(diffuseSampler);
|
||
|
|
skyMaterial.roughness = .0;
|
||
|
|
skyMaterial.shadingModelID = 100.0;
|
||
|
|
|
||
|
|
skyMaterial.diffuseColor = [88,175,255];
|
||
|
|
skyMaterial.alpha = 1;
|
||
|
|
skyMaterial.create();
|
||
|
|
|
||
|
|
|
||
|
|
var sphere = engine.primitives.createSphere(712.6, 200, 200)
|
||
|
|
|
||
|
|
sphere.addMaterial(skyMaterial);
|
||
|
|
|
||
|
|
var sky = new entity( engine );
|
||
|
|
sky.addMesh(sphere);
|
||
|
|
sky.name = "sky sphere";
|
||
|
|
|
||
|
|
sky.transform.position = [0, 20, 0];
|
||
|
|
sky.transform.update();
|
||
|
|
|
||
|
|
|
||
|
|
//engine.system.scene.addEntity( sky );
|
||
|
|
|
||
|
|
//engine.system.scene.rootEntity.addChild( sky );
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
kepler.application();
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<body style="margin: 0;">
|
||
|
|
<div class="preloader_holder">
|
||
|
|
<div class="preloader"
|
||
|
|
data-preset="fan"
|
||
|
|
class="ldBar label-center"
|
||
|
|
style="width:100%;height:100%;margin:auto"
|
||
|
|
>
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div class="preloader_text">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<img src="media/textures/logo.png" style="position: absolute;left:0; top:10px;" >
|
||
|
|
<canvas id="keplerEngine" style="width: 100%; height: 100%;"></canvas>
|
||
|
|
</body>
|
||
|
|
</html>
|