默认不再加载ammo.js。只有场景中存在刚体或柔软体时,才在播放时自动加载ammo.js,提升编辑器启动速度和非物理场景运行速度。

This commit is contained in:
tengge1 2019-04-21 21:02:27 +08:00
parent 619acbef75
commit 4e6d59b663
11 changed files with 128 additions and 55 deletions

1
.gitignore vendored
View File

@ -98,3 +98,4 @@ typings/
/ShadowEditor.UI/bin
/ShadowEditor.UI/obj
/ShadowEditor.UI/ShadowEditor.UI.csproj.user
/ShadowEditor.Web/assets/panel1.png

View File

@ -6,6 +6,10 @@ Language: 中文 / [繁體中文](README-tw.md) / [English](README-en.md) / [日
* 版本v0.2.0(开发中)
* 简介:基于`three.js`的场景编辑器。
## v0.2.0即将更新
1. 默认不再加载`ammo.js`。只有场景中存在刚体或柔软体时,才在播放时自动加载`ammo.js`,提升编辑器启动速度和非物理场景运行速度。
## v0.1.9更新
* 发布日期2019年4月20日

View File

@ -22,7 +22,6 @@
<!-- libs -->
<script src="assets/js/libs/stats.min.js"></script>
<script src="assets/js/libs/ammo.js"></script>
<script src="assets/js/libs/jszip.min.js"></script>
<script src="assets/js/libs/inflate.min.js"></script>
<script src="assets/js/libs/gunzip.min.js"></script>

View File

@ -22,6 +22,10 @@ Viewport.prototype.render = function () {
children: [{
xtype: 'svg',
id: 'SvgContainer',
attr: {
viewBox: '0 0 1920 969', // see: https://segmentfault.com/a/1190000009226427?utm_source=tag-newest
preserveAspectRatio: 'xMinYMin', // xMinYMin, xMinYMid, xMinYMax, xMidYMin, xMidYMid, xMidYMax, xMaxYMin, xMaxYMid, xMaxYMax
},
style: {
position: 'absolute',
left: 0,

View File

@ -5,7 +5,7 @@ import EditMenu from './EditMenu';
import GeometryMenu from './GeometryMenu';
import LightMenu from './LightMenu';
import AssetMenu from './AssetMenu';
import TerrainMenu from './TerrainMenu';
// import TerrainMenu from './TerrainMenu';
import ComponentMenu from './ComponentMenu';
import VisualMenu from './VisualMenu';
import PlayMenu from './PlayMenu';

View File

@ -42,6 +42,9 @@ VisualMenu.prototype.render = function () {
});
container.render();
// TODO: 为了方便开发,需要删除
//this.app.on(`appStarted.${this.id}`, this.addSidebar.bind(this));
};
// ------------------------- 侧边栏 ------------------------------------------

View File

@ -466,6 +466,11 @@ const PackageList = [{
assets: [
'assets/js/VolumetricFire.js'
]
}, {
name: 'ammo',
assets: [
'assets/js/libs/ammo.js'
]
}];
export default PackageList

View File

@ -1,5 +1,5 @@
import UI from '../ui/UI';
import PackageManager from '../package/PackageManager';
import Converter from '../serialization/Converter';
import PlayerLoader from './component/PlayerLoader';
@ -42,6 +42,9 @@ function Player(options = {}) {
this.gis = null;
this.package = new PackageManager();
this.require = this.package.require.bind(this.package);
this.loader = new PlayerLoader(this);
this.event = new PlayerEvent(this);
this.control = new PlayerControl(this);

View File

@ -1,29 +1,29 @@
import PlayerComponent from './PlayerComponent';
import ThrowBallEvent from './physics/ThrowBallEvent';
const shape = {
btBoxShape: Ammo.btBoxShape, // 正方体
btBvhTriangleMeshShape: Ammo.btBvhTriangleMeshShape, // 三角形
btCapsuleShape: Ammo.btCapsuleShape, // 胶囊
btCapsuleShapeX: Ammo.btCapsuleShapeX, // x轴胶囊
btCapsuleShapeZ: Ammo.btCapsuleShapeZ, // z轴胶囊
btCollisionShape: Ammo.btCollisionShape, // 碰撞体
btCompoundShape: Ammo.btCompoundShape, // 复合形状
btConcaveShape: Ammo.btConcaveShape, //
btConeShape: Ammo.btConeShape, // 圆锥体
btConeShapeX: Ammo.btConeShapeX, // x轴圆椎体
btConeShapeZ: Ammo.btConeShapeZ, // z轴圆椎体
btConvexHullShape: Ammo.btConvexHullShape, // 凸包
btConvexShape: Ammo.btConvexShape, //
btConvexTriangleMeshShape: Ammo.btConvexTriangleMeshShape, // 凸三角形
btCylinderShape: Ammo.btCylinderShape, // 圆柱体
btCylinderShapeX: Ammo.btCylinderShapeX, // x轴圆柱体
btCylinderShapeZ: Ammo.btCylinderShapeZ, // z轴圆柱体
btHeightfieldTerrainShape: Ammo.btHeightfieldTerrainShape, // 灰阶高程地形
btSphereShape: Ammo.btSphereShape, // 球体
btStaticPlaneShape: Ammo.btStaticPlaneShape, // 静态平板
btTriangleMeshShape: Ammo.btTriangleMeshShape, // 三角网格
};
// const shape = {
// btBoxShape: Ammo.btBoxShape, // 正方体
// btBvhTriangleMeshShape: Ammo.btBvhTriangleMeshShape, // 三角形
// btCapsuleShape: Ammo.btCapsuleShape, // 胶囊
// btCapsuleShapeX: Ammo.btCapsuleShapeX, // x轴胶囊
// btCapsuleShapeZ: Ammo.btCapsuleShapeZ, // z轴胶囊
// btCollisionShape: Ammo.btCollisionShape, // 碰撞体
// btCompoundShape: Ammo.btCompoundShape, // 复合形状
// btConcaveShape: Ammo.btConcaveShape, //
// btConeShape: Ammo.btConeShape, // 圆锥体
// btConeShapeX: Ammo.btConeShapeX, // x轴圆椎体
// btConeShapeZ: Ammo.btConeShapeZ, // z轴圆椎体
// btConvexHullShape: Ammo.btConvexHullShape, // 凸包
// btConvexShape: Ammo.btConvexShape, //
// btConvexTriangleMeshShape: Ammo.btConvexTriangleMeshShape, // 凸三角形
// btCylinderShape: Ammo.btCylinderShape, // 圆柱体
// btCylinderShapeX: Ammo.btCylinderShapeX, // x轴圆柱体
// btCylinderShapeZ: Ammo.btCylinderShapeZ, // z轴圆柱体
// btHeightfieldTerrainShape: Ammo.btHeightfieldTerrainShape, // 灰阶高程地形
// btSphereShape: Ammo.btSphereShape, // 球体
// btStaticPlaneShape: Ammo.btStaticPlaneShape, // 静态平板
// btTriangleMeshShape: Ammo.btTriangleMeshShape, // 三角网格
// };
/**
* 播放器物理
@ -31,7 +31,43 @@ const shape = {
*/
function PlayerPhysics(app) {
PlayerComponent.call(this, app);
}
PlayerPhysics.prototype = Object.create(PlayerComponent.prototype);
PlayerPhysics.prototype.constructor = PlayerPhysics;
PlayerPhysics.prototype.create = function (scene, camera, renderer) {
var usePhysics = false;
this.scene = scene;
this.scene.traverse(n => {
if (n.userData &&
n.userData.physics &&
n.userData.physics.enabled
) {
usePhysics = true;
}
});
// 未使用物理
if (!usePhysics) {
return new Promise(resolve => {
resolve();
});
}
// 使用物理
return new Promise(resolve => {
this.app.require('ammo').then(() => {
this.initPhysicsWorld();
this.initScene(scene, camera, renderer);
resolve();
});
});
};
PlayerPhysics.prototype.initPhysicsWorld = function () {
// 各种参数
var gravityConstant = -9.8; // 重力常数
this.margin = 0.05; // 两个物体之间最小间距
@ -67,17 +103,12 @@ function PlayerPhysics(app) {
// api函数
// TODO: 很难受的实现
Object.assign(app, {
Object.assign(this.app, {
addPhysicsObject: this.addPhysicsObject.bind(this)
});
}
PlayerPhysics.prototype = Object.create(PlayerComponent.prototype);
PlayerPhysics.prototype.constructor = PlayerPhysics;
PlayerPhysics.prototype.create = function (scene, camera, renderer) {
this.scene = scene;
};
PlayerPhysics.prototype.initScene = function (scene, camera, renderer) {
this.scene.traverse(n => {
if (n.userData &&
n.userData.physics &&
@ -115,13 +146,13 @@ PlayerPhysics.prototype.create = function (scene, camera, renderer) {
this.events.forEach(n => {
n.create(scene, camera, renderer);
});
return new Promise(resolve => {
resolve();
});
};
PlayerPhysics.prototype.update = function (clock, deltaTime) {
if (!this.world) {
return;
}
this.world.stepSimulation(deltaTime, 10);
// 更新柔软体
@ -196,23 +227,27 @@ PlayerPhysics.prototype.update = function (clock, deltaTime) {
};
PlayerPhysics.prototype.dispose = function () {
this.events.forEach(n => {
this.events && this.events.forEach(n => {
n.dispose();
});
this.rigidBodies.forEach(n => {
var body = n.userData.physics.body;
this.world.removeRigidBody(body);
});
if (this.rigidBodies) {
this.rigidBodies.forEach(n => {
var body = n.userData.physics.body;
this.world.removeRigidBody(body);
});
this.rigidBodies.length = 0;
this.rigidBodies.length = 0;
}
this.softBodies.forEach(n => {
var body = n.userData.physics.body;
this.world.removeRigidBody(body);
});
if (this.softBodies) {
this.softBodies.forEach(n => {
var body = n.userData.physics.body;
this.world.removeRigidBody(body);
});
this.softBodies.length = 0;
this.softBodies.length = 0;
}
this.scene.traverse(n => {
if (n.userData && n.userData.physics) {

View File

@ -6,19 +6,39 @@ import Component from './Component';
*/
function Sidebar(options) {
Component.call(this, options);
this.margin = 2;
this.padding = 4;
}
Sidebar.prototype = Object.create(Component.prototype);
Sidebar.prototype.constructor = Sidebar;
Sidebar.prototype.render = function () {
d3.select(this.parent)
.append('rect')
var width = this.parent.clientWidth;
var height = this.parent.clientHeight;
var group = d3.select(this.parent)
.append('g');
// 背景参考图
var image = group.append('image')
.attr('x', 0)
.attr('y', 0)
.attr('width', 100)
.attr('height', 200)
.attr('fill', '#ff0');
.attr('width', 1920)
.attr('height', 969)
.attr('href', 'assets/panel1.png')
.attr('opacity', '0.5');
// 边框
group.append('rect')
.attr('x', 0)
.attr('y', 0)
.attr('width', 240)
.attr('height', height)
.attr('stroke', '#3a6a84')
.attr('stroke-width', 2)
.attr('fill', 'none');
};
export default Sidebar;

View File

@ -34,7 +34,6 @@
<!-- libs -->
<script src="assets/js/libs/stats.min.js"></script>
<script src="assets/js/libs/ammo.js"></script>
<script src="assets/js/libs/jszip.min.js"></script>
<script src="assets/js/libs/inflate.min.js"></script>
<script src="assets/js/libs/gunzip.min.js"></script>