WIP : kart dashboard

This commit is contained in:
bglacial 2019-04-21 21:13:58 +02:00
parent d651d0f6b9
commit 744fc5dbfc
16 changed files with 115 additions and 199 deletions

View File

@ -41,7 +41,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -41,7 +41,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -41,7 +41,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -41,7 +41,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -45,7 +45,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item active"> <li class="nav-item active">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -42,7 +42,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item active"> <li class="nav-item active">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -43,7 +43,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item active"> <li class="nav-item active">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>
@ -212,32 +212,21 @@
<img class="card-img-top driver_img glow" src="img/11.png" <img class="card-img-top driver_img glow" src="img/11.png"
alt="Card image cap"> alt="Card image cap">
</a> </a>
<h5 class="card-title">Pich</h5> <h5 class="card-title" id="current_driver_name"></h5>
<p class="card-text">Total : 15:30:02<br> <p class="card-text">Total : 15:30:02<br>
<label for="refTime">Temps de ref. :</label> <label for="refTime">Temps de ref. :</label>
</p> </p>
<div class="input-group"> <div class="input-group">
<span class="input-group-btn"> <span class="input-group-btn">
<button type="button" class="btn btn-danger btn-number" <button type="button" class="btn btn-danger btn-number" onclick="">
onclick="location.href='/?name=chgRefTime&amp;driverID=11&amp;refTime=61';"> <i class="fas fa-plus"></i>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round"
class="feather feather-minus"><line x1="5" y1="12" x2="19"
y2="12"></line></svg>
</button> </button>
</span> </span>
<input type="text" id="refTime" class="form-control" value="62"> <input type="text" id="refTime_current_driver" class="form-control" value="">
<span class="input-group-btn"> <span class="input-group-btn">
<button type="button" class="btn btn-success btn-number" <button type="button" class="btn btn-success btn-number" onclick="">
onclick="location.href='/?name=chgRefTime&amp;driverID=11&amp;refTime=63';"> <i class="fas fa-minus"></i>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round"
class="feather feather-plus"><line x1="12" y1="5" x2="12"
y2="19"></line><line x1="5" y1="12"
x2="19"
y2="12"></line></svg>
</button> </button>
</span> </span>
</div> </div>
@ -323,159 +312,7 @@
Next drivers Next drivers
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="row"> <div class="row" id="next_driver_list">
<div class="col-xl-2 col-lg-4 col-md-6">
<div class="card" style="width: auto;">
<a class="card-img-top" href="/?name=chgDriver&amp;kartID=2&amp;driverID=7">
<img class="card-img-top " src="img/7.png" alt="Card image cap">
</a>
<div class="card-body">
<h5 class="card-title">Nico</h5>
<p class="card-text">Total : 03:39:36<br>
Tps de repos : 14:05:26<br>
<label for="refTime">Temps de ref. :</label>
</p>
<div class="input-group">
<span class="input-group-btn">
<button type="button" class="btn btn-danger btn-number"
onclick="location.href='/?name=chgRefTime&amp;driverID=7&amp;refTime=59';">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-minus"><line x1="5" y1="12" x2="19"
y2="12"></line></svg>
</button>
</span>
<input type="text" id="refTime" class="form-control" value="60">
<span class="input-group-btn">
<button type="button" class="btn btn-success btn-number"
onclick="location.href='/?name=chgRefTime&amp;driverID=7&amp;refTime=61';">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-plus"><line x1="12" y1="5" x2="12"
y2="19"></line><line
x1="5" y1="12" x2="19" y2="12"></line></svg>
</button>
</span>
</div>
<p></p>
</div>
</div>
</div>
<div class="col-xl-2 col-lg-4 col-md-6">
<div class="card" style="width: auto;">
<a class="card-img-top" href="/?name=chgDriver&amp;kartID=2&amp;driverID=9">
<img class="card-img-top " src="img/9.png" alt="Card image cap">
</a>
<div class="card-body">
<h5 class="card-title">Phillipe</h5>
<p class="card-text">Total : 02:45:40<br>
Tps de repos : 14:50:03<br>
<label for="refTime">Temps de ref. :</label>
</p>
<div class="input-group">
<span class="input-group-btn">
<button type="button" class="btn btn-danger btn-number"
onclick="location.href='/?name=chgRefTime&amp;driverID=9&amp;refTime=61';">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-minus"><line x1="5" y1="12" x2="19"
y2="12"></line></svg>
</button>
</span>
<input type="text" id="refTime" class="form-control" value="62">
<span class="input-group-btn">
<button type="button" class="btn btn-success btn-number"
onclick="location.href='/?name=chgRefTime&amp;driverID=9&amp;refTime=63';">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-plus"><line x1="12" y1="5" x2="12"
y2="19"></line><line
x1="5" y1="12" x2="19" y2="12"></line></svg>
</button>
</span>
</div>
<p></p>
</div>
</div>
</div>
<div class="col-xl-2 col-lg-4 col-md-6">
<div class="card" style="width: auto;">
<a class="card-img-top" href="/?name=chgDriver&amp;kartID=2&amp;driverID=10">
<img class="card-img-top " src="img/10.png" alt="Card image cap">
</a>
<div class="card-body">
<h5 class="card-title">Paul</h5>
<p class="card-text">Total : 03:48:44<br>
Tps de repos : 13:20:32<br>
<label for="refTime">Temps de ref. :</label>
</p>
<div class="input-group">
<span class="input-group-btn">
<button type="button" class="btn btn-danger btn-number"
onclick="location.href='/?name=chgRefTime&amp;driverID=10&amp;refTime=60';">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-minus"><line x1="5" y1="12" x2="19"
y2="12"></line></svg>
</button>
</span>
<input type="text" id="refTime" class="form-control" value="61">
<span class="input-group-btn">
<button type="button" class="btn btn-success btn-number"
onclick="location.href='/?name=chgRefTime&amp;driverID=10&amp;refTime=62';">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-plus"><line x1="12" y1="5" x2="12"
y2="19"></line><line
x1="5" y1="12" x2="19" y2="12"></line></svg>
</button>
</span>
</div>
<p></p>
</div>
</div>
</div>
<div class="col-xl-2 col-lg-4 col-md-6">
<div class="card" style="width: auto;">
<a class="card-img-top" href="/?name=chgDriver&amp;kartID=2&amp;driverID=12">
<img class="card-img-top " src="img/12.png" alt="Card image cap">
</a>
<div class="card-body">
<h5 class="card-title">Benoît</h5>
<p class="card-text">Total : 03:37:02<br>
Tps de repos : 12:38:57<br>
<label for="refTime">Temps de ref. :</label>
</p>
<div class="input-group">
<span class="input-group-btn">
<button type="button" class="btn btn-danger btn-number"
onclick="location.href='/?name=chgRefTime&amp;driverID=12&amp;refTime=59';">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-minus"><line x1="5" y1="12" x2="19"
y2="12"></line></svg>
</button>
</span>
<input type="text" id="refTime" class="form-control" value="60">
<span class="input-group-btn">
<button type="button" class="btn btn-success btn-number"
onclick="location.href='/?name=chgRefTime&amp;driverID=12&amp;refTime=61';">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-plus"><line x1="12" y1="5" x2="12"
y2="19"></line><line
x1="5" y1="12" x2="19" y2="12"></line></svg>
</button>
</span>
</div>
<p></p>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -553,6 +390,7 @@
$(document).ready(function () { $(document).ready(function () {
getKartsMenu(); getKartsMenu();
getDashboardKartInfo();
}); });
</script> </script>

View File

@ -41,7 +41,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item active"> <li class="nav-item active">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -1,7 +1,16 @@
timelapsStorage = localStorage; timelapsStorage = localStorage;
if(typeof timelapsStorage.current_kart_id === "undefined"){ if (typeof timelapsStorage.current_kart_id === "undefined") {
timelapsStorage.setItem('current_kart_id', null); timelapsStorage.setItem('current_kart_id', null);
} }
if (typeof timelapsStorage.params_max_relay_time === "undefined") {
timelapsStorage.setItem('params_max_relay_time', null);
}
if (typeof timelapsStorage.params_min_stand_time === "undefined") {
timelapsStorage.setItem('params_min_stand_time', null);
}
if (typeof timelapsStorage.params_max_fuel_autonomy === "undefined") {
timelapsStorage.setItem('params_max_fuel_autonomy', null);
}
function getKartsMenu() { function getKartsMenu() {
$.ajax({ $.ajax({
@ -13,11 +22,11 @@ function getKartsMenu() {
actual_kart = timelapsStorage.current_kart_id; actual_kart = timelapsStorage.current_kart_id;
$.each(data.reverse(), function (index, value) { $.each(data.reverse(), function (index, value) {
btn_class = 'btn-light'; btn_class = 'btn-light';
if(actual_kart == value.id ){ if (actual_kart == value.id) {
btn_class = 'btn-primary'; btn_class = 'btn-primary';
} }
$('#link_all').after("" + $('#link_all').after("" +
"&nbsp;<a id=\"link_" + value.id + "\" href=\"#\" onclick=\"showKartDashboard("+value.id+")\" class=\"btn "+btn_class+" btn-icon-split btn-sm\">\n \n" + "&nbsp;<a id=\"link_" + value.id + "\" href=\"#\" onclick=\"showKartDashboard(" + value.id + ")\" class=\"btn " + btn_class + " btn-icon-split btn-sm\">\n \n" +
" <span class=\"icon text-gray-600\">\n" + " <span class=\"icon text-gray-600\">\n" +
" <i class=\"fas fa-car\"></i>\n" + " <i class=\"fas fa-car\"></i>\n" +
"</span>\n" + "</span>\n" +
@ -290,7 +299,7 @@ function getDriversByKart() {
{ {
data: "id", data: "id",
render: function (data, type, row, meta) { render: function (data, type, row, meta) {
return '<a href="#" onclick=\'modalEditDriver(' + data + ')\' class="btn btn-primary btn-circle"><i class="fas fa-edit"></i></a>&nbsp;<a href="#" onclick=\'deleteDriver(' + data + ','+value.id + ',' + meta.row + ')\' class="btn btn-danger btn-circle"><i class="fas fa-trash"></i>'; return '<a href="#" onclick=\'modalEditDriver(' + data + ')\' class="btn btn-primary btn-circle"><i class="fas fa-edit"></i></a>&nbsp;<a href="#" onclick=\'deleteDriver(' + data + ',' + value.id + ',' + meta.row + ')\' class="btn btn-danger btn-circle"><i class="fas fa-trash"></i>';
} }
}, },
{ {
@ -404,7 +413,76 @@ function startRace() {
} }
function getDashboardKartInfo() {
$.ajax({
type: 'GET',
crossDomain: true,
url: api_url + 'relaysbykart/' + timelapsStorage.current_kart_id + '/',
dataType: 'json',
success: function (data, status) {
console.log(data);
$.each(data.reverse(), function (index, value) {
console.log(value);
if(value.relay_end == null){
$('#current_driver_name').text(value.driver.first_name);
$('#refTime_current_driver').val(value.driver.ref_time);
}else{
$('#next_driver_list').append("" +
"<div class=\"col-xl-2 col-lg-4 col-md-6\">\n" +
" <div class=\"card\" style=\"width: auto;\">\n" +
" <a class=\"card-img-top\">\n" +
" <img class=\"card-img-top \" src=\"img/"+value.driver.id+".png\" alt=\"Card image cap\">\n" +
" </a>\n" +
" <div class=\"card-body\">\n" +
" <h5 class=\"card-title\">"+value.driver.first_name+"</h5>\n" +
" <p class=\"card-text\">Total : 03:39:36<br>\n" +
" Tps de repos : 14:05:26<br>\n" +
" <label for=\"refTime\">Temps de ref. :</label>\n" +
" </p>\n" +
"\n" +
" <div class=\"input-group\">\n" +
" <span class=\"input-group-btn\">\n" +
" <button type=\"button\" class=\"btn btn-danger btn-number\" onclick=\"\">\n" +
" <i class=\"fas fa-plus\"></i>\n" +
" </button>\n" +
" </span>\n" +
" <input type=\"text\" id=\"refTime\" class=\"form-control\" value=\""+value.driver.ref_time+"\">\n" +
" <span class=\"input-group-btn\">\n" +
" <button type=\"button\" class=\"btn btn-success btn-number\" onclick=\"\">\n" +
" <i class=\"fas fa-minus\"></i>\n" +
" </button>\n" +
" </span>\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" </div>" +
"");
}
});
},
error: function (xhr) {
$.notify("APIs unreachable!", "error");
console.log('Request Status: ' + xhr.status + ' Status Text: ' + xhr.statusText + ' ' + xhr.responseText);
},
});
}
function showKartDashboard(kart_id) { function showKartDashboard(kart_id) {
timelapsStorage.setItem('current_kart_id', kart_id); timelapsStorage.setItem('current_kart_id', kart_id);
window.location.href='index_kart.html'; if (kart_id != null) {
window.location.href = 'index_kart.html';
} else {
window.location.href = 'index.html';
}
} }
$(document).ready(function () {
if (timelapsStorage.current_kart_id == "null" || typeof timelapsStorage.current_kart_id === "undefined") {
$('#link_all').removeClass('btn-light').addClass('btn-primary');
}
});

View File

@ -45,7 +45,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item active"> <li class="nav-item active">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -42,7 +42,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item active"> <li class="nav-item active">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -45,7 +45,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -41,7 +41,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -41,7 +41,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -41,7 +41,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>

View File

@ -41,7 +41,7 @@
<!-- Nav Item - Dashboard --> <!-- Nav Item - Dashboard -->
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="index.html"> <a class="nav-link" href="#" onclick="showKartDashboard(timelapsStorage.current_kart_id)">
<i class="fas fa-fw fa-tachometer-alt"></i> <i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a> <span>Dashboard</span></a>
</li> </li>