blob: f7fd4107b92770ece9cf2530e9dfd8c80635a8de (
plain)
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
|
import { System } from '@serpentity/serpentity';
import { Graphics } from 'pixi.js';
import Config from '../config';
import PointsNode from '../nodes/points';
const internals = {
kNoPixiError: 'No pixi application passed to render system. Make sure you set the `application` key in the config object when initializing.',
redBar: new Graphics(),
blueBar: new Graphics()
};
/**
* Renders points assuming there exist a "red" and a "blue" score
*
* @extends {external:Serpentity.System}
* @class RenderPointsSystem
* @param {object} config a configuration object to extend.
*/
export default class RenderPointsSystem extends System {
constructor(config = {}) {
super();
/**
* The node collection of points keepers
*
* @property {external:Serpentity.NodeCollection} pointsKeepers
* @instance
* @memberof RenderPointsSystem
*/
this.pointsKeepers = null;
/**
* The pixi engine we will use to render
*
* @property {external:PixiJs.Application} application
* @instance
* @memberof RenderPointsSystem
*/
this.application = config.application;
if (!this.application) {
throw new Error(internals.kNoPixiError);
}
}
/**
* Initializes system when added. Requests renderable nodes and
* attaches to event listeners to add / remove them to pixi stage
*
* @function added
* @memberof RenderPointsSystem
* @instance
* @param {external:Serpentity.Engine} engine the serpentity engine to
* which we are getting added
*/
added(engine) {
this.pointsKeepers = engine.getNodes(PointsNode);
this.application.stage.addChild(internals.blueBar);
this.application.stage.addChild(internals.redBar);
}
/**
* Clears system resources when removed.
*
* @function removed
* @instance
* @memberof RenderPointsSystem
*/
removed() {
this.pointsKeepers = null;
this.application.stage.removeChild(internals.blueBar);
this.application.stage.removeChild(internals.redBar);
}
/**
* Runs on every update of the loop. Updates the bars
*
* @function update
* @instance
* @param {Number} currentFrameDuration the duration of the current
* frame
* @memberof RenderPointsSystem
*/
update(currentFrameDuration) {
for (const pointsKeeper of this.pointsKeepers) {
const redPoints = pointsKeeper.points.red;
const bluePoints = pointsKeeper.points.blue;
const redBarHeight = redPoints * Config.verticalResolution / Config.maxPoints;
const blueBarHeight = bluePoints * Config.verticalResolution / Config.maxPoints;
internals.redBar.removeChildren();
const redBar = new Graphics();
redBar.lineStyle(20, 0xeaacac, 0.75)
.moveTo(Config.horizontalResolution, 0)
.lineTo(Config.horizontalResolution, redBarHeight);
internals.redBar.addChild(redBar);
internals.blueBar.removeChildren();
const blueBar = new Graphics();
blueBar.lineStyle(20, 0x87c5ea, 0.75)
.moveTo(0, 0)
.lineTo(0, blueBarHeight);
internals.blueBar.addChild(blueBar);
}
}
};
|
