Compare commits

..

No commits in common. "master" and "master" have entirely different histories.

2 changed files with 10 additions and 43 deletions

View File

@ -195,12 +195,12 @@
<h2 class="text-center py-3">Átlagsebesség számítás</h2> <h2 class="text-center py-3">Átlagsebesség számítás</h2>
<div class="row mx-0"> <div class="row mx-0">
<div id="circuitimage" class=".d-none .d-md-block col-md-5"> <div id="circuitimage" class=".d-none .d-md-block col-md-5">
<img id="circuitimage-img"> <!-- Pálya képét ide kell beilleszteni-->
</div> </div>
<form class="col-md-5 offset-md-1"> <form class="col-md-5 offset-md-1">
<div class="form-group"> <div class="form-group">
<label for="circuit">Pálya</label> <label for="circuit">Pálya</label>
<select class="form-control" id="circuit" onchange="calculate()"> <select class="form-control" id="circuit" onchange="">
<option value=""></option> <option value=""></option>
<option value="HUN">Hungaroring</option> <option value="HUN">Hungaroring</option>
<option value="MON">Monaco</option> <option value="MON">Monaco</option>
@ -210,7 +210,7 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="laptime">1 kör ideje (másodpercben)</label> <label for="laptime">1 kör ideje (másodpercben)</label>
<input type="number" class="form-control" id="laptime" placeholder="pl.: 105.954" oninput="calculate()"> <input type="number" class="form-control" id="laptime" placeholder="pl.: 105.954" oninput="">
</div> </div>
<div class="form-group"> <div class="form-group">

47
main.js
View File

@ -1,50 +1,17 @@
$(document).ready(function () { $(document).ready(function () {
$('.navbar-nav li').click(function (x) { $('.navbar-nav li').click(function (x) {
$('.navbar-nav li').removeClass('active') $('.navbar-nav li').removeClass('active');
$(event.target).parent().addClass('active') $(event.target).parent().addClass('active');
}) });
}) });
const circuits = {
'HUN': {
img: 'hungaroring.jpg',
l: 4.381,
},
'MON': {
img: 'monaco.jpg',
l: 3.337,
},
'BEL': {
img: 'spa.jpg',
l: 7.004,
},
'ITA': {
img: 'monza.jpg',
l: 5.793,
},
}
function showCircuit() { function showCircuit() {
/** @type {HTMLImageElement} */ //A listából kiválasztott kép megjelenítése az id="circuitimage" div-ben
const img = document.getElementById('circuitimage-img')
/** @type {HTMLSelectElement} */
const circuit = document.getElementById('circuit')
img.src = './img/' + circuits[circuit.value].img
} }
//--------------------------------------------------------- //---------------------------------------------------------
function calculate() { function calculate() {
showCircuit() showCircuit();
/** @type {HTMLSelectElement} */ //Ha van kiválasztott pálya és beírt köridő, akkor a pályának megfelelő átlagsebesség kiszámítása és megjelenítése az id="averagespeed" input mezőben
const circuit = document.getElementById('circuit')
/** @type {HTMLInputElement} */
const laptime = document.getElementById('laptime')
/** @type {HTMLInputElement} */
const output = document.getElementById('averagespeed')
/** @type {number} */
if (!circuit.value || !laptime.value) { return }
const l = circuits[circuit.value].l
const t = laptime.valueAsNumber
output.value = Math.round(l / (t / 3600)) + ' km/h'
} }