make PSN prettier

This commit is contained in:
sparks-alec
2023-10-01 01:10:14 -04:00
parent c969bb6b50
commit c8720f291e
4 changed files with 78 additions and 41 deletions
Binary file not shown.
Binary file not shown.

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 3.6 KiB

+38 -3
View File
@@ -1,11 +1,46 @@
section {
background-color: #2d2d2d;
border: gray 1px solid;
padding: 10px;
padding-top: 0px;
border-radius: 10px;
overflow: hidden;
}
table {
border: #414142 1px solid;
background-color: #272727;
}
table,
th,
td {
border: 1px solid darkgray;
border-collapse: collapse;
color: gainsboro;
}
color: #ccc;
font-size: 13px;
}
th {
padding: 2px 10px;
}
td {
text-align: center;
padding: 2px 7px;
font-family: 'Courier New', Courier, monospace;
}
.bg-pos {
background-color: #443727;
}
.bg-speed {
background-color: #32422e;
}
.bg-ori {
background-color: #2e4242;
}
.bg-accel {
background-color: #392b3f;
}
.bg-trgtpos {
background-color: #3a2732;
}
.border-right {
border-right: 1px solid #272727;
}
+40 -38
View File
@@ -7,6 +7,7 @@
<% Object.keys(data).forEach((address) => {
const instanceData = data[address]
%>
<section>
<h2>Server: <%= instanceData.system_name %> (<%= address %>)</h2>
<h3>Tracker Count: <%= Object.keys(instanceData.trackers).length %></h3>
@@ -18,27 +19,27 @@
<% } %>
<% if(instanceData.fields.has('pos')) { %>
<th colspan="3">POS</th>
<th colspan="3" class="bg-pos border-right">POS</th>
<% } %>
<% if(instanceData.fields.has('speed')) { %>
<th colspan="3">SPEED</th>
<th colspan="3" class="bg-speed border-right">SPEED</th>
<% } %>
<% if(instanceData.fields.has('ori')) { %>
<th colspan="3">ORI</th>
<th colspan="3" class="bg-ori border-right">ORI</th>
<% } %>
<% if(instanceData.fields.has('status')) { %>
<th></th>
<th class="border-right"></th>
<% } %>
<% if(instanceData.fields.has('accel')) { %>
<th colspan="3">ACCEL</th>
<th colspan="3" class="bg-accel border-right">ACCEL</th>
<% } %>
<% if(instanceData.fields.has('trgtpos')) { %>
<th colspan="3">TRGTPOS</th>
<th colspan="3" class="bg-trgtpos border-right">TRGTPOS</th>
<% } %>
<% if(instanceData.fields.has('timestamp')) { %>
@@ -52,37 +53,37 @@
<% } %>
<% if(instanceData.fields.has('pos')) { %>
<th>x</th>
<th>y</th>
<th>z</th>
<th class="bg-pos">x</th>
<th class="bg-pos">y</th>
<th class="bg-pos border-right">z</th>
<% } %>
<% if(instanceData.fields.has('speed')) { %>
<th>x</th>
<th>y</th>
<th>z</th>
<th class="bg-speed">x</th>
<th class="bg-speed">y</th>
<th class="bg-speed border-right">z</th>
<% } %>
<% if(instanceData.fields.has('ori')) { %>
<th>x</th>
<th>y</th>
<th>z</th>
<th class="bg-ori">x</th>
<th class="bg-ori">y</th>
<th class="bg-ori border-right">z</th>
<% } %>
<% if(instanceData.fields.has('status')) { %>
<th>validity</th>
<th class="border-right">validity</th>
<% } %>
<% if(instanceData.fields.has('accel')) { %>
<th>x</th>
<th>y</th>
<th>z</th>
<th class="bg-accel">x</th>
<th class="bg-accel">y</th>
<th class="bg-accel border-right">z</th>
<% } %>
<% if(instanceData.fields.has('trgtpos')) { %>
<th>x</th>
<th>y</th>
<th>z</th>
<th class="bg-trgtpos">x</th>
<th class="bg-trgtpos">y</th>
<th class="bg-trgtpos border-right">z</th>
<% } %>
<% if(instanceData.fields.has('timestamp')) { %>
@@ -101,41 +102,41 @@
<% if(instanceData.fields.has('pos')) { %>
<!-- pos -->
<td><%= trackerData.pos?.pos_x?.toFixed(2) %></td>
<td><%= trackerData.pos?.pos_y?.toFixed(2) %></td>
<td><%= trackerData.pos?.pos_z?.toFixed(2) %></td>
<td class="bg-pos"><%= trackerData.pos?.pos_x?.toFixed(2) %></td>
<td class="bg-pos"><%= trackerData.pos?.pos_y?.toFixed(2) %></td>
<td class="bg-pos border-right"><%= trackerData.pos?.pos_z?.toFixed(2) %></td>
<% } %>
<% if(instanceData.fields.has('speed')) { %>
<!-- speed -->
<td><%= trackerData.speed?.speed_x?.toFixed(2) %></td>
<td><%= trackerData.speed?.speed_y?.toFixed(2) %></td>
<td><%= trackerData.speed?.speed_z?.toFixed(2) %></td>
<td class="bg-speed"><%= trackerData.speed?.speed_x?.toFixed(2) %></td>
<td class="bg-speed"><%= trackerData.speed?.speed_y?.toFixed(2) %></td>
<td class="bg-speed border-right"><%= trackerData.speed?.speed_z?.toFixed(2) %></td>
<% } %>
<% if(instanceData.fields.has('ori')) { %>
<!-- ori -->
<td><%= trackerData.ori?.ori_x?.toFixed(2) %></td>
<td><%= trackerData.ori?.ori_y?.toFixed(2) %></td>
<td><%= trackerData.ori?.ori_z?.toFixed(2) %></td>
<td class="bg-ori"><%= trackerData.ori?.ori_x?.toFixed(2) %></td>
<td class="bg-ori"><%= trackerData.ori?.ori_y?.toFixed(2) %></td>
<td class="bg-ori border-right"><%= trackerData.ori?.ori_z?.toFixed(2) %></td>
<% } %>
<% if(instanceData.fields.has('status')) { %>
<td><%= trackerData.status?.validity?.toFixed(2) %></td>
<td class="border-right"><%= trackerData.status?.validity?.toFixed(2) %></td>
<% } %>
<% if(instanceData.fields.has('accel')) { %>
<!-- accel -->
<td><%= trackerData.accel?.accel_x?.toFixed(2) %></td>
<td><%= trackerData.accel?.accel_y?.toFixed(2) %></td>
<td><%= trackerData.accel?.accel_z?.toFixed(2) %></td>
<td class="bg-accel"><%= trackerData.accel?.accel_x?.toFixed(2) %></td>
<td class="bg-accel"><%= trackerData.accel?.accel_y?.toFixed(2) %></td>
<td class="bg-accel border-right"><%= trackerData.accel?.accel_z?.toFixed(2) %></td>
<% } %>
<% if(instanceData.fields.has('trgtpos')) { %>
<!-- trgtpos -->
<td><%= trackerData.trgtpos?.trgtpos_x?.toFixed(2) %></td>
<td><%= trackerData.trgtpos?.trgtpos_y?.toFixed(2) %></td>
<td><%= trackerData.trgtpos?.trgtpos_z?.toFixed(2) %></td>
<td class="bg-trgtpos"><%= trackerData.trgtpos?.trgtpos_x?.toFixed(2) %></td>
<td class="bg-trgtpos"><%= trackerData.trgtpos?.trgtpos_y?.toFixed(2) %></td>
<td class="bg-trgtpos border-right"><%= trackerData.trgtpos?.trgtpos_z?.toFixed(2) %></td>
<% } %>
<% if(instanceData.fields.has('timestamp')) { %>
@@ -146,6 +147,7 @@
<% }); %>
</table>
</section>
<%
});
%>