function create(type){
    return document.createElement(type);
}

function getTags(){
    const params = query();
    return params.get('tags');
}

async function handleData(response){
    if (response.ok){
        var json = await response.json();
        var tags = getTags();
        if (!tags) showcase(json);
        var list = tag('eventlist');
        for (var event of json){
            var div = create('div');
            div.innerHTML = event.description;
            div.setAttribute('class','event');
            if (event.attachments){
                for (var attachment of event.attachments){
                    if (attachment.mime.startsWith('image')){
                        var img = create('img');
                        img.src = attachment.url;
                        div.prepend(img);
                        break;
                    }
                }
            }
            var h4 = create('h4');
            h4.innerHTML = event.url ? `<a href="${event.url}" target="_blank">${event.title}</a>` : event.title;
            div.prepend(h4);
            eventlist.appendChild(div);
        }
    }
}

function hide(id){
    var elem = tag(id);
    elem.style.display = 'none';
}

function load(){
    var tags = getTags();
    if (!tags) {
        tags = 'schwarzesjena';
    } else {
        hide('showcase');
        tag('eventlist').innerHTML = "<h3>Events</h3>";
    }
    fetch('https://cal.srsoftware.de/api/events/json?tags='+tags).then(handleData);
}

function query(){
    return new URLSearchParams(location.search);
}

function show(id){
    var elem = tag(id);
    elem.style.display = '';
}

function showcase(json){
    var div = tag('showcase');
    for (var event of json){
        if (event.attachments){
            for (var attachment of event.attachments){
                if (attachment.mime.startsWith('image')){
                    var img = create('img');
                    img.src = attachment.url;
                    if (event.url){
                        var a = create('a');
                        a.href = event.url;
                        a.target = '_blank';
                        a.appendChild(img);
                        div.appendChild(a);
                    } else div.appendChild(img);
                    break;
                }
            }
        }
    }
}

function tag(id){
    return document.getElementById(id);
}