Ruderverein-Donau-Linz/rowt
1
1
Fork 1
Code Issues 25 Pull Requests Actions Packages Projects Wiki Activity

fun with js :-)

Browse Source
This commit is contained in:
philipp 2023-07-27 11:25:11 +02:00
parent bbe36032bc
commit 70930321ee
2 changed files with 49 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
templates/includes/forms/log.html.tera
View File

@ -1,29 +1,28 @@
{% macro new() %}
<form action="/log" method="post" id="form">
{{ macros::select(data=boats, select_name='boat_id') }}
{{ macros::select(data=boats, select_name='boat_id', display=["name", " (","amount_seats", " x)"], extras=["default_shipmaster_only_steering", "amount_seats"]) }}
<script>
function updateElementsBasedOnSelectedOption() {
var selectElement = document.getElementById('boat_id');
var selectedOption = selectElement.selectedOptions[0];
var shipmaster_only_steering = selectedOption.getAttribute("extra-default_shipmaster_only_steering") === 'true';
document.getElementById('shipmaster_only_steering').checked = shipmaster_only_steering;
document.getElementById('max_rower_allowed').innerHTML = selectedOption.getAttribute("extra-amount_seats");
}
document.getElementById('boat_id').addEventListener('change', updateElementsBasedOnSelectedOption);
document.addEventListener('DOMContentLoaded', updateElementsBasedOnSelectedOption);
</script>
{{ macros::select(data=coxes, select_name='shipmaster', selected_id=loggedin_user.id) }}
{{ macros::checkbox(label='shipmaster_only_steering', name='shipmaster_only_steering') }} <!-- TODO: depending on boat, deselect by default -->
Departure: <input type="datetime-local" id="datetime-dep" value="2023-07-24T08:00" name="departure" required/>
{{ macros::checkbox(label='shipmaster_only_steering', name='shipmaster_only_steering') }}
Departure: <input type="datetime-local" id="datetime-dep" name="departure" required/>
Arrival: <input type="datetime-local" id="datetime-arr" name="arrival" />
<script>
document.getElementById('form').addEventListener('submit', function(e) {
e.preventDefault();
for(let optional_elem of ["datetime-arr", "distance_in_km", "comments", "logtype"]){
let myInput = document.getElementById(optional_elem);
if (myInput.value === '') {
myInput.removeAttribute('name');
}
}
this.submit();
});
</script>
Destination: <input type="search" list="destinations" placeholder="Destination" name="destination" id="destination" oninput="var inputElement = document.getElementById('destination');
var dataList = document.getElementById('destinations');
var selectedValue = inputElement.value;
for (var i = 0; i < dataList.options.length; i++) {
if (dataList.options[i].value === selectedValue) {
var distance = dataList.options[i].getAttribute('distance');
console.log(distance);
document.getElementById('distance_in_km').value = distance;
break;
}
@ -36,11 +35,18 @@ document.getElementById('form').addEventListener('submit', function(e) {
{{ macros::input(label="Distanz", name="distance_in_km", type="number", min=0) }}
{{ macros::input(label="Kommentar", name="comments", type="text") }}
{{ macros::select(data=logtypes, select_name='logtype', default="Normal") }}
<select multiple="multiple" name="rower[]">
<select multiple="multiple" name="rower[]" id="rower">
{% for user in users %}
<option value="{{ user.id }}" onmousedown="event.preventDefault(); this.selected = !this.selected; return false;">{{user.name}}</option>
<option value="{{ user.id }}" onmousedown="event.preventDefault();this.selected = !this.selected; updateSelectedRowersCount(); return false;">{{user.name}}</option>
{% endfor %}
</select>
<script>
function updateSelectedRowersCount() {
document.getElementById('amount_rower_selected').textContent = document.getElementById('rower').selectedOptions.length+1;
}
document.addEventListener('DOMContentLoaded', updateSelectedRowersCount);
</script>
<span id="amount_rower_selected"></span>/<span id="max_rower_allowed"></span> Ruderer ausgewählt
<input type="submit" />
<script>
@ -52,6 +58,18 @@ document.getElementById('form').addEventListener('submit', function(e) {
document.getElementById("datetime-dep").value = formattedDate;
</script>
</form>
<script>
document.getElementById('form').addEventListener('submit', function(e) {
e.preventDefault();
for(let optional_elem of ["datetime-arr", "distance_in_km", "comments", "logtype"]){
let myInput = document.getElementById(optional_elem);
if (myInput.value === '') {
myInput.removeAttribute('name');
}
}
this.submit();
});
</script>
{% endmacro new %}

15
templates/includes/macros.html.tera
View File

@ -55,13 +55,24 @@
</label>
{% endmacro checkbox %}
{% macro select(data, select_name='trip_type', default='', selected_id='') %}
{% macro select(data, select_name='trip_type', default='', selected_id='', display='', extras='') %}
{% if display == '' %}
{% set display = ["name"] %}
{% endif %}
<select name="{{ select_name }}" id="{{ select_name }}" class="input rounded-md h-10">
{% if default %}
<option selected value>{{ default }}</option>
{% endif %}
{% for d in data %}
<option value="{{ d.id }}" {% if d.id == selected_id %} selected {% endif %}>{{ d.name }}</option>
<option value="{{ d.id }}" {% if d.id == selected_id %} selected {% endif %}{% if extras != '' %}{% for extra in extras %} extra-{{extra}}={{d[extra]}} {% endfor %}{% endif %}>
{% for displa in display -%}
{%- if d[displa] -%}
{{- d[displa] -}}
{%- else -%}
{{- displa -}}
{%- endif -%}
{%- endfor %}
</option>
{% endfor %}
</select>
{% endmacro select %}