#

luxiaotao1123

2024-10-09 475fceb864b4c5d7fb9f47720b0918ba7c96e08a

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
import * as PIXI from 'pixi.js';
import * as TWEEDLE from 'tweedle.js';
import {
    DEVICE_TYPE,
    DEVICE_Z_INDEX,
} from './constants';
 
import shelf from '/map/shelf.svg';
import charge from '/map/charge.svg';
import direction from '/map/direction.svg';
 
let app, mapContainer;
 
export function setApp(param) {
    app = param;
}
 
export function setMapContainer(param) {
    mapContainer = param;
}
 
export function getApp() {
    return app;
}
 
export function getMapContainer() {
    return mapContainer;
}
 
export const getRealPosition = (x, y) => {
    const rect = app.view.getBoundingClientRect();
    return {
        mapX: (x - rect.left) / mapContainer.scale.x - mapContainer.x / mapContainer.scale.x,
        mapY: (y - rect.top) / mapContainer.scale.y - mapContainer.y / mapContainer.scale.y
    }
}
 
export const generateSprite = (deviceType) => {
    let sprite;
    switch (deviceType) {
        case DEVICE_TYPE.SHELF:
            sprite = new PIXI.Sprite(PIXI.Texture.from(shelf, { resourceOptions: { scale: 5 } }));
            sprite.width = 50;
            sprite.height = 50;
            sprite.zIndex = DEVICE_Z_INDEX.SHELF;
            break;
        case DEVICE_TYPE.CHARGE:
            sprite = new PIXI.Sprite(PIXI.Texture.from(charge, { resourceOptions: { scale: 1 } }));
            sprite.width = 60;
            sprite.height = 60;
            sprite.zIndex = DEVICE_Z_INDEX.CHARGE;
            break;
        case DEVICE_TYPE.DIRECTION:
            sprite = new PIXI.Sprite(PIXI.Texture.from(direction, { resourceOptions: { scale: 5 } }));
            sprite.width = 112;
            sprite.height = 63;
            sprite.zIndex = DEVICE_Z_INDEX.DIRECTION;
            break;
        default:
            break;
    }
    return sprite;
}
 
export const initSprite = (sprite, type) => {
    sprite.anchor.set(0.5);
    sprite.cursor = 'pointer';
    sprite.eventMode = 'static';
    sprite.data = {
        type: type,
        uuid: generateID()
    };
}
 
export const beMovable = (sprite) => {
    sprite.off('pointerup');
    sprite.off('pointermove');
    sprite.off('pointerdown');
    sprite.off('click');
 
    sprite.on("pointerdown", onDragStart);
 
    let dragTarget;
    function onDragStart(event) {
        if (event.button === 0) {
            dragTarget = event.currentTarget;
            mapContainer.parent.off('pointermove');
            mapContainer.parent.on('pointermove', onDragMove, dragTarget);
 
            mapContainer.parent.off('pointerup');
            mapContainer.parent.on('pointerup', onDragEnd.bind(mapContainer));
        }
    }
 
    function onDragMove(event) {
        if (this) {
            this.parent.toLocal(event.global, null, this.position);
        }
    }
 
    function onDragEnd() {
        if (dragTarget) {
            this.parent.off('pointermove');
            this.parent.off('pointerup');
            dragTarget.alpha = 1;
            dragTarget = null;
        }
    }
 
}
 
export const generateID = () => {
    return Date.now().toString(36) + Math.random().toString(36).substring(2);
}
 
export const patchRaLayout = (param) => {
    const parentElement = document.getElementById('main-content');
    if (parentElement && parentElement.classList.contains('RaLayout-content')) {
        parentElement.style.paddingLeft = param;
        parentElement.style.paddingRight = param;
    }
}