SocialDragon/socialdragon/assets/js/app.js
2017-01-20 15:45:12 +01:00

86 lines
2.6 KiB
JavaScript

//$(document).foundation()
Vue.component('modal', {
template: '#modal-template'
})
var app = new Vue({
delimiters: ['[[', ']]'],
el: '#app, #image-modal',
data: {
mode: state,
items: data,
currentItem: false,
showModal: false
},
created: function () {
window.addEventListener('keyup', this.handleKeyup);
},
methods: {
detailPopup: function (itm, event) {
// `this` inside methods points to the Vue instance
this.currentItem = itm;
this.showModal = true;
},
approveItem: function (id) {
var req = new XMLHttpRequest();
req.addEventListener("load", function () {
console.log("Approved ID " + id);
});
req.open("POST", "/admin/approve/" + id);
req.send();
this.showModal = false;
var index = this.items.indexOf(this.currentItem);
if (index > -1) {
this.items.splice(index, 1);
}
},
rejectItem: function (id) {
var req = new XMLHttpRequest();
req.addEventListener("load", function () {
console.log("Rejected ID " + id);
});
req.open("POST", "/admin/reject/" + id);
req.send();
this.showModal = false;
var index = this.items.indexOf(this.currentItem);
if (index > -1) {
this.items.splice(index, 1);
}
},
handleKeyup: function (event) {
if (this.showModal) {
enter = 13;
backspace = 8;
remove = 46;
esc = 27;
if (event.keyCode === enter) {
if (this.mode === 1) {
return;
}
this.approveItem(this.currentItem.ID);
} else if (event.keyCode === backspace || event.keyCode === remove) {
if (this.mode === 2) {
return;
}
this.rejectItem(this.currentItem.ID);
} else if (event.keyCode === esc) {
this.showModal = false;
}
}
}
}
})
var exampleSocket = new WebSocket("ws://127.0.0.1:8000/ws");
exampleSocket.onopen = function (event) {
console.log("WS: Connection open!");
console.log("Proto: " + exampleSocket.protocol);
};
exampleSocket.onmessage = function (event) {
item = JSON.parse(event.data);
if (item.State === state) {
app.items.push(item);
}
}