| Line 190... |
Line 190... |
| 190 |
/* journey timeline (exec drilldown) */
|
190 |
/* journey timeline (exec drilldown) */
|
| 191 |
.tl{position:relative;margin:14px 2px 4px;padding:4px 0}
|
191 |
.tl{position:relative;margin:14px 2px 4px;padding:4px 0}
|
| 192 |
.tl::before{content:"";position:absolute;left:50%;top:6px;bottom:6px;width:2px;background:#e9edf5;transform:translateX(-50%)}
|
192 |
.tl::before{content:"";position:absolute;left:50%;top:6px;bottom:6px;width:2px;background:#e9edf5;transform:translateX(-50%)}
|
| 193 |
.tlgap{position:relative;display:flex;justify-content:center;margin:-3px 0}
|
193 |
.tlgap{position:relative;display:flex;justify-content:center;margin:-3px 0}
|
| 194 |
.tlgap .gappill{background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px 11px;font-size:11px;font-weight:600;color:var(--muted);z-index:2;box-shadow:0 1px 2px rgba(20,30,60,.05);font-variant-numeric:tabular-nums}
|
194 |
.tlgap .gappill{background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px 11px;font-size:11px;font-weight:600;color:var(--muted);z-index:2;box-shadow:0 1px 2px rgba(20,30,60,.05);font-variant-numeric:tabular-nums}
|
| - |
|
195 |
.tlgap .gappill.overrun{border-color:var(--red);color:var(--red)}
|
| 195 |
.tlrow{position:relative;display:flex;justify-content:space-between;align-items:flex-start;margin:14px 0}
|
196 |
.tlrow{position:relative;display:flex;justify-content:space-between;align-items:flex-start;margin:14px 0}
|
| 196 |
.tlrow .node{position:absolute;left:50%;top:8px;transform:translateX(-50%);width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;z-index:2;box-shadow:0 0 0 4px #fff}
|
197 |
.tlrow .node{position:absolute;left:50%;top:8px;transform:translateX(-50%);width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;z-index:2;box-shadow:0 0 0 4px #fff}
|
| 197 |
.tlcard{width:calc(50% - 26px);background:#fff;border:1px solid var(--line);border-radius:11px;box-shadow:0 2px 10px rgba(20,30,60,.07);display:flex;overflow:hidden}
|
198 |
.tlcard{width:calc(50% - 26px);background:#fff;border:1px solid var(--line);border-radius:11px;box-shadow:0 2px 10px rgba(20,30,60,.07);display:flex;overflow:hidden}
|
| 198 |
.tlrow.left .tlcard{flex-direction:row-reverse;text-align:right}
|
199 |
.tlrow.left .tlcard{flex-direction:row-reverse;text-align:right}
|
| 199 |
.tlrow.right .tlcard{flex-direction:row;text-align:left}
|
200 |
.tlrow.right .tlcard{flex-direction:row;text-align:left}
|
| Line 1092... |
Line 1093... |
| 1092 |
var ri=0;
|
1093 |
var ri=0;
|
| 1093 |
seq.forEach(function(x){
|
1094 |
seq.forEach(function(x){
|
| 1094 |
if(!x._punch && x.checkInTime){
|
1095 |
if(!x._punch && x.checkInTime){
|
| 1095 |
var tr=(x.transitTime && x.transitTime!=='00:00:00') ? x.transitTime : null;
|
1096 |
var tr=(x.transitTime && x.transitTime!=='00:00:00') ? x.transitTime : null;
|
| 1096 |
var km=(x.totalDistance && parseFloat(x.totalDistance)>0) ? (parseFloat(x.totalDistance).toFixed(2)+' km') : null;
|
1097 |
var km=(x.totalDistance && parseFloat(x.totalDistance)>0) ? (parseFloat(x.totalDistance).toFixed(2)+' km') : null;
|
| - |
|
1098 |
var eta=(x.estimatedTime && x.estimatedTime!=='00:00:00') ? x.estimatedTime : null;
|
| 1097 |
if(tr || km){
|
1099 |
if(tr || km || eta){
|
| 1098 |
var parts=[]; if(tr) parts.push('🚗 '+esc(tr)); if(km) parts.push(esc(km));
|
1100 |
var parts=[]; if(tr) parts.push('🚗 '+esc(tr)); if(km) parts.push(esc(km)); if(eta) parts.push('ETA '+esc(eta));
|
| - |
|
1101 |
// flag the leg red when actual transit exceeds 1.5x the ETA (same rule as the export)
|
| - |
|
1102 |
var overrun = eta && toSec(tr) > 1.5*toSec(eta);
|
| 1099 |
h+='<div class="tlgap"><span class="gappill">'+parts.join(' · ')+'</span></div>';
|
1103 |
h+='<div class="tlgap"><span class="gappill'+(overrun?' overrun':'')+'"'+(overrun?' title="Travel overran 1.5x the ETA"':'')+'>'+parts.join(' · ')+'</span></div>';
|
| 1100 |
}
|
1104 |
}
|
| 1101 |
}
|
1105 |
}
|
| 1102 |
h+=tlRow(x, ri%2===0?'left':'right'); ri++;
|
1106 |
h+=tlRow(x, ri%2===0?'left':'right'); ri++;
|
| 1103 |
});
|
1107 |
});
|
| 1104 |
h+='</div>';
|
1108 |
h+='</div>';
|