Added teams to visualization

2 files changed, 24 insertions, 2 deletions

diff --git a/derelict.js b/derelict.js
index 0329729..9a28f07 100644
--- a/derelict.js
+++ b/derelict.js
@@ -57,7 +57,8 @@ class Wreck {
 		const object2d = new CSS2DObject(this.domElement)
 
 		this.killmail = killmail
-		this.domElement.className = 'wreck'
+		const team = killmail.team > 1 ? "teamA" : "teamB"
+		this.domElement.classList.add('wreck', team)
 		const shipTypeId = this.killmail.victim.ship_type_id
 		fetch(`${ESI}/universe/types/${shipTypeId}/?datasource=tranquility`, {cache: "force-cache"})
 			.then(response => response.json())
@@ -146,7 +147,9 @@ function init() {
 		.then(response => response.json())
 		.then(killmails => {
 			const url = km => `${ESI}/killmails/${km.id}/${km.hash}/?datasource=tranquility`
-			const retrieve = km => fetch(url(km)).then(response => response.json())
+			const retrieve = km => fetch(url(km))
+				.then(response => response.json())
+				.then(data => { data.team = km.team; return data })
 			return Promise.all(killmails.map(retrieve))
 		})
 		.then(killmails => {
diff --git a/style.css b/style.css
index 2440d71..cd62930 100644
--- a/style.css
+++ b/style.css
@@ -23,6 +23,25 @@ body {
 	border: 2px solid #eee;
 }
 
+.wreck::before {
+	display: block;
+	content: '';
+	position: absolute;
+	bottom: 0px;
+	right: 0px;
+	width: 6px;
+	height: 6px;
+	overflow: hidden;
+}
+
+.wreck.teamA::before {
+	background: #cc0899;
+}
+
+.wreck.teamB::before {
+	background: #14ea6a;
+}
+
 .wreck::after {
 	display: block;
 	content: attr(data-label);