const btnSuchen = document.getElementById('search');
const btnLoeschenKey = document.getElementById('delete_key');
const btnAllesLoeschen = document.getElementById('delete_all');


auslesen();

function getLocalStorageKey(index) {
    return window.localStorage.key(index);
}

function getLocalStorageItem(key) {
    return window.localStorage.getItem(key);
}

function deleteLocalStorageItem(key) {
    return window.localStorage.removeItem(key);
}

function getLocalStorageLength() {
    return window.localStorage.length;
}

function auslesen() {

    var count = getLocalStorageLength();
    var displayData = document.getElementById('data');
    displayData.innerHTML = "";
    if (typeof(Storage) !== "undefined") {
        for (let i=0; i<count; i++) {
            var keyname = getLocalStorageKey(i);
            var data = getLocalStorageItem(keyname);
            displayData.innerHTML += "<dt>" + keyname+"</dt>" + "<dd>" + data + "</dd>";
        }
    } else {
        displayData.innerHTML = "Entschuldigung, Ihr Browser unterstützt nicht Web Storage...";
    }
}

function finden() {

    var keyname = document.getElementById('inputKey').value;
    var givenKey = document.getElementById('givenKey');
    var notice = document.getElementById('notice');
    givenKey.innerHTML = "";
    notice.innerHTML = "";
    var data = getLocalStorageItem(keyname);
    givenKey.innerHTML = keyname;
    notice.innerHTML = data; 
    
}


function loeschen() {
    var key = document.getElementById('key').value;
	deleteLocalStorageItem(key);
}

function allesLoeschen() {
	window.localStorage.clear();
}

btnSuchen.addEventListener('click',  e => {
    finden()});

btnLoeschenKey.addEventListener('click',  e => {
    loeschen()});

btnAllesLoeschen.addEventListener('click',  e => {
    allesLoeschen()});