summaryrefslogtreecommitdiff
path: root/www/src
diff options
context:
space:
mode:
Diffstat (limited to 'www/src')
-rw-r--r--www/src/app.js68
-rw-r--r--www/src/buttonList.vue19
-rw-r--r--www/src/request.js49
3 files changed, 136 insertions, 0 deletions
diff --git a/www/src/app.js b/www/src/app.js
new file mode 100644
index 0000000..214572c
--- /dev/null
+++ b/www/src/app.js
@@ -0,0 +1,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);
+});
+
diff --git a/www/src/buttonList.vue b/www/src/buttonList.vue
new file mode 100644
index 0000000..80cfea9
--- /dev/null
+++ b/www/src/buttonList.vue
@@ -0,0 +1,19 @@
+<template>
+ <tr v-if="!ready">
+ <td colspan="3"><i class="fa fa-spinner fa-spin"></i>
+ </tr>
+
+ <tr v-for="(button, index) in buttons" v-show="ready">
+ <td>{{ button.id }} <button v-on:click="remove(index)">delete</button></td>
+ <td>
+ <select v-model="button.status" v-on:change="update(index)">
+ <option value="0">Inventory</option>
+ <option value="1">Active</option>
+ <option>2</option>
+ <option>3</option>
+ <option>4</option>
+ </select>
+ </td>
+ <td>{{ button.last_pressed }}</td>
+ </tr>
+</template>
diff --git a/www/src/request.js b/www/src/request.js
new file mode 100644
index 0000000..68ec8c3
--- /dev/null
+++ b/www/src/request.js
@@ -0,0 +1,49 @@
+module.exports = (api) => {
+ // Default request options
+ var defaults = {
+ headers: {
+ accept: 'application/json'
+ }
+ };
+
+ // Helper for constructing url
+ var url = (thing) => {
+ return api + thing;
+ };
+
+ var _fetch = (thing, data, options) => {
+ // Merge defaults with options
+ options = Object.assign({}, defaults, options);
+
+ // data is only allowed for POST and PUT
+ if (data) {
+ options.body = new FormData();
+
+ for (var k in data) {
+ options.body.set(k, data[k]);
+ }
+ }
+
+ return fetch(url(thing), options);
+ };
+
+ // GET/POST/DELETE/PUT helpers
+ // These helpers extend the defaults that get passed to fetch()
+ return {
+ get: (thing) => {
+ return _fetch(thing, null, {method: 'GET'});
+ },
+
+ post: (thing, data) => {
+ return _fetch(thing, data, {method: 'POST'});
+ },
+
+ put: (thing, data) => {
+ return _fetch(thing, data, {method: 'PUT'});
+ },
+
+ delete: (thing, data) => {
+ return _fetch(thing, data, {method: 'DELETE'});
+ }
+ };
+};