| | |
| | | let app = null; |
| | | let mapContainer = null; |
| | | let notify = null; |
| | | let effectTick, effectHalfCircle, effectRectangle; |
| | | let selectedSprite, effectTick, effectHalfCircle, effectRectangle; |
| | | |
| | | export function syncApp(param) { |
| | | app = param; |
| | |
| | | export const SENSOR_ZINDEX = Object.freeze({ |
| | | SHELF: 1, |
| | | POINT: 1, |
| | | TRAVEL_PATH: 80, |
| | | SHUTTLE: 100, |
| | | AGV: 100, |
| | | }) |
| | |
| | | mapContainer.addChild(effectRectangle); |
| | | mapContainer.addChild(effectHalfCircle); |
| | | |
| | | selectedSprite = sprite; |
| | | |
| | | let phase = 0; |
| | | effectTick = (delta) => { |
| | | phase += delta / 10; |
| | |
| | | }; |
| | | |
| | | app.ticker.add(effectTick); |
| | | } |
| | | |
| | | export const updateEffect = (sprite) => { |
| | | if (!sprite || sprite !== selectedSprite || !effectRectangle || !effectHalfCircle) { |
| | | return |
| | | } |
| | | const { width, height } = sprite; |
| | | const scale = sprite.scale.x; |
| | | const sideLen = (Math.max(width, height) + 10) * scale; |
| | | const scaledWidth = sideLen * (1 / scale); |
| | | const scaledHeight = sideLen * (1 / scale); |
| | | |
| | | effectRectangle.position.set(sprite.x - scaledWidth / 2, sprite.y - scaledHeight / 2); |
| | | |
| | | effectHalfCircle.position.set(sprite.x, sprite.y); |
| | | } |
| | | |
| | | export const removeSelectedEffect = () => { |
| | |
| | | mapContainer.removeChild(effectRectangle); |
| | | effectRectangle = null; |
| | | } |
| | | selectedSprite = null; |
| | | } |
| | | |
| | | export const copySprite = (sprite) => { |
| | |
| | | await Http.doPostPromise('api/map/list', { floor: curFloor }, (res) => { |
| | | const mapItemList = eval(res.data); |
| | | mapItemList.forEach(item => { |
| | | const sprite = generateSprite(item.type); |
| | | if (sprite) { |
| | | initSprite(sprite, item.type); |
| | | // data |
| | | sprite.data.uuid = item.uuid; |
| | | sprite.data.no = item.no; |
| | | if (!( |
| | | item.type === SENSOR_TYPE.SHUTTLE |
| | | || item.type === SENSOR_TYPE.AGV |
| | | )) { |
| | | const sprite = generateSprite(item.type); |
| | | if (sprite) { |
| | | initSprite(sprite, item.type); |
| | | // data |
| | | sprite.data.uuid = item.uuid; |
| | | sprite.data.no = item.no; |
| | | |
| | | // dynamical data |
| | | Object.assign(sprite.data, item.property); |
| | | // dynamical data |
| | | Object.assign(sprite.data, item.property); |
| | | |
| | | showSheflType(sprite); |
| | | // graph |
| | | sprite.position.set(item.positionX, item.positionY); |
| | | sprite.scale.set(item.scaleX, item.scaleY); |
| | | sprite.rotation = rotationParseNum(item.rotation); |
| | | showSheflType(sprite); |
| | | // graph |
| | | sprite.position.set(item.positionX, item.positionY); |
| | | sprite.scale.set(item.scaleX, item.scaleY); |
| | | sprite.rotation = rotationParseNum(item.rotation); |
| | | |
| | | mapContainer.addChild(sprite); |
| | | mapContainer.addChild(sprite); |
| | | } |
| | | } |
| | | }) |
| | | |
| | |
| | | mapContainer?.children.forEach(child => { |
| | | if (child.data?.uuid) { |
| | | const { type, uuid, no, ...property } = child.data; |
| | | mapItemList.push({ |
| | | // data |
| | | type: type, |
| | | uuid: uuid, |
| | | no: no, |
| | | property: property, |
| | | if (!( |
| | | type === SENSOR_TYPE.SHUTTLE |
| | | || type === SENSOR_TYPE.AGV |
| | | )) { |
| | | mapItemList.push({ |
| | | // data |
| | | type: type, |
| | | uuid: uuid, |
| | | no: no, |
| | | property: property, |
| | | |
| | | // graph |
| | | positionX: child.position.x, |
| | | positionY: child.position.y, |
| | | scaleX: child.scale.x, |
| | | scaleY: child.scale.y, |
| | | rotation: rotationToNum(child.rotation) |
| | | }) |
| | | // graph |
| | | positionX: child.position.x, |
| | | positionY: child.position.y, |
| | | scaleX: child.scale.x, |
| | | scaleY: child.scale.y, |
| | | rotation: rotationToNum(child.rotation) |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | |
| | |
| | | return row + '-' + bay + '-' + lev; |
| | | } |
| | | |
| | | export const updateMapStatusInRealTime = (data) => { |
| | | export const updateMapStatusInRealTime = (data, curFloorGetter, setCurSPrite) => { |
| | | const curFloor = curFloorGetter(); |
| | | if (isNullOfUndefined(curFloor)) { return; } |
| | | const mapVo = JSON.parse(data); |
| | | // shuttle |
| | | // shuttleVo |
| | | for (const shuttleVo of mapVo.shuttleVos) { |
| | | const shuttle = querySprite(SENSOR_TYPE.SHUTTLE, shuttleVo.shuttleNo); |
| | | if (!shuttle && !shuttleVo.curLocNo) { continue; } |
| | | const { row, bay, lev } = parseLocNo(shuttleVo.curLocNo); |
| | | const shelf = querySprite(SENSOR_TYPE.SHELF, row + '-' + bay); |
| | | new TWEEDLE.Tween(shuttle.position).easing(TWEEDLE.Easing.Linear.None).to({ |
| | | x: shelf.position.x, |
| | | y: shelf.position.y |
| | | }, 1000).start(); |
| | | // path |
| | | drawTravelPath(shuttleVo, curFloor); |
| | | // shuttle |
| | | showShuttle(shuttleVo, curFloor, setCurSPrite); |
| | | } |
| | | } |
| | | |
| | | export const drawTravelPath = (shuttleVo, curFloor) => { |
| | | const { shuttleNo, curLocNo, travelPath: path } = shuttleVo; |
| | | if (!mapContainer) { |
| | | return; |
| | | } |
| | | const pathLineName = 'preTravelPath-' + shuttleNo; |
| | | let pathLine = mapContainer.getChildByName(pathLineName); |
| | | if (pathLine) { |
| | | mapContainer.removeChild(pathLine); |
| | | } |
| | | |
| | | pathLine = new PIXI.Graphics(); |
| | | pathLine.name = pathLineName; |
| | | pathLine.lineStyle(3 * (1 / mapContainer.scale.x), 0x3498db, 1); |
| | | pathLine.zIndex = SENSOR_ZINDEX.TRAVEL_PATH; |
| | | let firstNode = true; |
| | | for (let i = path.indexOf(curLocNo) - 1; i < path.length; i++) { |
| | | const { row, bay, lev } = parseLocNo(path[i]); |
| | | if (Number(lev) !== curFloor) { continue } |
| | | const shelf = querySprite(SENSOR_TYPE.SHELF, row + '-' + bay); |
| | | |
| | | if (!shelf) { continue }; |
| | | let position = shelf.position; |
| | | let x = position.x; |
| | | let y = position.y; |
| | | if (firstNode) { |
| | | pathLine.moveTo(x, y); |
| | | firstNode = false; |
| | | } else { |
| | | pathLine.lineTo(x, y); |
| | | } |
| | | } |
| | | mapContainer.addChild(pathLine); |
| | | } |
| | | |
| | | export const showShuttle = (shuttleVo, curFloor, setCurSPrite) => { |
| | | const { shuttleNo, curLocNo } = shuttleVo; |
| | | if (!curLocNo) { return } |
| | | const { row, bay, lev } = parseLocNo(curLocNo); |
| | | if (Number(lev) !== curFloor) { return } |
| | | |
| | | const shelf = querySprite(SENSOR_TYPE.SHELF, row + '-' + bay); |
| | | if (!shelf) { return } |
| | | |
| | | let shuttle = querySprite(SENSOR_TYPE.SHUTTLE, shuttleNo); |
| | | if (!shuttle) { |
| | | shuttle = generateSprite(SENSOR_TYPE.SHUTTLE); |
| | | initSprite(shuttle, SENSOR_TYPE.SHUTTLE); |
| | | shuttle.data.no = shuttleNo; |
| | | shuttle.position.set(shelf.position.x, shelf.position.y); |
| | | mapContainer.addChild(shuttle); |
| | | viewFeature(shuttle, setCurSPrite); |
| | | } |
| | | |
| | | new TWEEDLE.Tween(shuttle?.position).easing(TWEEDLE.Easing.Linear.None).to({ |
| | | x: shelf.position.x, |
| | | y: shelf.position.y |
| | | }, 1000).onUpdate(() => { |
| | | updateEffect(shuttle); |
| | | }).start(); |
| | | } |