94 lines
2.2 KiB
JavaScript
94 lines
2.2 KiB
JavaScript
|
var curList;
|
||
|
|
|
||
|
|
function getUrlListId() {
|
||
|
|
var hash = window.location.hash;
|
||
|
|
if (hash.length == 0) {
|
||
|
|
return undefined;
|
||
|
|
} else {
|
||
|
|
return hash.substr(1, hash.length);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function enableEditMode() {
|
||
|
|
if (curList) {
|
||
|
|
$('#listData').html(curList.data);
|
||
|
|
}
|
||
|
|
$('#listData').show(250);
|
||
|
|
$('#cancelButton').show(250);
|
||
|
|
$('#editButton').hide(250);
|
||
|
|
$('#saveButton').show(250);
|
||
|
|
}
|
||
|
|
|
||
|
|
function disableEditMode() {
|
||
|
|
$('#listData').hide();
|
||
|
|
$('#cancelButton').hide();
|
||
|
|
$('#editButton').show();
|
||
|
|
$('#saveButton').hide();
|
||
|
|
}
|
||
|
|
|
||
|
|
function triggerSelect(listId) {
|
||
|
|
console.debug('Switch selection to list ' + listId);
|
||
|
|
disableEditMode();
|
||
|
|
if (curList) {
|
||
|
|
$('.nav-link[data-list-id="' + curList.id + '"]').removeClass('active');
|
||
|
|
}
|
||
|
|
$('.nav-link[data-list-id="' + listId + '"]').addClass('active');
|
||
|
|
|
||
|
|
$.ajax({
|
||
|
|
url: '/lists/' + listId,
|
||
|
|
headers: { 'Accept': 'text/html' }
|
||
|
|
}).done(function(html) { $('#listHtml').html(html); });
|
||
|
|
$.ajax({
|
||
|
|
url: '/lists/' + listId,
|
||
|
|
headers: { 'Accept': 'application/json' }
|
||
|
|
}).done(function(list) {
|
||
|
|
curList = list;
|
||
|
|
$('#listName').text('Lijst van ' + list.name)
|
||
|
|
$('#listUpdatedAt').text('Laaste aanpassing op: FIXME');
|
||
|
|
$('#listData').html(list.data);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function triggerUpdate(listId, data) {
|
||
|
|
console.debug('Triggering HTML update for list ' + listId + ', data: ' + data);
|
||
|
|
}
|
||
|
|
|
||
|
|
function saveUpdate(listId, data) {
|
||
|
|
console.debug('Saving data update for list ' + listId);
|
||
|
|
disableEditMode();
|
||
|
|
curList.data = data;
|
||
|
|
$.ajax({
|
||
|
|
method: 'PUT',
|
||
|
|
url: '/lists/' + listId,
|
||
|
|
headers: { 'Content-Type': 'application/json' },
|
||
|
|
data: JSON.stringify(curList)
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
$(function() {
|
||
|
|
$('#cancelButton').on('click', function() { disableEditMode(); });
|
||
|
|
|
||
|
|
$('#editButton').on('click', function() { enableEditMode(); });
|
||
|
|
|
||
|
|
$('#saveButton').on('click', function() {
|
||
|
|
data = $('#listData').text();
|
||
|
|
saveUpdate(curList.id, data);
|
||
|
|
});
|
||
|
|
|
||
|
|
$('#listData').on('input', function() {
|
||
|
|
data = $(this).text();
|
||
|
|
triggerUpdate(curList.id, data);
|
||
|
|
});
|
||
|
|
|
||
|
|
$('.listSelect').on('click', function() {
|
||
|
|
listId = $(this).data("list-id");
|
||
|
|
triggerSelect(listId);
|
||
|
|
});
|
||
|
|
|
||
|
|
var listId = getUrlListId();
|
||
|
|
if (listId) {
|
||
|
|
triggerSelect(getUrlListId());
|
||
|
|
}
|
||
|
|
disableEditMode();
|
||
|
|
});
|