<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="script.js" defer></script>
</head>
<body>
    <h1 id="asd" onclick="szovegcsere(this)"></h1>
    <button id="gomb">Kattints ide!</button>
    <p id="azonosito"></p>
    <form>
        Add meg a TAJ számod: <input type="text" id="azonosito2" oninput="keylogger()"><br>
        Add meg a neved: <input type="text" id="azonosito3" oninput="nagybetus()"><br>
        Add meg a jelszavad: <input type="text" id="azonosito4" onchange="nagybetus_2()">
    </form>
    <p id="kurzor" onmouseover="changeText()" onmouseout="resetText()" >Vidd ide az egeret!</p>


        <button id="kurz" onmousedown="mouseDown()" onmouseup="mouseUp()" onclick="mouseClick()">ASD</button>
    
    <p id="kurzor2">ASD</p>
    
    <button id="button2">ASDASDSDDS</button>

    <button id="szin">SZÍNCSERE</button>
    
    <script>
        document.getElementById("szin").addEventListener("click", szincsere);

        function szincsere() {
            
            if (document.body.style.backgroundColor != "yellow"){
                document.body.style.backgroundColor = "yellow";
            } else {
                document.body.style.backgroundColor = "purple";
            }
        }

        document.getElementById("button2").addEventListener("click", mouseClick);

        function mouseDown() {
            document.getElementById("kurzor2").innerHTML = "Egér lenyomva";
        }
        function mouseUp() {
            document.getElementById("kurzor2").innerHTML = "Egér felengedve";
        }
        function mouseClick() {
            document.getElementById("kurzor2").innerHTML = "Kattintás";
        }
        function changeText() {
            document.getElementById("kurzor").innerHTML = "A kurzor itt van!";
        }
        function resetText() {
            document.getElementById("kurzor").innerHTML = "Húzd ide a kurzort!";
        }

        function keylogger() {
            console.log(document.getElementById("azonosito2").value);
        }
        function nagybetus(){
            const x = document.getElementById("azonosito3");
            x.value = x.value.toUpperCase();
        }
        function nagybetus_2(){
            const x = document.getElementById("azonosito4");
            x.value = x.value.toUpperCase();
        }

        function szovegcsere(id){
            document.getElementById(id).innerHTML = "Ez lesz az új szöveg";
        }

        
        document.getElementById("gomb").onclick = function () {
            szovegcsere("asd");
        }
        

        //document.getElementById("gomb").onclick = szovegcsere("asd");
        window.onload = function() {
            document.getElementById("azonosito").innerHTML = "Az oldal betöltődött!";
        };

        window.onunload = function()  {
            console.log("asd");
        };
    </script>
</body>
</html>