From df84659cdb30f1070d4f44251d042b5bdc95cbd3 Mon Sep 17 00:00:00 2001 From: Meutel Date: Fri, 30 Dec 2016 18:18:11 +0100 Subject: [PATCH] Display books --- index.html | 17 ++++++++- index.js | 102 +++++++++++------------------------------------------ 2 files changed, 36 insertions(+), 83 deletions(-) diff --git a/index.html b/index.html index ebcc0e0..e49e45e 100644 --- a/index.html +++ b/index.html @@ -13,7 +13,22 @@

Bouquins

-
{{ message }}
+
+

{{ booksCount }} books

+ + + + + + + + +
{{ book.id }}{{ book.title }}{{ book.series ? book.series.name : '' }}{{ book.series ? book.series.idx : '' }} + +
+
diff --git a/index.js b/index.js index 90e5464..fb2f1d9 100644 --- a/index.js +++ b/index.js @@ -1,42 +1,23 @@ -/* $Id$ */ -/* - * Copyright (c) 2016 Kristaps Dzonsons - * - * Permission to use, copy, modify, and distribute this software for any - * purpose with or without fee is hereby granted, provided that the above - * copyright notice and this permission notice appear in all copies. - * - * THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES - * WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF - * MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR - * ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES - * WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN - * ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF - * OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. - */ (function(root) { 'use strict'; - /* - * Send a GET query to the give url. - * Invokes "setup" before running anything, "error" upon network - * error (with the HTTP error code and response text), and - * success with the response text on 200. - */ - function sendQuery(url, setup, error, success) + function sendQuery(url, error, success) { var xmh = new XMLHttpRequest(); var v; - if (null !== setup) - setup(); - xmh.onreadystatechange = function() { v = xmh.responseText; - if (xmh.readyState === 4 && - xmh.status === 200) { + if (xmh.readyState === 4 && xmh.status === 200) { + var res; + try { + res = JSON.parse(v); + } catch (err) { + if (null !== error) + error(err.name, err.message); + } if (null !== success) - success(v); + success(res); } else if (xmh.readyState === 4) { if (null !== error) error(xmh.status, v); @@ -47,72 +28,29 @@ xmh.send(null); } - /* - * Send a POST query to the give url with the form. - * Invokes "setup" before running anything (given the form), - * "error" upon network error (with the form, HTTP error code, - * and response text), and success with the form and response - * text on 200. - */ - function sendForm(form, setup, error, success) - { - var xmh = new XMLHttpRequest(); - var v; - - if (null !== setup) - setup(form); - - xmh.onreadystatechange=function() { - v = xmh.responseText; - if (xmh.readyState === 4 && - xmh.status === 200) { - if (null !== success) - success(form, v); - } else if (xmh.readyState === 4) { - if (null !== error) - error(form, xmh.status, v); - } - }; - - xmh.open(form.method, form.action, true); - xmh.send(new FormData(form)); - return(false); - } - function stdError(code, resp) { - console.log("ERREUR " + code + ": " + resp); + console.log('ERROR ' + code + ': ' + resp); } function indexSuccess(resp) { - var res; - - try { - res = JSON.parse(resp); - } catch (error) { - console.log('JSON parse fail: ' + resp); - return(null); - } - app.message = res.length + " books"; + app.books = resp; + app.booksCount = app.books.length; } - /* - * Configure the index page. - */ - function loadIndex() - { - sendQuery('cgi-bin/bouquins/books', - null, stdError, indexSuccess); + function loadIndex() { + sendQuery('cgi-bin/bouquins/books', stdError, indexSuccess); } root.loadIndex = loadIndex; })(this); -document.addEventListener('DOMContentLoaded', function() { - loadIndex(); -}); var app = new Vue({ el: '#app', data: { - message: 'Hello Vue!' + books: [], + booksCount: 0 + }, + mounted: function() { + loadIndex(); } })