Commit 7a811415 authored by Clouard Regis's avatar Clouard Regis
Browse files

Added confirmation on planner board.

parent 5e47798b
......@@ -35,14 +35,10 @@ class ColorPicker {
this._basic_color.unshift(color);
}
colorToString(color) {
return color;
}
_getRandomColor() {
var letters = '0123456789ABCDEF';
var color = '#';
for (var i = 0; i < 6; i++) {
let letters = '0123456789ABCDEF';
let color = '#';
for (let i = 0; i < 6; i++) {
color += letters[Math.floor(Math.random() * 16)];
}
return color;
......
......@@ -39,11 +39,7 @@ class CustomeSvg {
}
}
checkStatus() { // TODO faire directement return this.svg.... == CustomeSvg.valid
if (this.svg.getElementsByTagName("path")[0].getAttribute("d") == CustomeSvg.valid) {
return true;
} else {
return false;
}
checkStatus() {
return this.svg.getElementsByTagName("path")[0].getAttribute("d") === CustomeSvg.valid;
}
}
\ No newline at end of file
......@@ -45,12 +45,12 @@ function renderTimeSheet() {
}
let elTable = document.createElement("table");
elTable.setAttribute("class", "table");
let head = document.createElement("thead");
let row = document.createElement("tr");
let name = document.createElement("th");
name.setAttribute("scope", "col");
name.innerHTML = "Poste";
let row = document.createElement("tr");
row.appendChild(name);
let head = document.createElement("thead");
head.appendChild(row);
let body = document.createElement("tbody");
let rows = [];
......@@ -60,7 +60,6 @@ function renderTimeSheet() {
el[i].getAttribute('lon'));
ll.distanceTo()
*/
let row = document.createElement("tr");
let name = document.createElement("th");
name.setAttribute("scope", "col");
if (index === 0) {
......@@ -70,6 +69,7 @@ function renderTimeSheet() {
} else {
name.innerHTML = index;
}
let row = document.createElement("tr");
row.appendChild(name);
body.appendChild(row);
rows.push(row);
......@@ -109,27 +109,27 @@ function renderTimeSheet() {
}
function addDownloadButton(event, pseudo, track, div) {
var button = document.createElement("button");
let button = document.createElement("button");
button.setAttribute('class', 'btn btn-primary');
button.innerHTML = " " + pseudo + ".gpx";
button.style = "display: block; margin-top: 5px; margin-bottom: 5px";
var icon = document.createElement("span");
button.style.cssText = "display: block; margin-top: 5px; margin-bottom: 5px";
let icon = document.createElement("span");
icon.className = "fa fa-download";
button.prepend(icon);
div.appendChild(button);
let handler1 = function (e) {
let handler1 = function () {
downloadFile(pseudo + ".gpx", track);
};
button.addEventListener("click", handler1);
return button;
}
function removeDowloadButton(event, div, button) {
function removeDownloadButton(div, button) {
div.removeChild(button);
}
function downloadFile(filename, contents) {
var element = document.createElement('a');
let element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(contents));
element.setAttribute('download', filename);
element.style.display = 'none';
......
......@@ -107,7 +107,7 @@ class PlannerController extends AbstractController
return $this->render(
'planner/missing_checkpoint.html.twig',
[
'courses' => $checkpoints,
'missingCheckpoints' => $checkpoints,
]
);
} else {
......
......@@ -5,25 +5,47 @@
{% block body %}
<div class="text-center">
<div class="container" style="padding-top: 100pt">
<h1>{% trans %}the.planners{% endtrans %}</h1>
<div class="container" style="padding-top: 20pt">
<h2>{% trans %}the.planners{% endtrans %}</h2>
<div class="overflow-auto h-50" style="max-height: 400px;">
<ul class="list-group">
{% for user in users %}
<li class="list-group-item">
<h3>{{ user.username }}</h3>
<a href="{{ path('your_courses', {id: user.id}) }}">
<button class="btn btn-info">{% trans %}their.courses{% endtrans %}</button>
</a>
<a href="{{ path('delete_user', {id: user.id}) }}">
<button class="btn btn-danger">{% trans %}delete{% endtrans %}</button>
</a>
<a href="{{ path('profile', {id: user.id}) }}">
<button class="btn btn-info">{% trans %}their.info{% endtrans %}</button>
</a>
</li>
{% endfor %}
</ul>
<ul class="list-group">
{% for user in users %}
<li class="list-group-item">
<h5>{{ user.username }}</h5>
<a href="{{ path('your_courses', {id: user.id}) }}">
<button class="btn btn-info">{% trans %}their.courses{% endtrans %}</button>
</a>
{# Delete #}
<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#confirm-delete">{% trans %}delete{% endtrans %}</button>
<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Confirmation</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Êtes-vous sur de vouloir supprimer définitivement ce traceur ?
</div>
<div class="modal-footer">
<a href="{{ path('delete_user', {id: user.id}) }}" type="button" class="btn btn-secondary">Oui, supprimer</a>
<button type="button" class="btn btn-primary" data-dismiss="modal">Non, conserver</button>
</div>
</div>
</div>
</div>
<a href="{{ path('profile', {id: user.id}) }}">
<button class="btn btn-info">{% trans %}their.info{% endtrans %}</button>
</a>
</li>
{% endfor %}
</ul>
</div>
<a href="{{ path('add_planner') }}">
......
......@@ -4,7 +4,7 @@
{% block body %}
<div class="container" style="padding-top: 20pt">
<h3 class="text-center">{% trans %}The courses{% endtrans %}</h3>
<h2 class="text-center">{% trans %}The courses{% endtrans %}</h2>
<div class="list-group">
{% for course in courses %}
<a href="{{ path('show_tracks', {id: course.id}) }}"
......
......@@ -51,7 +51,7 @@
}
/* Style the tab content */
.tabcontent {
.tab-content {
display: none;
padding: 6px 12px;
border: 1px solid #ccc;
......@@ -62,7 +62,7 @@
{% block javascripts %}
<script src="{{ asset('/public/javascript/showMap.js') }}"></script>
<script src="{{ asset('/public/javascript/add_course.js') }}"></script>
<script src="{{ asset('/public/javascript/addCourse.js') }}"></script>
<script src="{{ asset('/public/javascript/track.js') }}"></script>
<script src="{{ asset('/public/javascript/colorPicker.js') }}"></script>
<script src="{{ asset('/public/leaflet/leaflet.js') }}"></script>
......@@ -83,13 +83,13 @@
xhr.open("GET", "{{ route_map }}");
xhr.onload = function () {
let data = JSON.parse(xhr.response);
previewMap(data, document.getElementById("mapDiv"), divLeaflet, map, overlay, new Image(0, 0));
previewMap(data, document.getElementById("map-div"), divLeaflet, map, overlay, new Image(0, 0));
};
xhr.send()
}
function showTimeSheet() {
let divTable = document.getElementById("timeSheetDiv");
let divTable = document.getElementById("time-sheet-div");
while (divTable.lastElementChild) {
divTable.removeChild(divTable.lastElementChild);
}
......@@ -127,6 +127,7 @@
let totalTimeInMs = result[1];
let gpxTrace = result[2];
let controlPoints = result[3];
let courseFormat = result[4];
// Remarque result[4] is the format of the course. between 0 (preset order) and 1 (free order)
let trackButton = document.createElement("button");
trackButton.className = "route";
......@@ -135,20 +136,19 @@
let hours = Math.floor((totalTimeInMs / (1000 * 60 * 60)) % 24);
seconds = (seconds < 10 ? "0" + seconds : seconds);
minutes = (minutes < 10 ? "0" + minutes : minutes);
trackButton.innerHTML = pseudo + " " + hours + ":" + minutes + ":" + seconds;
trackButton.innerHTML = pseudo + " " + hours + ":" + minutes + ":" + seconds + "("+courseFormat+")";
trackButton.value = index++;
trackButton.addEventListener("click", function (e) {
var el = e.target;
if (!gpxDictionary[el.value]) {
gpxLayer = addTrack(e, map, gpxTrace);
gpxDictionary[el.value] = gpxLayer;
gpxDictionary[el.value] = addTrack(e, map, gpxTrace);
addTimeSheet(e, el.innerHTML, controlPoints, gpxTrace);
buttonDictionary[el.value] = addDownloadButton(e, el.innerHTML, gpxTrace, document.getElementById("FilesTab"));
buttonDictionary[el.value] = addDownloadButton(e, el.innerHTML, gpxTrace, document.getElementById("files-tab"));
} else {
gpxLayer = gpxDictionary[el.value];
let gpxLayer = gpxDictionary[el.value];
removeTrack(e, map, gpxLayer, gpxTrace);
removeTimeSheet(e, el.innerHTML);
removeDowloadButton(e, document.getElementById("FilesTab"), buttonDictionary[el.value]);
removeDownloadButton(document.getElementById("files-tab"), buttonDictionary[el.value]);
delete gpxDictionary[el.value];
delete buttonDictionary[el.value];
}
......@@ -170,10 +170,10 @@
<div class="row align-items-start" style="">
<div id="tracks" class="col" style="padding-top:10px;padding-bottom:10px; max-height: 100%; max-width: 25em;min-width: 18em">
<div id="track-form" hidden>
<button class="btn btn-primary visible-xs dropdown-toggle" type="button" data-toggle="collapse" data-target="#side-menu-collapse" aria-haspopup="true" aria-expanded="false" aria-controls="collapseExample" style="width: 100%; ">
<button class="btn btn-primary visible-xs dropdown-toggle" type="button" data-toggle="collapse" data-target="#side-menu-collapse" aria-expanded="false" aria-controls="collapseList" style="width: 100%; ">
Traces GPS
</button>
<div class="list-group collapse border-primary" id="side-menu-collapse" style="border: 1px solid;overflow:scroll;max-height:65vh">
<div class="list-group collapseborder-primary" id="side-menu-collapse" aria-expanded="false" aria-controls="collapseList" style="border: 1px solid;overflow:scroll;max-height:65vh">
</div>
</div>
<p id="empty-track-list-message" hidden>
......@@ -183,38 +183,37 @@
<div class="col" style="width:100%">
<div class="tab">
<button class="tablinks" onclick="openTab('tab1', 'MapTab')" id="tab1">Carte</button>
<button class="tablinks" onclick="openTab('tab2', 'TimesTab')" id="tab2">Temps</button>
<button class="tablinks" onclick="openTab('tab3', 'FilesTab')" id="tab3">Fichiers</button>
<button class="tab-links" onclick="openTab('tab1', 'map-tab')" id="tab1">Carte</button>
<button class="tab-links" onclick="openTab('tab2', 'times-tab')" id="tab2">Temps</button>
<button class="tab-links" onclick="openTab('tab3', 'files-tab')" id="tab3">Fichiers</button>
</div>
<!-- Tab content -->
<div id="MapTab" class="tabcontent">
<div id="mapDiv" style="min-width: 300px"></div>
<div id="map-tab" class="tab-content">
<div id="map-div" style="min-width: 300px"></div>
</div>
<div id="TimesTab" class="tabcontent">
<div id="timeSheetDiv" style="min-width: 300px"></div>
<div id="times-tab" class="tab-content">
<div id="time-sheet-div" style="min-width: 300px"></div>
</div>
<div id="FilesTab" class="tabcontent" style="min-width: 300px">
<div id="files-tab" class="tab-content" style="min-width: 300px">
</div>
</div>
</div>
</div>
<script>
function openTab(tabTitle, tabContent) {
let i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
function openTab(tabTitle, tabId) {
let i, tabContent, tabLinks;
tabContent = document.getElementsByClassName("tab-content");
for (i = 0; i < tabContent.length; i++) {
tabContent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
tabLinks = document.getElementsByClassName("tab-links");
for (i = 0; i < tabLinks.length; i++) {
tabLinks[i].className = tabLinks[i].className.replace(" active", "");
}
document.getElementById(tabContent).style.display = "block";
document.getElementById(tabId).style.display = "block";
document.getElementById(tabTitle).className += " active";
}
document.getElementById("tab1").click();
</script>
{% endblock %}
......@@ -12,7 +12,7 @@
<script src="{{ asset('/public/leaflet/ImageOverlay.rotated.js') }}"></script>
<script src="{{ asset('/public/javascript/customSvg.js') }}"></script>
<script src="{{ asset('/public/javascript/showMap.js') }}"></script>
<script src="{{ asset('/public/javascript/add_course.js') }}"></script>
<script src="{{ asset('/public/javascript/addCourse.js') }}"></script>
<script src="{{ asset('/public/leaflet/easy-button.js') }}"></script>
{{ parent() }}
......
......@@ -5,7 +5,7 @@
{% block body %}
<div class="container text-center" style="padding-top: 20pt">
<h1>{% trans %}missing.checkpoints{% endtrans %}</h1>
<h2>{% trans %}missing.checkpoints{% endtrans %}</h2>
<div class="overflow-auto h-50" style="max-height: 400px;">
<ul class="list-group">
{% for checkpoint in missingCheckpoints %}
......
......@@ -10,7 +10,7 @@
{% block javascripts %}
<script src="{{ asset('/public/javascript/showMap.js') }}"></script>
<script src="{{ asset('/public/javascript/add_course.js') }}"></script>
<script src="{{ asset('/public/javascript/addCourse.js') }}"></script>
<script src="{{ asset('/public/leaflet/leaflet.js') }}"></script>
<script src="{{ asset('/public/leaflet/ImageOverlay.rotated.js') }}"></script>
<script src="{{ asset('/public/leaflet/easy-button.js') }}"></script>
......
......@@ -5,29 +5,70 @@
{% block body %}
<div class="container text-center" style="padding-top: 20pt">
<h3>{% trans %}your.courses{% endtrans %}</h3>
<h2>{% trans %}your.courses{% endtrans %}</h2>
<div class="overflow-auto h-50" style="max-height: 400px;margin-bottom: 20px">
<ul class="list-group">
{% for course in courses %}
<li class="list-group-item">
<h5>{{ course.name }}</h5>
{# Preview #}
<a href="{{ path('preview_course', {id: course.id}) }}">
<button class="btn btn-info">{% trans %}preview{% endtrans %}</button>
</a>
<a href="{{ path('clear_course', {id: course.id}) }}">
<button class="btn btn-danger">{% trans %}clear{% endtrans %}</button>
</a>
{# Clean #}
<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#confirm-clean-{{ course.id }}">{% trans %}clear{% endtrans %}</button>
<div class="modal fade" id="confirm-clean-{{ course.id }}" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Confirmation</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Êtes-vous sur de vouloir supprimer définitivement toutes les traces de ce parcours ?
</div>
<div class="modal-footer">
<a href="{{ path('clear_course', {id: course.id}) }}" type="button" class="btn btn-secondary">Oui, nettoyer</a>
<button type="button" class="btn btn-primary" data-dismiss="modal">Non, conserver</button>
</div>
</div>
</div>
</div>
{# Clean #}
<a href="{{ path('add_course', {id: course.id}) }}">
<button class="btn btn-warning">{% trans %}modify{% endtrans %}</button>
</a>
<a href="{{ path('delete_course', {id: course.id}) }}">
<button class="btn btn-danger">{% trans %}delete{% endtrans %}</button>
</a>
{# Missing control #}
<a href="{{ path('missing_checkpoint', {id: course.id}) }}">
<button class="btn btn-info">
{{ "missing.checkpoints"|trans({'%nb%' : course.missingCheckpoints|length}) }}
</button>
<button class="btn btn-info"> {{ "missing.checkpoints"|trans({'%nb%' : course.missingCheckpoints|length}) }} </button>
</a>
{# Delete #}
<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#confirm-delete-{{ course.id }}">{% trans %}delete{% endtrans %}</button>
<div class="modal fade" id="confirm-delete-{{ course.id }}" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Confirmation</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Êtes-vous sur de vouloir supprimer définitivement ce parcours ?
</div>
<div class="modal-footer">
<a href="{{ path('delete_course', {id: course.id}) }}" type="button" class="btn btn-secondary">Oui, supprimer</a>
<button type="button" class="btn btn-primary" data-dismiss="modal">Non, conserver</button>
</div>
</div>
</div>
</div>
</li>
{% endfor %}
</ul>
......
......@@ -11,7 +11,7 @@
<div class="row">
<div class="col-md-12">
<h3>{% trans %}Informations personnelles{% endtrans %}</h3>
<small>N.B. Pour respecter la vie privée, les informations sont chiffrées dans la base de données.</small>
<small>NB. Dans le respect de la confidentialité des données, toutes les informations ci-dessous sont chiffrées dans la base de données.</small>
<hr>
</div>
</div>
......
......@@ -53,7 +53,7 @@ show:
the:
planners: Les traceurs
The courses: Les Parcours
The courses: Les parcours
their:
courses: Leurs courses
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment