-
Notifications
You must be signed in to change notification settings - Fork 0
/
eventfeed.html
95 lines (84 loc) · 3.46 KB
/
eventfeed.html
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
<html>
<head>
<script src="js/WsSubscribers.js"></script>
<script src="js/jquery-3.5.1.min.js"></script>
<link rel="stylesheet" href="css/eventfeed.css">
</head>
<body>
<div id="eventfeed"></div>
<script>
$(() => {
let eventIconLookup = {
"Win": "icons/stat-icons/win.svg",
"MVP": "icons/stat-icons/mvp.svg",
"Goal": "icons/stat-icons/goal.svg",
"Aerial Goal": "icons/stat-icons/aerial-goal.svg",
"Backwards Goal": "icons/stat-icons/backwards-goal.svg",
"Bicycle Goal": "icons/stat-icons/bicycle-hit.svg",
"Long Goal": "icons/stat-icons/long-goal.svg",
"Overtime Goal": "icons/stat-icons/overtime-goal.svg",
"Hat Trick": "icons/stat-icons/hat-trick.svg",
"Turtle Goal": "icons/stat-icons/turtle-goal.svg",
"Assist": "icons/stat-icons/assist.svg",
"Playmaker": "icons/stat-icons/playmaker.svg",
"Save": "icons/stat-icons/save.svg",
"Epic Save": "icons/stat-icons/epic-save.svg",
"Savior": "icons/stat-icons/savior.svg",
"Shot on Goal": "icons/stat-icons/shot-on-goal.svg",
"Center Ball": "icons/stat-icons/center-ball.svg",
"Clear Ball": "icons/stat-icons/clear-ball.svg",
"Aerial Hit": "icons/stat-icons/aerial-hit.svg",
"Bicycle Hit": "icons/stat-icons/bicycle-hit.svg",
"Juggle": "icons/stat-icons/juggle.svg",
"Demolition": "icons/stat-icons/demolition.svg",
"Extermination": "icons/stat-icons/extermination.svg",
"First Touch": "icons/stat-icons/first-touch.svg",
"Pool Shot": "icons/stat-icons/pool-shot.svg",
"Low Five": "icons/stat-icons/low-five.svg",
"High Five": "icons/stat-icons/high-five.svg",
"Damage": "icons/stat-icons/damage.svg",
"Ultra Damage": "icons/stat-icons/ultra-damage.svg",
"Swish Goal": "icons/stat-icons/swish-goal.svg"
};
let eventId = 0;
let players = {};
WsSubscribers.init(49322, false);
WsSubscribers.subscribe("game", "statfeed_event", (d) => {
let leftTeamColor = players[d['main_target']['id']]['team'] === 0 ? "blue" : "orange";
let rightTeamColor = d['secondary_target']['id'] !== "" ? (players[d['secondary_target']['id']]['team'] === 0 ? "blue" : "orange") : "";
let homeHtml = `
<div class="left ${leftTeamColor}">
${d['main_target']['name']}
</div>
`;
let eventIconHtml = `
<div class="icon">
<img src=${eventIconLookup[d["type"]] || ""}></img>
</div>
`;
let awayHtml = `
${d['secondary_target']['id'] !== "" ?
`<div class='right ${rightTeamColor}'>
${d['secondary_target']['name']}
</div>`
: ""}
`;
let eventIdName = "event-" + eventId;
let eventHtml = `
<div class="event" id="${eventIdName}">
${homeHtml + eventIconHtml + awayHtml}
</div>
`;
$("#eventfeed").append(eventHtml)
setTimeout(function() {
$(`#${eventIdName}`).remove();
}, 4000)
eventId++;
})
WsSubscribers.subscribe("game", "update_state", (d) => {
players = d['players'];
})
});
</script>
</body>
</html>