From 93033f5da10ae7c34074a5c9591502739b42300e Mon Sep 17 00:00:00 2001 From: Sven Steudte Date: Tue, 26 Jun 2018 22:53:01 +0200 Subject: [PATCH] Implemented new website design --- decoder/html/Database.class.php | 1 - decoder/html/Tracker.class.php | 9 +- decoder/html/arrow_up.png | Bin 0 -> 206 bytes decoder/html/gnss.png | Bin 0 -> 1403 bytes decoder/html/power.png | Bin 0 -> 919 bytes decoder/html/sidebar.inc.php | 25 +- decoder/html/style.css | 52 ++- decoder/html/telemetry.php | 481 ++++++++++---------- decoder/html/telemetry2.php | 756 ++++++++++++++++++++++++++++++++ 9 files changed, 1082 insertions(+), 242 deletions(-) create mode 100644 decoder/html/arrow_up.png create mode 100644 decoder/html/gnss.png create mode 100644 decoder/html/power.png create mode 100644 decoder/html/telemetry2.php diff --git a/decoder/html/Database.class.php b/decoder/html/Database.class.php index c427cf89..718f527e 100644 --- a/decoder/html/Database.class.php +++ b/decoder/html/Database.class.php @@ -38,7 +38,6 @@ class Database extends mysqli { SELECT `call`,`rxtime` FROM `image` ) AS d GROUP BY `call` - ORDER BY `rxtime` DESC "); while($row = $query->fetch_assoc()) $tracker[] = new Tracker($row['call']); diff --git a/decoder/html/Tracker.class.php b/decoder/html/Tracker.class.php index 37ca18ea..47d8c750 100644 --- a/decoder/html/Tracker.class.php +++ b/decoder/html/Tracker.class.php @@ -6,12 +6,16 @@ require_once "Image.class.php"; class Tracker { private $call; + private $lastActivity; function __construct($call) { $this->call = $call; } function getLastActivity() { + if(!is_null($this->lastActivity)) // Read from cache + return $this->lastActivity; + $act = array(); $query = Database::getInstance()->query(" @@ -29,7 +33,10 @@ class Tracker { while($row = $query->fetch_assoc()) $act[$row['type']] = $row['lasttime']; - return $act; + $act['pkt'] = min($act); + + $this->lastActivity = $act; + return $this->lastActivity; } function getPictures($from, $to=NULL) { if(is_null($to)) diff --git a/decoder/html/arrow_up.png b/decoder/html/arrow_up.png new file mode 100644 index 0000000000000000000000000000000000000000..67693b884cfffed4db8dc0e165e9dfb0a24998fe GIT binary patch literal 206 zcmeAS@N?(olHy`uVBq!ia0vp^{2{XE z)7O>#5t|g3zGhWx`BI>eY-UJAiF1B#Zfaf$kjuc}T$GwvlA5AWo>`Ki;O^-gkfN8$ z4itCsba4#PIG_CI|9^YtoeiAxRg#q-*Kaa8Z1Tvsp|g?cfJ;wt;Z48T*@ZWoeCH_5 tmMlDKyvg_f>;J}=)VH+nOmp)p5@k@R6kizH!T%Rzk*BMl%Q~loCIE9QKIH%a literal 0 HcmV?d00001 diff --git a/decoder/html/gnss.png b/decoder/html/gnss.png new file mode 100644 index 0000000000000000000000000000000000000000..62c4248004e1130bca52d676128b350d26142330 GIT binary patch literal 1403 zcmV->1%&#EP)z;G@|KM=WH{W46XPveGd+oK?*&hfYgb+fAI?^cE^)$#Z=I$f-a-a7l}Eb^+(6 zF<=fF*eF61o&sz(;~g?@n*mG)x_~>)c(o&HFZ>8_Aut474{Qp2_dBo}cn5e)Dt9#P zz@MfkZ+M6UOQnHPJn(8@svY+!4vepXa|7P7O${=>0f$4AKY&4*EIu2}`*wtU_f&}H zJS+_ij}@Cfo>mn#@Gsk+5c1uFX5a?!votWA-L^m70%{SHTLOAAuf=(LrGepm3>*NC z2j&A`NCV?F;RC?ScDxjrqedA&neZs^lO+#60qz6N1loYJfro(UGG}YLfbHYx&5yv$ zI%!~Bj>V;}HrmMKFff2ibuBZG^g&?^qggo*y|7m_E2myqNCTyT(m-jTkOoQvrGe5w zkpDK~h0KZ5B<8cUh9hcf)rpB496M4y+#!~#vfs|p$7)b*=?Qb91=LIFz zz~)4HAi#^ZzdMJ4f0Qlmxnai3q!UVNzz=b?F!O*}C2P8AA3!Ds90FG5&n7UG3#QDYC3 z2Fe4afkGN64U`8;14ViR-UzJ6Ew*zQ_qx~D!1KW6z;OlDz}zYoqBh|+Tvfu&qyB!H zZL@)UfZKq#9&*cme3frSdz0n}96^*TBfLYV-Ij^RYHs`4LAT?09*rHfm^k0x&_z! zf$woi)>rD7jnSG39-FWiv}QuhkO8HE(m-jTG*CzbrGe5wX`t{x-ql%^UCF!+H+?zY z#V+!6J+e%WgfIMKqJb>@-N5V4G}>a2|ZkE*j$qUx-as5+|!s?JKOfvV2RAPxjo zXC*eEs2q8oT_!ozWxz)|RBMJZj002ov JPDHLkV1l(IdqMyJ literal 0 HcmV?d00001 diff --git a/decoder/html/power.png b/decoder/html/power.png new file mode 100644 index 0000000000000000000000000000000000000000..2b9dc6a4fb432c956bf6404ed9aabb060e4d10f1 GIT binary patch literal 919 zcmeAS@N?(olHy`uVBq!ia0y~yU_1n5`*E-V$<4B2Kmi8M0*}aI1_o|n5N2eUHAey{ z$X?><>&pI!O^Vsd=tN8MC7_UOW=KSdbAE1aYF-JD%fR4Vl$uzQnxasiS(2gP?&%wl zqL<3fz`)Gw>EaktaqI0}$DrE=A`OY%4}D^mu_w;ftDX?o=H1CVnUQV9bqJ%L7C{q3>=CeB%|=_xiQcfZ6^i+7>aPa{agIiTpi(L9+9fgZ)fx`etx(o z+bMgk`@C?!X`U8ruYSCA+_E+7*(`yZi}M*7?BB|T+*cKFviR6m^qT9=FDm=rpk zI2shV6d9U+h^n7fk!Jq6XYMM)Pp{w3dYv9G{Q2AGIVX$qi#PckGGs`JP~69#^d$LO zPA^kIhQQ+dnLusc>=#cOF>uckUDTm|l|%8sEbT2T<@I_*T%s3Gc&YiXJo?cr9nmK* zqnCxXd^j6iu*81{=YmSf!nm+VMJ~mf8slx}{g)Z%+c0??sf^SGx`h$Q?ogN~?gDnq zg4pQ-B(ilKDqp;Zb0$oV_gOhB9hl|9PD*t5Ims8DB>jGaOU(ylUFHjG38 +
getTracker(); + usort($trackers, function($a, $b) { + return $a->getLastActivity()['pkt'] > $b->getLastActivity()['pkt'] ? 1 : -1; + }); + foreach($trackers as $tr) { $cnt = $tr->getPacketCount(); + $act = min($tr->getLastActivity()); + if($act <= 86400 and !$last24h) { + echo "

Last 24h

"; + $last24h = true; + } + if($act > 86400 and $act <= 86400*7 and !$yesterday) { + echo "

Yesterday

"; + $yesterday = true; + } + if($act > 86400*7 and $act <= 86400*30 and !$aweekago) { + echo "

A week ago

"; + $aweekago = true; + } + if($act > 86400*30 and !$amonthago) { + echo "

A month ago

"; + $amonthago = true; + } echo "
getCall() . "\">" . $tr->getCall() . " ... getCall() . "\">Map getCall() . "\">Images
- Last Activity: " . time_format(max($tr->getLastActivity())) . "
+ Last Activity: " . time_format($act) . "
Packets: " . number_format($cnt['img']['cnt300'] + $cnt['pos']['cnt300']) . " (5m), " . number_format($cnt['img']['cnt3600'] + $cnt['pos']['cnt3600']) . " (1h)
"; diff --git a/decoder/html/style.css b/decoder/html/style.css index b916e1b8..364a9721 100644 --- a/decoder/html/style.css +++ b/decoder/html/style.css @@ -6,11 +6,10 @@ html, body { } .inner { margin: 3px; - padding: 3px; - border: solid 1px #777777; + border: solid 1px #666666; } .call { - background-color: #DDDDDD; + background-color: #ccdaec; padding: 5px; margin: 4px 0; } @@ -34,9 +33,52 @@ img { .pic img { margin: 0; } -td,th { +table { + border-spacing: 0px; +} +telemetry div { + background-color: #ccdaec; vertical-align: top; text-align: left; - padding: 1px 0; + padding: 5px; + margin: 3px; + float: left; +} +telemetry div div { + background-color: rgba(255, 255, 255, 0.0); +} + +telemetry div img { + margin: 0 2px; +} + +.fat { + font-size: 20px; + font-weight: bold; +} + +.wrapper { + display: flex; + flex-flow: row wrap; + text-align: center; +} + +.wrapper > * { + flex: 1 100%; +} + +telemetry { + width: 600px; margin: 0; } + +.side { + padding: 3px; +} + +@media all and (min-width: 800px) { + .side { order: 1; width: 270px; float: left; } + .telemetry { order: 2; flex: 3 0px; min-width: 456px; max-width: 456px; } + .range { order: 3; text-align: left; } + .chart { order: 4; flex: 3 0px; min-width: 456px; max-width: 456px; } +} diff --git a/decoder/html/telemetry.php b/decoder/html/telemetry.php index f70d2d37..f3e8c590 100644 --- a/decoder/html/telemetry.php +++ b/decoder/html/telemetry.php @@ -5,6 +5,7 @@ include "header.inc.php"; + + + + + + + +
+ +
Call
+
Reset
+
ID
+
Time (RX)
+
Time (SYS)
+ +
+ Packets
+ + + + + + + + + + + + + + + + + + + + + +
Last Packetin 24h
BCN ______________________________
DIR ______________________________
IMG ______________________________
LOG ______________________________
T-  30       20        10        0 min ago
+
+ + + + +
+
mW
+
mW

+ +
+ mVSTM
+ mVPAC +
+
+ mVSTM
+ mVPAC +
+
Power
+
+
+
+ +

+ Sats, TTFF s, pDOP
+ Time: +
+
+ + + +
+ Sensors: + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
AirpressureTemp.Hum.FL
BME280I1
BME280E1
BME280E2
+ +
+
+ +
+ + + + + + + + + +
+  Range: + 1h + 3h + 6h + 12h + 24h + 2d + 3d + 5d + 7d + 14d + 21d + 30d +
+ +
+
+
+
+
+
+
+ + + + +