| Geburtstagsrechner 2020

Die Aufgabe wurde anschliessend zum Taschenrechner in der Lehre zum Einstieg mit JavaScript gelösst.

Es sollte ein Programm umgesetzt werden welches von dem jetzigen Datum, zurück zu dem angegebenen Datum rechnet. Dann soll die bisher vergangene Zeit in Jahren, Tagen, Stunden, Minuten und Sekunden ausgerechnet und angegeben werden.

HTML

<!DOCTYPE html>

<head>

<title>birthday calculator</title>

</head>

<body>

<button class="clear">clear</button>

</div>

<p></p>

</div>

</body>

</html>

CSS

body {

font-family: arial;

background-color: #eef0f6;

}

#output {

width: 180px;

margin-top: 20px;

}

#outputInSeconds, #outputInMinutes, #outputInHours, #outputInDays, #outputInYears {

width: 100%;

border: 1px;

}

#outputInYears{

margin-top: 20px;

}

JavaScript

$('.startCovertion').on('click', (event)=> {

let calculatedDate = (new Date().getTime() - new Date($('#birthday').val()).getTime())/1000;

$('#outputInSeconds').val(calculatedDate + ' seconds');

getSingleData(calculatedDate)

getAllData(calculatedDate)

})

$(document).on('keydown', function (event) {

const pressedKey = event.key;

if (pressedKey === "Enter") {

let calculatedDate = (new Date().getTime() - new Date($('#birthday').val()).getTime())/1000;

$('#outputInSeconds').val(calculatedDate + ' seconds');

getSingleData(calculatedDate)

getAllData(calculatedDate)

}

})

$('.clear').on('click', (event)=> {

$('#birthday, #output, #outputInSeconds, #outputInMinutes, #outputInHours, #outputInDays, #outputInYears').val('')

})

function getAllData(calculatedDate) {

let calculatedYear = Math.floor(calculatedDate / 31536000);

calculatedDate = calculatedDate % 31536000;

let calculatedDay = Math.floor(calculatedDate / 86400);

calculatedDate = calculatedDate % 86400;

let calculatedHour = Math.floor((calculatedDate / 3600) + 2);

calculatedDate = calculatedDate % 3600;

let calculatedMinute = Math.floor(calculatedDate / 60);

calculatedDate = calculatedDate % 60;

let calculatedSecond = Math.floor(calculatedDate);

calculatedDate = calculatedDate - calculatedSecond;

$('#output').val(calculatedYear + ' y ' + calculatedDay + ' d ' + calculatedHour + ' h ' + calculatedMinute + ' min ' + calculatedSecond + ' s ')

}

function getSingleData(secondCalculation) {

secondCalculation = Math.floor(secondCalculation / 60);

$('#outputInMinutes').val(secondCalculation + ' minutes');

secondCalculation = Math.floor((secondCalculation / 60) + 2);

$('#outputInHours').val(secondCalculation + ' hours');

secondCalculation = Math.floor(secondCalculation / 24);

$('#outputInDays').val(secondCalculation + ' days');

secondCalculation = Math.floor(secondCalculation * 86400 / 31536000);

$('#outputInYears').val(secondCalculation + ' years');

}