www/src/app.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68

//const Vue = require('vue');
//const buttonList = require('./buttonList.vue');
const r = require('./request.js')('/v1');

function create() {
    this.ready = false;
    r.post('/button').then(response => {
        if (response.ok) {
            response.json().then(button => {
                this.buttons.push(button);
                this.ready = true;
            });
        }
    });
}

function update(index) {
    var button = this.buttons[index];

    this.ready = false;
    r.put('/button', button).then(() => {
        this.ready = true;
    });
}

function remove(index) {
    var button = this.buttons[index];

    this.ready = false;
    r.delete('/button', button).then(response => {
        if (response.ok) {
            response.json().then(() => {
                this.buttons.splice(index, 1);
                this.ready = true;
            });
        }
    });
}

const $app = new Vue({
    el: '#container',
    data: {
        ready: false,
        buttons: []
    },
    methods: {
        create,
        remove,
        update
    }
});

// GET /button
r.get('/button').then(response => {
    if (response.ok) {
        return response.json();
    }

    throw new Error(response.status);

}).then(data => {
    $app.buttons = data;
    $app.ready = true;

}).catch(err => {
    console.log('Request failed with error:', err.message);
});