rt-sim-training-client/src/jmap/map.js

160 lines
3.1 KiB
JavaScript
Raw Normal View History

2019-07-03 14:29:09 +08:00
import Painter from './painter';
import ProxyHandle from './proxyHandle';
2019-07-03 18:41:00 +08:00
import deviceState from './config/deviceState';
2019-07-04 09:20:51 +08:00
import deviceStyle from './config/deviceStyle';
2019-07-04 18:39:30 +08:00
import deviceType from './config/deviceType';
import { parser, deviceFactory } from './utils/parser';
2019-07-03 14:29:09 +08:00
class Jmap {
2019-07-04 10:59:40 +08:00
constructor(opts) {
// 挂载的dom节点
this.$dom = opts.dom;
2019-07-03 14:29:09 +08:00
2019-07-04 10:59:40 +08:00
// 原始数据
this.data = {};
2019-07-03 14:29:09 +08:00
2019-07-04 10:59:40 +08:00
// 默认初始状态
this.defaultStateDict = this.loaddefaultState();
2019-07-03 14:29:09 +08:00
2019-07-04 10:59:40 +08:00
// 皮肤参数
this.skinStyle = '';
2019-07-03 14:29:09 +08:00
2019-07-04 10:59:40 +08:00
// 皮肤风格
this.styleDict = {};
2019-07-03 14:29:09 +08:00
2019-07-04 10:59:40 +08:00
// 设备数据
this.mapDevice = {};
2019-07-03 14:29:09 +08:00
2019-07-04 10:59:40 +08:00
// 设备代理数据
this.proxyData = {};
2019-07-03 14:29:09 +08:00
2019-07-04 10:59:40 +08:00
// 绘图模块
this.$painter = new Painter(this, opts);
}
2019-07-03 14:29:09 +08:00
2019-07-04 10:59:40 +08:00
/**
2019-07-03 18:41:00 +08:00
* 加载数据
2019-07-04 10:59:40 +08:00
* @param {*} data
2019-07-03 18:41:00 +08:00
*/
2019-07-04 10:59:40 +08:00
loadData(skinStyle, data) {
// 保存原始数据
this.data = data;
// 加载皮肤
this.styleDict = this.loadStyle(skinStyle);
2019-07-04 10:59:40 +08:00
// 解析地图数据
this.mapDevice = parser(data, this.defaultStateDict);
// 生成代理对象
2019-07-04 18:39:30 +08:00
this.proxyData = new Proxy(this.mapDevice, new ProxyHandle(this));
2019-07-04 10:59:40 +08:00
// 初次渲染视图
2019-07-04 18:39:30 +08:00
this.$painter.repaint(this.mapDevice, this.styleDict);
}
loadStyle(skinStyle) {
return deviceStyle;
2019-07-04 10:59:40 +08:00
}
loaddefaultState() {
const defaultStateDict = {};
Object.keys(deviceState).forEach(type => {
defaultStateDict[type] = {};
Object.keys(deviceState[type] || {}).forEach(state => {
defaultStateDict[type][state] = deviceState[type][state].Default;
});
});
return defaultStateDict;
}
2019-07-04 18:39:30 +08:00
syncData(model) {
let code = model.code;
let type = model.type;
2019-07-05 00:40:53 +08:00
let dispose = model._dispose;
2019-07-04 18:39:30 +08:00
let prop = null;
switch (type) {
case deviceType.Link: prop = 'linkList'; break;
}
let list = this.data[prop];
if (list) {
let idex = list.findIndex(elem => { return elem.code == code });
if (idex >= 0) {
2019-07-05 00:40:53 +08:00
dispose && list.splice(idex, 1);
2019-07-04 18:39:30 +08:00
} else {
list.push(model);
}
}
}
render(list) {
(list || []).forEach(elem => {
let type = elem.type;
let code = elem.code;
let device = this.proxyData[code] || deviceFactory(type, this.styleDict[type], elem);
let model = Object.assign(device.model || {}, elem);
delete this.proxyData[code];
if (!elem._dispose) {
device = this.proxyData[code] = Object.assign(device, { model });
}
this.syncData(model);
})
}
update(list) {
(list || []).forEach(elem => {
let code = elem.code;
if (elem._dispose) {
delete this.proxyData[code];
} else {
let device = this.proxyData[code] || {};
let state = Object.assign(device.state || {}, elem);
this.proxyData[code] = Object.assign(device, { state });
}
})
}
2019-07-04 10:59:40 +08:00
getPainter() {
return this.$painter;
}
2019-07-04 18:39:30 +08:00
getSkinStyle() {
return this.skinStyle;
}
getStyleDict() {
return this.styleDict;
}
getDefaultStateDict() {
return this.defaultStateDict;
}
getMapDevice() {
return this.mapDevice;
}
refresh() {
this.$painter.refresh();
}
2019-07-04 10:59:40 +08:00
clear() {
this.$painter.clear();
}
dispose() {
this.skinStyle = '';
this.styleDict = {};
this.mapDevice = {};
this.proxyData = {};
this.$painter.dispose();
}
2019-07-03 14:29:09 +08:00
}
2019-07-04 10:59:40 +08:00
export default Jmap;