let url = "https://jsonplaceholder.typicode.com/posts/";

class Bejegyzes{
    constructor(id, title, body){
        this.id = id;
        this.title = title;
        this.body = body;
    }

    getRészletek(){
        return `A post id-ja:${this.id}\nA post Címe:${this.title}\nA post tartalma:${this.body}\n`;
    }
}

class BejegyzesLista{
    bejegyzesek = [];

    hozzadBejegyzest(bejegyzes){
        this.bejegyzesek.push(bejegyzes);
    }

    megjelenitBejegyzesek(){    
        this.bejegyzesek.forEach(element => {
            BejegyzesToDomElement(element);
        });
    }
}

async function fetchAdatok(apiUrl){
    try{
        let response = await fetch(apiUrl);
        let data = await response.json();

        data.forEach(element => {
            //console.log(element);
            //JsonElementToDomElement(element);
            let bejegyzes = new Bejegyzes(element.id, element.title, element.body);
            //console.log(bejegyzes);
            console.log(bejegyzes.getRészletek());
            osszesBejegyzes.hozzadBejegyzest(bejegyzes);
        });
        osszesBejegyzes.megjelenitBejegyzesek();
    } catch (error){
        console.log(error);
        alert("Hiba Történt!");
    }
}

async function BejegyzesToDomElement(element){
    let newDomElement = document.createElement("div");
    newDomElement.innerHTML = `<h2>${element.title}</h2>`; 
    newDomElement.innerHTML += `<p>${element.body}</p>`;
    mainDomElement.appendChild(newDomElement);
}

let osszesBejegyzes = new BejegyzesLista();
let mainDomElement = document.getElementById("eredmeny");
fetchAdatok(url);