06.TimeConverter

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Time Converter</title>
    <style>
        label, input {
            display: inline-block;
            width: 5em;
        }
        label {
            text-align: right;
        }
    </style>
</head>
<body onload="attachEventsListeners()">
<h1>Time Converter</h1>
<div>
    <label for="days">Days: </label>
    <input type="text" id="days">
    <input id="daysBtn" type="button" value="Convert">
</div>
<div>
    <label for="hours">Hours: </label>
    <input type="text" id="hours">
    <input id="hoursBtn" type="button" value="Convert">
</div>
<div>
    <label for="minutes">Minutes: </label>
    <input type="text" id="minutes">
    <input id="minutesBtn" type="button" value="Convert">
</div>
<div>
    <label for="seconds">Seconds: </label>
    <input type="text" id="seconds">
    <input id="secondsBtn" type="button" value="Convert">
</div>
</body>
<script>
    function attachEventsListeners() {
        let targetDays = document.getElementById('days');
        let targetHours = document.getElementById('hours');
        let targetMinutes = document.getElementById('minutes');
        let targetSeconds = document.getElementById('seconds');

        let daysButton = document.getElementById('daysBtn');
        let hoursButton = document.getElementById('hoursBtn');
        let minutesButton = document.getElementById('minutesBtn');
        let secondsButton = document.getElementById('secondsBtn');

        daysButton.addEventListener('click', daysConvertion);
        hoursButton.addEventListener('click', hoursConvertion);
        minutesButton.addEventListener('click', minutesConvertion);
        secondsButton.addEventListener('click', secondsConvertion);

        function daysConvertion() {
            targetDays = Number(targetDays.value);
            targetHours.value = targetDays * 24;
            targetMinutes.value = targetDays * 24 * 60;
            targetSeconds.value = targetDays * 24 * 60 * 60;
        }

        function hoursConvertion() {
            targetHours = Number(targetHours.value);
            targetDays.value = targetHours / 24;
            targetMinutes.value = targetHours * 60;
            targetSeconds.value = targetHours * 60 * 60;
        }

        function minutesConvertion() {
            targetMinutes = Number(targetMinutes.value);
            targetDays.value = targetMinutes / 1440;
            targetHours.value = targetMinutes / 60;
            targetSeconds.value = targetMinutes * 60;
        }

        function secondsConvertion() {
            targetSeconds = Number(targetSeconds.value);
            targetDays.value = targetSeconds / 86400;
            targetHours.value = targetSeconds / 60 / 60;
            targetMinutes.value = targetSeconds / 60;
        }
    }
</script>
</html>