jQuery.fn.ConfirmDelete = function() {
    return this.on('click', function() {
        var sessionID = $(this).data('sessionid');

        $(this).off('click').parent().empty()
            .append($('<button>', {
                text: locales[(localStorage.getItem('language') !== null ? localStorage.getItem('language') : 'en')]['button_yes'],
                class: 'bttn-simple bttn-xs bttn-primary sessiondeleteconfirm',
                style: 'margin-right: 3px;',
                'data-translation': 'button_yes',
                'data-sessionid': sessionID
            }).on('click', function() {
// Move this out of 'ConfirmDelete()'
                var pressedButton = $(this);
                $(pressedButton).prop('disabled', true).css({
                    'background':	'#999 url(data:image/gif;base64,R0lGODlhEAAQAPIAAJmZmf///7CwsOPj4////9fX18rKysPDwyH+GkNyZWF0ZWQgd2l0aCBhamF4bG9hZC5pbmZvACH5BAAKAAAAIf8LTkVUU0NBUEUyLjADAQAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQACgABACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkEAAoAAgAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkEAAoAAwAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkEAAoABAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQACgAFACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQACgAGACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAAKAAcALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==) no-repeat center',
                    'color':		'transparent',
                    'transform':	'rotateX(180deg)',
                    'cursor':       'default'
                }).next().prop('disabled', true).addClass('disabled');

                $.post("lucidAuth.manage.php", {
                    do: "deletesession",
                    tokenid: sessionID,
                    userid: $(pressedButton).closest('tr').data('userid')
                })
                .done(function(data,_status) {
                    if (data.Result === 'Success') {
                        $(pressedButton).css({
                            'background':	'green url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAaklEQVQ4jeXOMQ5AQBBG4T2BC4i76EWich7ncAKbqCRuodTqnMNTkFgJs3ZU4tXz/Rlj/hUQv8EpMAClFk9sjUAiHVcCnoFMwhZYgPYG575Xe46aIOyMdJx7ji9GwrEzUgOFCu8DkRp/qxU2BKCUyZR6ygAAAABJRU5ErkJggg==) no-repeat center',
                            'transform':	'rotateX(0deg)'
                        });
                        setTimeout(function() {
                            $(pressedButton).closest('tr').fadeOut(500, function() {
                                $(this).remove()});
                        }, 2250);
                    } else {
                        $(pressedButton).css({
        					'background':	'red url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAv0lEQVQ4jaWT0Q3CMAxELwh1BEag87AJ6hcLlE/KBLABrNEV2h26QaXHj4NMGgpS7sfJJXd24kQqRMiRQC3pIKk2apD0DCEMq25ABZyBmSVmW6vWxH1GmKLPmph7xJQReq5dnNmVPQE7oHOCzrhoMts9vQ1OSbYOCBb92OPkDe6ZkqMwJwa4SdJmtS1/YGsx7e9VUiPpYvPG4tHtGUsvcf+RkpI2mkHZQ3ImLd+fcpuKf32meM5R0iOEMOb2F+EF33vgCePVr8UAAAAASUVORK5CYII=) no-repeat center',
                            'transform':	'rotateX(0deg)'
                        });
                        setTimeout(function() {
                            $(pressedButton).closest('td').empty()
                                .append(
                                    $('<button>', {
                                        text: locales[(localStorage.getItem('language') !== null ? localStorage.getItem('language') : 'en')]['button_delete'],
                                        class: 'bttn-simple bttn-xs bttn-primary sessiondelete',
                                        'data-translation': 'button_delete',
                                        'data-sessionid': sessionID
                                    }).ConfirmDelete())
                        }, 2250);
                    }
                });
            }))
            .append($('<button>', {
                text: locales[(localStorage.getItem('language') !== null ? localStorage.getItem('language') : 'en')]['button_no'],
                class: 'bttn-simple bttn-xs bttn-primary sessiondeletecancel',
                'data-translation': 'button_no',
                'data-sessionid': sessionID
            }).on('click', function() {
// Move this out of 'ConfirmDelete()'
                var pressedButton = $(this);
                $(pressedButton).closest('td').empty()
                .append(
                    $('<button>', {
                        text: locales[(localStorage.getItem('language') !== null ? localStorage.getItem('language') : 'en')]['button_delete'],
                        class: 'bttn-simple bttn-xs bttn-primary sessiondelete',
                        'data-translation': 'button_delete',
                        'data-sessionid': sessionID
                    }).ConfirmDelete())
            }))
    });
};

$(document).ready(function(){
    // Initialize the editable-table functionality
    $('#usertable').editableTableWidget();

    // Prevent clicking *through* popup-screens
    $('#sessions').click(function(event) {
        event.stopPropagation();
    });
    
    // Add eventhandlers to buttons
    $('#usertable button.session').click(function() {
        event.stopPropagation();
        $('#sessions tbody').empty();
        $('#sessions').fadeToggle();

        var userID = $(this).closest('tr').find('td:nth-child(1)').data('userid');

        $.post("lucidAuth.manage.php", {
			do: "retrievesessions",
			userid: userID
		})
		.done(function(data,_status) {
			if (data.Result === 'Success') {
                var Sessions = JSON.parse(data.UserSessions);
                for (var i = 0; i < data.SessionCount; i++) {
                    try {
                        var fingerPrint = JSON.parse(atob(Sessions[i]['fp']));
                        var sessionDetails = '<img class="browsericon" src="/images/' + fingerPrint['browser'] + '_256x256.png">';
                        sessionDetails += fingerPrint['browser'] + ' -- ' + fingerPrint['platform'];
                        sessionDetails += '<br>' + fingerPrint['city'] + ' (' + fingerPrint['countrycode'] + ')';
                    } catch(e) {
                        // Do nothing
                    } 
                    $('#sessiontable tbody').append($('<tr>', {
                            'data-userid': userID
                        })
                        .append($('<td>', {
                            text: new Date(Sessions[i]['iat'] * 1000).toLocaleString('en-GB')
                        }))
                        .append($('<td>', {
                            text: Sessions[i]['iss']
                        }))
                        .append($('<td>', {
                            html: sessionDetails ? sessionDetails : ''
                        }))
                        .append($('<td>', {
                            html: $('<button>', {
                                text: locales[(localStorage.getItem('language') !== null ? localStorage.getItem('language') : 'en')]['button_delete'],
                                class: 'bttn-simple bttn-xs bttn-primary sessiondelete',
                                'data-translation': 'button_delete',
                                'data-sessionid': Sessions[i]['tid']})
                        }))
                    );
                }
                $('#sessiontable .sessiondelete').ConfirmDelete();
			} else {
			}
		});
    });
    $('#usertable button.delete').click(function() {
        $(this).closest('tr').addClass('removed');
    });

    $('#btnnewuser').click(function() {
        // Create a new user; generate pseudo-random username
        var newUser = 'User' + String(Math.floor(Math.random() * Math.floor(9999))).padStart(4, '0');

        // Add new user to the interface
        //   (new `<tr>` in `<table id="usertable">`)
        $('#usertable tbody').append($('<tr>', {class: 'new'})
            .append($('<td>', {
                text: newUser
            }))
            .append($('<td>', {
                text: 'User'
            }))
            .append($('<td>', {
                class: 'immutable',
                html: '<button class="bttn-simple bttn-xs bttn-primary disabled" data-translation="button_sessions" disabled="true">' +
                    locales[(localStorage.getItem('language') !== null ? localStorage.getItem('language') : 'en')]['button_sessions'] + '</button>&nbsp;' +
                    '<button class="bttn-simple bttn-xs bttn-primary delete" data-translation="button_delete">' +
                    locales[(localStorage.getItem('language') !== null ? localStorage.getItem('language') : 'en')]['button_delete'] +
                    '</button>'
            }))
        );
        // Call `editableTableWidget()` again to include the newly added `<tr>`
        //   To prevent recreating multiple new editors; reference the already existing `<input>`
        $('#usertable').editableTableWidget({editor: $('#editor')});
        // Add eventhandlers to buttons of newly added `<tr>`
        $('#usertable .new button.session').unbind().click(function() {
            console.log('New user, unlikely to have sessions already, lets do nothing for now');
        });
        $('#usertable .new button.delete').unbind().click(function() {
            $(this).closest('tr').remove();
        });
    });

    $('#btnsave').click(function() {
        var newEntries = [];
        $('#usertable .new').each(function() {
            newEntries.push({
                'userName': $(this).find('td:nth-child(1)').text(),
                'roleName': $(this).find('td:nth-child(2)').text()
            });
        });
        var removedEntries = [];
        $('#usertable .removed').each(function() {
            removedEntries.push({
                'userId':   $(this).find('td:nth-child(1)').data('userid'),
                'userName': $(this).find('td:nth-child(1)').text(),
                'roleName': $(this).find('td:nth-child(2)').text()
            });
        });

console.log({'new': newEntries, 'removed': removedEntries});
/*
        $.post("lucidAuth.manage.php", {
            do: "mutateusers",
            new: newEntries,
            removed: removedEntries
        })
        .done(function(data,_status) {
        }
*/
    });

    $('#btncancel').click(function() {
        window.location.reload();
    });

    $('#linklogout').click(function() {
        console.log('Logging out!');
    });

   	if (localStorage.getItem('theme') !== null) {
		$('#theme').addClass(localStorage.getItem('theme'));
	}

	$('.logo .sub').click(function(event) {
		var classes = ["tablecloth", "weave", "madras", "tartan", "seigaiha"];

		if (event.ctrlKey) {
			var selectedTheme = classes[~~(Math.random()*classes.length)];

			$('#theme').removeClass(classes.join(' ')).addClass(selectedTheme);
			localStorage.setItem('theme', selectedTheme);
		}
		if (event.altKey) {
			$('#theme').removeClass(classes.join(' '));
			localStorage.removeItem('theme');
		}
	});

});

$(document).click(function () {
    $('#sessions').fadeOut();
});