document.title = 'Demo-机房管理';
/**
* 机房demo
* @author larrow 2018.05.01
*/
var app = new THING.App({
url: 'models/comproom/'
});
app.on('load', function() {
// 摄影机飞行到合适位置
app.camera.flyTo({
time: 1000,
position: [-15.8, 14.3, 17.9],
target: [0.3, -2.0, 1.5]
});
// 初始化机柜等物体
init_cabinets();
// 初始化界面
init_ui();
});
// ------------------------------------------------------------------------------
// 机柜相关
const CABINET_DEFAULT_UNITCOUNT = 42; // 默认机柜u数
const RACK_UNIT_HEIGHT = 0.0445; // 1u为4.3厘米
const BarGraphColors = ['#0000ff', '#00ffff', '#00ff00', '#ff0000', '#ff00ff', '#ffff00'];
/**
* Cabinet 机柜类
*/
class Cabinet extends THING.Thing {
constructor(app) {
super(app);
this.racks = [];
this.isCabinet = true;
this.barGraph = null;
this.ui = null;
this.number = Math.randomInt(100, 300);
}
createRack(url, u) {
var y = u * RACK_UNIT_HEIGHT;
var cabinet = this;
var rack = this.app.create({
type: 'Rack',
name: 'rack',
url: url,
complete: function() {
cabinet.add({
object: this,
basePoint: 'BasePoint',
localPosition: [0, y, 0],
localAngles: [0, 0, 0]
});
}
});
return rack;
}
createRacks() {
var curUPos = 0;
while(true) {
var pair = RackModels[Math.randomInt(0, RackModels.length - 1)];
var url = pair[0];
var uHeight = pair[1];
var rack = this.createRack(url, curUPos);
this.racks.push(rack);
if (curUPos >= CABINET_DEFAULT_UNITCOUNT - 4)
break;
curUPos += uHeight;
}
return rack;
}
destroyRacks() {
for (var i = 0; i < this.racks.length; i ++) {
var rack = this.racks[i];
rack.destroy();
}
this.racks = [];
}
openDoor() {
this.playAnimation('open1');
this.createRacks();
}
closeDoor() {
this.playAnimation({
name: 'close1',
complete: function() {
this.destroyRacks();
if (Rack.current)
Rack.current.showUI(false);
}
});
}
// 创建柱状图
createBarGraph() {
if (this.barGraph)
return;
var box = app.create({
type: 'Box',
width: this.size[0] * 0.9,
height: this.size[1],
depth: this.size[2] * 0.9,
position: this.position,
center: 'Bottom'
});
this.barGraph = box;
}
// 显示柱状图
showBarGraph(bool) {
if (bool) {
// 确认创建了盒子
this.createBarGraph();
// 隐藏机柜，显示盒子
this.visible = false;
this.barGraph.visible = true;
this.barGraph.style.color = Math.randomFromArray(BarGraphColors);
//this.barGraph.style.opacity = 0.9;
// 缩放盒子
this.barGraph.scale = [1, 0.1, 1];
this.barGraph.scaleTo({
scale: [1, Math.randomFloat(0.2, 1.0), 1],
time: 400,
lerpType: THING.LerpType.Linear.Quadratic
});
} else {
// 隐藏盒子，显示机柜
this.visible = true;
if (this.barGraph)
this.barGraph.visible = false;
}
}
// 创建界面
createUI() {
if (this.ui)
return;
var cabinet = this;
// 创建widget (动态绑定数据用)
var panel = new THING.widget.Panel({
width: "230px",
closeIcon: false,
opacity: 0.8,
});
this.panel = panel;
panel.addString(this, 'name').name('机柜'+this.number);
// 创建obj ui (跟随物体用)
var ui = app.create({
type: 'UI',
parent: this,
el: panel.domElement,
offset: [0, cabinet.size[1], 0]
});
this.ui = ui;
}
// 显示界面
showUI(boolValue) {
if (!this.ui)
this.createUI();
this.panel.visible = boolValue;
}
}
THING.factory.registerClass('Cabinet', Cabinet);
Cabinet.current = null;
Cabinet.open = false;
// 架式设备模型
const RackModels = [
['https://model.3dmomoda.cn/models/3817338017ff4776a5dd05f03a3e2fd4/0/gltf', 1],
['https://model.3dmomoda.cn/models/37972dd2c96c4a37a3245a00bee3628b/0/gltf', 2]
];
/**
* Rack 架式设备
*/
class Rack extends THING.Thing {
constructor(app) {
super(app);
this.isRack = true;
this.info = gen_rack_info();
}
createUI() {
var ui = new THING.widget.Panel({
titleText: this.name,
closeIcon: true,
dragable: true,
retractable: true,
hasTitle: true,
width: "228px",
});
ui.zIndex = 999999;//设置ui排序
ui.addTab(this.info);
ui.position = [390, 350];
this.ui = ui;
return ui;
}
showUI(boolValue) {
if (!this.ui)
this
4178
1
