grim/devweb

Get the frontend basically working
draft
2021-01-21, Gary Kramlich
5a021b20c342
Parents b13a68a17e1d
Children e353488963e3
Get the frontend basically working
9 files changed, 380 insertions(+), 153 deletions(-)
  • +235 -133
    frontend/package-lock.json
  • +11 -5
    frontend/package.json
  • +2 -2
    frontend/public/index.html
  • +7 -9
    frontend/src/App.vue
  • +34 -0
    frontend/src/components/BookList.vue
  • +19 -0
    frontend/src/components/Contents.vue
  • +8 -4
    frontend/src/components/Navigation.vue
  • +55 -0
    frontend/src/components/Viewer.vue
  • +9 -0
    frontend/src/main.js
    • --- a/frontend/package-lock.json Sun Jan 17 05:37:28 2021 -0600
    +++ b/frontend/package-lock.json Thu Jan 21 11:42:13 2021 -0600
    @@ -1090,14 +1090,64 @@
    "dev": true
    },
    "@nuxt/opencollective": {
    - "version": "0.3.0",
    - "resolved": "https://registry.npmjs.org/@nuxt/opencollective/-/opencollective-0.3.0.tgz",
    - "integrity": "sha512-Vf09BxCdj1iT2IRqVwX5snaY2WCTkvM0O4cWWSO1ThCFuc4if0Q/nNwAgCxRU0FeYHJ7DdyMUNSdswCLKlVqeg==",
    - "requires": {
    - "chalk": "^2.4.2",
    - "consola": "^2.10.1",
    - "node-fetch": "^2.6.0"
    - }
    + "version": "0.3.2",
    + "resolved": "https://registry.npmjs.org/@nuxt/opencollective/-/opencollective-0.3.2.tgz",
    + "integrity": "sha512-XG7rUdXG9fcafu9KTDIYjJSkRO38EwjlKYIb5TQ/0WDbiTUTtUtgncMscKOYzfsY86kGs05pAuMOR+3Fi0aN3A==",
    + "requires": {
    + "chalk": "^4.1.0",
    + "consola": "^2.15.0",
    + "node-fetch": "^2.6.1"
    + },
    + "dependencies": {
    + "ansi-styles": {
    + "version": "4.3.0",
    + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
    + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
    + "requires": {
    + "color-convert": "^2.0.1"
    + }
    + },
    + "chalk": {
    + "version": "4.1.0",
    + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
    + "integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
    + "requires": {
    + "ansi-styles": "^4.1.0",
    + "supports-color": "^7.1.0"
    + }
    + },
    + "color-convert": {
    + "version": "2.0.1",
    + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
    + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
    + "requires": {
    + "color-name": "~1.1.4"
    + }
    + },
    + "color-name": {
    + "version": "1.1.4",
    + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
    + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
    + },
    + "has-flag": {
    + "version": "4.0.0",
    + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
    + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ=="
    + },
    + "supports-color": {
    + "version": "7.2.0",
    + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
    + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
    + "requires": {
    + "has-flag": "^4.0.0"
    + }
    + }
    + }
    + },
    + "@popperjs/core": {
    + "version": "2.6.0",
    + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.6.0.tgz",
    + "integrity": "sha512-cPqjjzuFWNK3BSKLm0abspP0sp/IGOli4p5I5fKFAzdS8fvjdOwDCfZqAaIiXd9lPkOWi3SUUfZof3hEb7J/uw=="
    },
    "@soda/friendly-errors-webpack-plugin": {
    "version": "1.7.1",
    @@ -1978,6 +2028,7 @@
    "version": "3.2.1",
    "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
    "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
    + "dev": true,
    "requires": {
    "color-convert": "^1.9.0"
    }
    @@ -2198,6 +2249,14 @@
    "integrity": "sha512-3YDiu347mtVtjpyV3u5kVqQLP242c06zwDOgpeRnybmXlYYsLbtTrUBUm8i8srONt+FWobl5aibnU1030PeeuA==",
    "dev": true
    },
    + "axios": {
    + "version": "0.21.1",
    + "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
    + "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
    + "requires": {
    + "follow-redirects": "^1.10.0"
    + }
    + },
    "babel-eslint": {
    "version": "10.1.0",
    "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz",
    @@ -2423,20 +2482,27 @@
    "dev": true
    },
    "bootstrap": {
    - "version": "4.5.0",
    - "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.0.tgz",
    - "integrity": "sha512-Z93QoXvodoVslA+PWNdk23Hze4RBYIkpb5h8I2HY2Tu2h7A0LpAgLcyrhrSUyo2/Oxm2l1fRZPs1e5hnxnliXA=="
    + "version": "4.5.3",
    + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.3.tgz",
    + "integrity": "sha512-o9ppKQioXGqhw8Z7mah6KdTYpNQY//tipnkxppWhPbiSWdD+1raYsnhwEZjkTHYbGee4cVQ0Rx65EhOY/HNLcQ=="
    },
    "bootstrap-vue": {
    - "version": "2.15.0",
    - "resolved": "https://registry.npmjs.org/bootstrap-vue/-/bootstrap-vue-2.15.0.tgz",
    - "integrity": "sha512-ncxWkDG0mKFVot314wWKJELi+ESO7k6ngV//qvJFs9iVzlFI8Hx3rBVbpcPW2vrJ+0vitH8N2SOwn4fdQ3frMQ==",
    - "requires": {
    - "@nuxt/opencollective": "^0.3.0",
    - "bootstrap": ">=4.5.0 <5.0.0",
    + "version": "2.21.2",
    + "resolved": "https://registry.npmjs.org/bootstrap-vue/-/bootstrap-vue-2.21.2.tgz",
    + "integrity": "sha512-0Exe+4MZysqhZNXIKf4TzkvXaupxh9EHsoCRez0o5Dc0J7rlafayOEwql63qXv74CgZO8E4U8ugRNJko1vMvNw==",
    + "requires": {
    + "@nuxt/opencollective": "^0.3.2",
    + "bootstrap": ">=4.5.3 <5.0.0",
    "popper.js": "^1.16.1",
    "portal-vue": "^2.1.7",
    "vue-functional-data-merge": "^3.1.0"
    + },
    + "dependencies": {
    + "bootstrap": {
    + "version": "4.5.3",
    + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.3.tgz",
    + "integrity": "sha512-o9ppKQioXGqhw8Z7mah6KdTYpNQY//tipnkxppWhPbiSWdD+1raYsnhwEZjkTHYbGee4cVQ0Rx65EhOY/HNLcQ=="
    + }
    }
    },
    "brace-expansion": {
    @@ -2768,6 +2834,16 @@
    }
    }
    },
    + "call-bind": {
    + "version": "1.0.2",
    + "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.2.tgz",
    + "integrity": "sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==",
    + "dev": true,
    + "requires": {
    + "function-bind": "^1.1.1",
    + "get-intrinsic": "^1.0.2"
    + }
    + },
    "call-me-maybe": {
    "version": "1.0.1",
    "resolved": "https://registry.npmjs.org/call-me-maybe/-/call-me-maybe-1.0.1.tgz",
    @@ -2848,6 +2924,7 @@
    "version": "2.4.2",
    "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
    "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
    + "dev": true,
    "requires": {
    "ansi-styles": "^3.2.1",
    "escape-string-regexp": "^1.0.5",
    @@ -3204,6 +3281,7 @@
    "version": "1.9.3",
    "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
    "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
    + "dev": true,
    "requires": {
    "color-name": "1.1.3"
    }
    @@ -3211,7 +3289,8 @@
    "color-name": {
    "version": "1.1.3",
    "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
    - "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
    + "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
    + "dev": true
    },
    "color-string": {
    "version": "1.5.3",
    @@ -3335,9 +3414,9 @@
    "dev": true
    },
    "consola": {
    - "version": "2.14.0",
    - "resolved": "https://registry.npmjs.org/consola/-/consola-2.14.0.tgz",
    - "integrity": "sha512-A2j1x4u8d6SIVikhZROfpFJxQZie+cZOfQMyI/tu2+hWXe8iAv7R6FW6s6x04/7zBCst94lPddztot/d6GJiuQ=="
    + "version": "2.15.0",
    + "resolved": "https://registry.npmjs.org/consola/-/consola-2.15.0.tgz",
    + "integrity": "sha512-vlcSGgdYS26mPf7qNi+dCisbhiyDnrN1zaRbw3CSuc2wGOMEGGPsp46PdRG5gqXwgtJfjxDkxRNAgRPr1B77vQ=="
    },
    "console-browserify": {
    "version": "1.2.0",
    @@ -3417,9 +3496,9 @@
    "dev": true
    },
    "copy-webpack-plugin": {
    - "version": "5.1.1",
    - "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-5.1.1.tgz",
    - "integrity": "sha512-P15M5ZC8dyCjQHWwd4Ia/dm0SgVvZJMYeykVIVYXbGyqO4dWB5oyPHp9i7wjwo5LhtlhKbiBCdS2NvM07Wlybg==",
    + "version": "5.1.2",
    + "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-5.1.2.tgz",
    + "integrity": "sha512-Uh7crJAco3AjBvgAy9Z75CjK8IG+gxaErro71THQ+vv/bl4HaQcpkexAY8KVW/T6D2W2IRr+couF/knIRkZMIQ==",
    "dev": true,
    "requires": {
    "cacache": "^12.0.3",
    @@ -3432,7 +3511,7 @@
    "normalize-path": "^3.0.0",
    "p-limit": "^2.2.1",
    "schema-utils": "^1.0.0",
    - "serialize-javascript": "^2.1.2",
    + "serialize-javascript": "^4.0.0",
    "webpack-log": "^2.0.0"
    },
    "dependencies": {
    @@ -3495,10 +3574,13 @@
    }
    },
    "serialize-javascript": {
    - "version": "2.1.2",
    - "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-2.1.2.tgz",
    - "integrity": "sha512-rs9OggEUF0V4jUSecXazOYsLfu7OGK2qIn3c7IPBiffz32XniEp/TX9Xmc9LQfK2nQ2QKHvZ2oygKUGU0lG4jQ==",
    - "dev": true
    + "version": "4.0.0",
    + "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-4.0.0.tgz",
    + "integrity": "sha512-GaNA54380uFefWghODBWEGisLZFj00nS5ACs6yHa9nLqlLpVLO8ChDGeKRjZnV4Nh4n0Qi7nhYZD/9fCPzEqkw==",
    + "dev": true,
    + "requires": {
    + "randombytes": "^2.1.0"
    + }
    },
    "slash": {
    "version": "1.0.0",
    @@ -3509,9 +3591,9 @@
    }
    },
    "core-js": {
    - "version": "3.6.5",
    - "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.5.tgz",
    - "integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA=="
    + "version": "3.8.2",
    + "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.8.2.tgz",
    + "integrity": "sha512-FfApuSRgrR6G5s58casCBd9M2k+4ikuu4wbW6pJyYU7bd9zvFc9qf7vr5xmrZOhT9nn+8uwlH1oRR9jTnFoA3A=="
    },
    "core-js-compat": {
    "version": "3.6.5",
    @@ -4515,7 +4597,8 @@
    "escape-string-regexp": {
    "version": "1.0.5",
    "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
    - "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
    + "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
    + "dev": true
    },
    "eslint": {
    "version": "6.8.0",
    @@ -4751,9 +4834,9 @@
    "dev": true
    },
    "eventemitter3": {
    - "version": "4.0.4",
    - "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.4.tgz",
    - "integrity": "sha512-rlaVLnVxtxvoyLsQQFBx53YmXHDxRIzzTLbdfxqi4yocpSjAxXwkU0cScM5JgSKMqEhrZpnvQ2D9gjylR0AimQ==",
    + "version": "4.0.7",
    + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
    + "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==",
    "dev": true
    },
    "events": {
    @@ -5072,9 +5155,9 @@
    "dev": true
    },
    "faye-websocket": {
    - "version": "0.10.0",
    - "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
    - "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ=",
    + "version": "0.11.3",
    + "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.3.tgz",
    + "integrity": "sha512-D2y4bovYpzziGgbHYtGCMjlJM36vAl/y+xUyn1C+FVx8szd1E+86KwVw6XvYSzOP8iMpm1X0I4xJD+QtUb36OA==",
    "dev": true,
    "requires": {
    "websocket-driver": ">=0.5.1"
    @@ -5253,8 +5336,7 @@
    "follow-redirects": {
    "version": "1.12.1",
    "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.12.1.tgz",
    - "integrity": "sha512-tmRv0AVuR7ZyouUHLeNSiO6pqulF7dYa3s19c6t+wz9LD69/uSzdMxJ2S91nTI9U3rt/IldxpzMOFejp6f0hjg==",
    - "dev": true
    + "integrity": "sha512-tmRv0AVuR7ZyouUHLeNSiO6pqulF7dYa3s19c6t+wz9LD69/uSzdMxJ2S91nTI9U3rt/IldxpzMOFejp6f0hjg=="
    },
    "for-in": {
    "version": "1.0.2",
    @@ -5379,6 +5461,17 @@
    "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
    "dev": true
    },
    + "get-intrinsic": {
    + "version": "1.0.2",
    + "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.0.2.tgz",
    + "integrity": "sha512-aeX0vrFm21ILl3+JpFFRNe9aUvp6VFZb2/CTbgLb8j75kOhvoNYjt9d8KA/tJG4gSo8nzEDedRl0h7vDmBYRVg==",
    + "dev": true,
    + "requires": {
    + "function-bind": "^1.1.1",
    + "has": "^1.0.3",
    + "has-symbols": "^1.0.1"
    + }
    + },
    "get-stream": {
    "version": "4.1.0",
    "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz",
    @@ -5521,7 +5614,8 @@
    "has-flag": {
    "version": "3.0.0",
    "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
    - "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0="
    + "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
    + "dev": true
    },
    "has-symbols": {
    "version": "1.0.1",
    @@ -5679,9 +5773,9 @@
    "dev": true
    },
    "html-entities": {
    - "version": "1.3.1",
    - "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.3.1.tgz",
    - "integrity": "sha512-rhE/4Z3hIhzHAUKbW8jVcCyuT5oJCXXqhN/6mXXVCpzTmvJnoH2HL/bt3EZ6p55jbFJBeAe1ZNpL5BugLujxNA==",
    + "version": "1.4.0",
    + "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.4.0.tgz",
    + "integrity": "sha512-8nxjcBcd8wovbeKx7h3wTji4e6+rhaVuPNpMqwWgnHh+N9ToqsCs6XztWRBPQ+UtzsoMAdKZtUENoVzU/EMtZA==",
    "dev": true
    },
    "html-minifier": {
    @@ -5830,6 +5924,12 @@
    }
    }
    },
    + "http-parser-js": {
    + "version": "0.5.3",
    + "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.3.tgz",
    + "integrity": "sha512-t7hjvef/5HEK7RWTdUzVUhl8zkEu+LlaE0IYzdMuvbSDipxBRpOn4Uhw8ZyECEa808iVT8XCjzo6xmYt4CiLZg==",
    + "dev": true
    + },
    "http-proxy": {
    "version": "1.18.1",
    "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
    @@ -6173,10 +6273,13 @@
    }
    },
    "is-arguments": {
    - "version": "1.0.4",
    - "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.0.4.tgz",
    - "integrity": "sha512-xPh0Rmt8NE65sNzvyUmWgI1tz3mKq74lGA0mL8LYZcoIzKOzDh6HmrYm3d18k60nHerC8A9Km8kYu87zfSFnLA==",
    - "dev": true
    + "version": "1.1.0",
    + "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.1.0.tgz",
    + "integrity": "sha512-1Ij4lOMPl/xB5kBDn7I+b2ttPMKa8szhEIrXDuXQD/oe3HJLTLhqhgGspwgyGd6MOywBUqVvYicF72lkgDnIHg==",
    + "dev": true,
    + "requires": {
    + "call-bind": "^1.0.0"
    + }
    },
    "is-arrayish": {
    "version": "0.2.1",
    @@ -6810,9 +6913,9 @@
    }
    },
    "loglevel": {
    - "version": "1.6.8",
    - "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.6.8.tgz",
    - "integrity": "sha512-bsU7+gc9AJ2SqpzxwU3+1fedl8zAntbtC5XYlt3s2j1hJcn2PsXSmgN8TaLG/J1/2mod4+cE/3vNL70/c1RNCA==",
    + "version": "1.7.1",
    + "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.7.1.tgz",
    + "integrity": "sha512-Hesni4s5UkWkwCGJMQGAh71PaLUmKFM60dHvq0zi/vDhhrzuk+4GgNbTXJ12YYQJn6ZKBDNIjYcuQGKudvqrIw==",
    "dev": true
    },
    "loose-envify": {
    @@ -7266,14 +7369,14 @@
    }
    },
    "node-fetch": {
    - "version": "2.6.0",
    - "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz",
    - "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA=="
    + "version": "2.6.1",
    + "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.1.tgz",
    + "integrity": "sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw=="
    },
    "node-forge": {
    - "version": "0.9.0",
    - "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.9.0.tgz",
    - "integrity": "sha512-7ASaDa3pD+lJ3WvXFsxekJQelBKRpne+GOVbLbtHYdd7pFspyeuJHnWfLplGf3SwKGbfs/aYl5V/JCIaHVUKKQ==",
    + "version": "0.10.0",
    + "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz",
    + "integrity": "sha512-PPmu8eEeG9saEUvI97fm4OYxXVB6bFvyNTyiUOBichBpFG8A1Ljw3bY62+5oOjDEMHRnd0Y7HQ+x7uzxOzC6JA==",
    "dev": true
    },
    "node-ipc": {
    @@ -7442,13 +7545,13 @@
    "dev": true
    },
    "object-is": {
    - "version": "1.1.2",
    - "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.2.tgz",
    - "integrity": "sha512-5lHCz+0uufF6wZ7CRFWJN3hp8Jqblpgve06U5CMQ3f//6iDjPr2PEo9MWCjEssDsa+UZEL4PkFpr+BMop6aKzQ==",
    - "dev": true,
    - "requires": {
    - "define-properties": "^1.1.3",
    - "es-abstract": "^1.17.5"
    + "version": "1.1.4",
    + "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.4.tgz",
    + "integrity": "sha512-1ZvAZ4wlF7IyPVOcE1Omikt7UpaFlOQq0HlSti+ZvDH3UiD2brwGMwDbyV43jao2bKJ+4+WdPJHSd7kgzKYVqg==",
    + "dev": true,
    + "requires": {
    + "call-bind": "^1.0.0",
    + "define-properties": "^1.1.3"
    }
    },
    "object-keys": {
    @@ -8705,9 +8808,9 @@
    "dev": true
    },
    "querystringify": {
    - "version": "2.1.1",
    - "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.1.1.tgz",
    - "integrity": "sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA==",
    + "version": "2.2.0",
    + "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
    + "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==",
    "dev": true
    },
    "randombytes": {
    @@ -8825,13 +8928,13 @@
    }
    },
    "regexp.prototype.flags": {
    - "version": "1.3.0",
    - "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.3.0.tgz",
    - "integrity": "sha512-2+Q0C5g951OlYlJz6yu5/M33IcsESLlLfsyIaLJaG4FA2r4yP8MvVMJUUP/fVBkSpbbbZlS5gynbEWLipiiXiQ==",
    - "dev": true,
    - "requires": {
    - "define-properties": "^1.1.3",
    - "es-abstract": "^1.17.0-next.1"
    + "version": "1.3.1",
    + "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.3.1.tgz",
    + "integrity": "sha512-JiBdRBq91WlY7uRJ0ds7R+dU02i6LKi8r3BuQhNXn+kmeLN+EfHhfjqMRis1zJxnlu88hq/4dx0P2OP3APRTOA==",
    + "dev": true,
    + "requires": {
    + "call-bind": "^1.0.2",
    + "define-properties": "^1.1.3"
    }
    },
    "regexpp": {
    @@ -9157,12 +9260,12 @@
    "dev": true
    },
    "selfsigned": {
    - "version": "1.10.7",
    - "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.7.tgz",
    - "integrity": "sha512-8M3wBCzeWIJnQfl43IKwOmC4H/RAp50S8DF60znzjW5GVqTcSe2vWclt7hmYVPkKPlHWOu5EaWOMZ2Y6W8ZXTA==",
    - "dev": true,
    - "requires": {
    - "node-forge": "0.9.0"
    + "version": "1.10.8",
    + "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.8.tgz",
    + "integrity": "sha512-2P4PtieJeEwVgTU9QEcwIRDQ/mXJLX8/+I3ur+Pg16nS8oNbrGxEso9NyYWy8NAmXiNl4dlAp5MwoNeCWzON4w==",
    + "dev": true,
    + "requires": {
    + "node-forge": "^0.10.0"
    }
    },
    "semver": {
    @@ -9543,47 +9646,38 @@
    }
    },
    "sockjs": {
    - "version": "0.3.20",
    - "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.20.tgz",
    - "integrity": "sha512-SpmVOVpdq0DJc0qArhF3E5xsxvaiqGNb73XfgBpK1y3UD5gs8DSo8aCTsuT5pX8rssdc2NDIzANwP9eCAiSdTA==",
    - "dev": true,
    - "requires": {
    - "faye-websocket": "^0.10.0",
    + "version": "0.3.21",
    + "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.21.tgz",
    + "integrity": "sha512-DhbPFGpxjc6Z3I+uX07Id5ZO2XwYsWOrYjaSeieES78cq+JaJvVe5q/m1uvjIQhXinhIeCFRH6JgXe+mvVMyXw==",
    + "dev": true,
    + "requires": {
    + "faye-websocket": "^0.11.3",
    "uuid": "^3.4.0",
    - "websocket-driver": "0.6.5"
    + "websocket-driver": "^0.7.4"
    }
    },
    "sockjs-client": {
    - "version": "1.4.0",
    - "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.4.0.tgz",
    - "integrity": "sha512-5zaLyO8/nri5cua0VtOrFXBPK1jbL4+1cebT/mmKA1E1ZXOvJrII75bPu0l0k843G/+iAbhEqzyKr0w/eCCj7g==",
    - "dev": true,
    - "requires": {
    - "debug": "^3.2.5",
    + "version": "1.5.0",
    + "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.5.0.tgz",
    + "integrity": "sha512-8Dt3BDi4FYNrCFGTL/HtwVzkARrENdwOUf1ZoW/9p3M8lZdFT35jVdrHza+qgxuG9H3/shR4cuX/X9umUrjP8Q==",
    + "dev": true,
    + "requires": {
    + "debug": "^3.2.6",
    "eventsource": "^1.0.7",
    - "faye-websocket": "~0.11.1",
    - "inherits": "^2.0.3",
    - "json3": "^3.3.2",
    - "url-parse": "^1.4.3"
    + "faye-websocket": "^0.11.3",
    + "inherits": "^2.0.4",
    + "json3": "^3.3.3",
    + "url-parse": "^1.4.7"
    },
    "dependencies": {
    "debug": {
    - "version": "3.2.6",
    - "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
    - "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
    + "version": "3.2.7",
    + "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
    + "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
    "dev": true,
    "requires": {
    "ms": "^2.1.1"
    }
    - },
    - "faye-websocket": {
    - "version": "0.11.3",
    - "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.3.tgz",
    - "integrity": "sha512-D2y4bovYpzziGgbHYtGCMjlJM36vAl/y+xUyn1C+FVx8szd1E+86KwVw6XvYSzOP8iMpm1X0I4xJD+QtUb36OA==",
    - "dev": true,
    - "requires": {
    - "websocket-driver": ">=0.5.1"
    - }
    }
    }
    },
    @@ -9951,6 +10045,7 @@
    "version": "5.5.0",
    "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
    "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
    + "dev": true,
    "requires": {
    "has-flag": "^3.0.0"
    }
    @@ -10639,9 +10734,9 @@
    "dev": true
    },
    "vue": {
    - "version": "2.6.11",
    - "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.11.tgz",
    - "integrity": "sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ=="
    + "version": "2.6.12",
    + "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.12.tgz",
    + "integrity": "sha512-uhmLFETqPPNyuLLbsKz6ioJ4q7AZHzD8ZVFNATNyICSZouqP2Sz0rotWQC8UNBF6VGSCs5abnKJoStA6JbCbfg=="
    },
    "vue-cli-plugin-i18n": {
    "version": "1.0.1",
    @@ -10714,9 +10809,9 @@
    "dev": true
    },
    "vue-i18n": {
    - "version": "8.18.2",
    - "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.18.2.tgz",
    - "integrity": "sha512-0X5nBTCZAVjlwcrPaYJwNs3iipBBTv0AUHwQUOa8yP3XbQGWKbRHqBb3OhCYtum/IHDD21d/df5Xd2VgyxbxfA=="
    + "version": "8.22.4",
    + "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.22.4.tgz",
    + "integrity": "sha512-XLI5s0AdqMP2Lf4I4CmdmOq8kjb5DDFGR77wAuxCfpEuYSfhTRyyx6MetgZMiL6Lxa0DasjBOiOcciU3NkL3/Q=="
    },
    "vue-i18n-extract": {
    "version": "1.0.2",
    @@ -10837,6 +10932,11 @@
    }
    }
    },
    + "vue-router": {
    + "version": "3.4.9",
    + "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.4.9.tgz",
    + "integrity": "sha512-CGAKWN44RqXW06oC+u4mPgHLQQi2t6vLD/JbGRDAXm0YpMv0bgpKuU5bBd7AvMgfTz9kXVRIWKHqRwGEb8xFkA=="
    + },
    "vue-style-loader": {
    "version": "4.1.2",
    "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz",
    @@ -10856,9 +10956,9 @@
    }
    },
    "vue-template-compiler": {
    - "version": "2.6.11",
    - "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.6.11.tgz",
    - "integrity": "sha512-KIq15bvQDrcCjpGjrAhx4mUlyyHfdmTaoNfeoATHLAiWB+MU3cx4lOzMwrnUh9cCxy0Lt1T11hAFY6TQgroUAA==",
    + "version": "2.6.12",
    + "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.6.12.tgz",
    + "integrity": "sha512-OzzZ52zS41YUbkCBfdXShQTe69j1gQDZ9HIX8miuC9C3rBCk9wIRjLiZZLrmX9V+Ftq/YEyv1JaVr5Y/hNtByg==",
    "dev": true,
    "requires": {
    "de-indent": "^1.0.2",
    @@ -11100,9 +11200,9 @@
    }
    },
    "webpack-dev-middleware": {
    - "version": "3.7.2",
    - "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-3.7.2.tgz",
    - "integrity": "sha512-1xC42LxbYoqLNAhV6YzTYacicgMZQTqRd27Sim9wn5hJrX3I5nxYy1SxSd4+gjUFsz1dQFj+yEe6zEVmSkeJjw==",
    + "version": "3.7.3",
    + "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-3.7.3.tgz",
    + "integrity": "sha512-djelc/zGiz9nZj/U7PTBi2ViorGJXEWo/3ltkPbDyxCXhhEXkW0ce99falaok4TPj+AsxLiXJR0EBOb0zh9fKQ==",
    "dev": true,
    "requires": {
    "memory-fs": "^0.4.1",
    @@ -11113,9 +11213,9 @@
    }
    },
    "webpack-dev-server": {
    - "version": "3.11.0",
    - "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.11.0.tgz",
    - "integrity": "sha512-PUxZ+oSTxogFQgkTtFndEtJIPNmml7ExwufBZ9L2/Xyyd5PnOL5UreWe5ZT7IU25DSdykL9p1MLQzmLh2ljSeg==",
    + "version": "3.11.2",
    + "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.11.2.tgz",
    + "integrity": "sha512-A80BkuHRQfCiNtGBS1EMf2ChTUs0x+B3wGDFmOeT4rmJOHhHTCH2naNxIHhmkr0/UillP4U3yeIyv1pNp+QDLQ==",
    "dev": true,
    "requires": {
    "ansi-html": "0.0.7",
    @@ -11138,11 +11238,11 @@
    "p-retry": "^3.0.1",
    "portfinder": "^1.0.26",
    "schema-utils": "^1.0.0",
    - "selfsigned": "^1.10.7",
    + "selfsigned": "^1.10.8",
    "semver": "^6.3.0",
    "serve-index": "^1.9.1",
    - "sockjs": "0.3.20",
    - "sockjs-client": "1.4.0",
    + "sockjs": "^0.3.21",
    + "sockjs-client": "^1.5.0",
    "spdy": "^4.0.2",
    "strip-ansi": "^3.0.1",
    "supports-color": "^6.1.0",
    @@ -11459,11 +11559,13 @@
    }
    },
    "websocket-driver": {
    - "version": "0.6.5",
    - "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz",
    - "integrity": "sha1-XLJVbOuF9Dc8bYI4qmkchFThOjY=",
    - "dev": true,
    - "requires": {
    + "version": "0.7.4",
    + "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz",
    + "integrity": "sha512-b17KeDIQVjvb0ssuSDF2cYXSg2iztliJ4B9WdsuB6J952qCPKmnVq4DyW5motImXHDC1cBT/1UezrJVsKw5zjg==",
    + "dev": true,
    + "requires": {
    + "http-parser-js": ">=0.5.1",
    + "safe-buffer": ">=5.1.0",
    "websocket-extensions": ">=0.1.1"
    }
    },
    --- a/frontend/package.json Sun Jan 17 05:37:28 2021 -0600
    +++ b/frontend/package.json Thu Jan 21 11:42:13 2021 -0600
    @@ -6,13 +6,19 @@
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    + "watch": "vue-cli-service build --watch",
    "i18n:report": "vue-cli-service i18n:report --src './src/**/*.?(js|vue)' --locales './src/locales/**/*.json'"
    },
    "dependencies": {
    - "bootstrap-vue": "^2.15.0",
    - "core-js": "^3.6.5",
    - "vue": "^2.6.11",
    - "vue-i18n": "^8.18.2"
    + "@popperjs/core": "^2.6.0",
    + "axios": "^0.21.1",
    + "bootstrap": "^4.5.3",
    + "bootstrap-vue": "^2.21.2",
    + "core-js": "^3.8.2",
    + "portal-vue": "^2.1.7",
    + "vue": "^2.6.12",
    + "vue-i18n": "^8.22.4",
    + "vue-router": "^3.4.9"
    },
    "devDependencies": {
    "@intlify/vue-i18n-loader": "^1.0.0",
    @@ -24,7 +30,7 @@
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "vue-cli-plugin-i18n": "~1.0.1",
    - "vue-template-compiler": "^2.6.11"
    + "vue-template-compiler": "^2.6.12"
    },
    "eslintConfig": {
    "root": true,
    --- a/frontend/public/index.html Sun Jan 17 05:37:28 2021 -0600
    +++ b/frontend/public/index.html Thu Jan 21 11:42:13 2021 -0600
    @@ -1,5 +1,5 @@
    <!DOCTYPE html>
    -<html lang="en">
    +<html lang="en" class="h-100">
    <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    @@ -7,7 +7,7 @@
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= htmlWebpackPlugin.options.title %></title>
    </head>
    - <body>
    + <body class="h-100">
    <noscript>
    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    --- a/frontend/src/App.vue Sun Jan 17 05:37:28 2021 -0600
    +++ b/frontend/src/App.vue Thu Jan 21 11:42:13 2021 -0600
    @@ -1,22 +1,20 @@
    <template>
    - <div id="app">
    + <div id="app" class="h-100 d-flex flex-column align-items-stretch">
    <Header/>
    - <Navigation/>
    + <Contents/>
    + <router-view/>
    </div>
    </template>
    <script>
    -import Header from './components/Header.vue'
    -import Navigation from './components/Navigation.vue'
    +import Contents from './components/Contents.vue';
    +import Header from './components/Header.vue';
    export default {
    name: 'App',
    components: {
    Header,
    - Navigation
    + Contents
    }
    -}
    +};
    </script>
    -
    -<style>
    -</style>
    --- /dev/null Thu Jan 01 00:00:00 1970 +0000
    +++ b/frontend/src/components/BookList.vue Thu Jan 21 11:42:13 2021 -0600
    @@ -0,0 +1,34 @@
    +<template>
    + <b-tab :title="$t('books')">
    + <b-list-group>
    + <b-list-group-item v-for="book in books" :key="book.id" :href="'/'+book.id+'/'+book.defaultVersion" :v-active="book.id === active">{{book.displayName}}</b-list-group-item>
    + </b-list-group>
    + </b-tab>
    +</template>
    +
    +<script>
    +import axios from 'axios';
    +
    +export default {
    + data() {
    + return {
    + books: null,
    + active: null
    + }
    + },
    + mounted() {
    + axios
    + .get("/api/v1/books")
    + .then(response => (this.books = response["data"]["books"]))
    + this.active = location.pathname.split('/')[1];
    + }
    +}
    +</script>
    +
    +<i18n>
    +{
    + "en": {
    + "books": "Books"
    + }
    +}
    +</i18n>
    --- /dev/null Thu Jan 01 00:00:00 1970 +0000
    +++ b/frontend/src/components/Contents.vue Thu Jan 21 11:42:13 2021 -0600
    @@ -0,0 +1,19 @@
    +<template>
    + <div class="h-100 d-flex align-items-stretch">
    + <Navigation/>
    + <Viewer/>
    + </div>
    +</template>
    +
    +<script>
    +import Navigation from './Navigation.vue';
    +import Viewer from './Viewer.vue';
    +
    +export default {
    + name: 'Contents',
    + components: {
    + Navigation,
    + Viewer
    + }
    +};
    +</script>
    --- a/frontend/src/components/Navigation.vue Sun Jan 17 05:37:28 2021 -0600
    +++ b/frontend/src/components/Navigation.vue Thu Jan 21 11:42:13 2021 -0600
    @@ -1,20 +1,24 @@
    <template>
    - <b-tabs>
    - <b-tab :title="$t('books')" active>Books</b-tab>
    + <b-tabs cards>
    + <BookList/>
    <b-tab :title="$t('search')">Search</b-tab>
    </b-tabs>
    </template>
    <script>
    +import BookList from './BookList.vue'
    +
    export default {
    - name: 'Navigation'
    + name: 'Navigation',
    + components: {
    + BookList
    + }
    }
    </script>
    <i18n>
    {
    "en": {
    - "books": "Books",
    "search": "Search"
    }
    }
    --- /dev/null Thu Jan 01 00:00:00 1970 +0000
    +++ b/frontend/src/components/Viewer.vue Thu Jan 21 11:42:13 2021 -0600
    @@ -0,0 +1,55 @@
    +<template>
    + <div class="embed-responsive embed-responsive-16by9">
    + <iframe :src="src" ref="iframe" @load="update"></iframe>
    + </div>
    +</template>
    +
    +<script>
    +export default {
    + name: "Viewer",
    + data() {
    + return {
    + rawLocation: 'raw',
    + src: null
    + }
    + },
    + methods: {
    + update() {
    + const contentWindow = this.$refs.iframe.contentWindow;
    +
    + // Update the location to match what we're displaying in the iframe
    + // using the raw path and assuming there's a trailing / after it.
    + const rawpath = contentWindow.location.pathname;
    + const realpath = rawpath.substring(this.rawLocation.length + 1, rawpath.length);
    +
    + location.pathname = realpath;
    +
    + // Update the title to match the iframe's as well.
    + if(contentWindow.document.title) {
    + document.title = `devweb: ${contentWindow.document.title}`;
    + } else {
    + document.title = `devweb`;
    + }
    + }
    + },
    + mounted() {
    + const parts = location.pathname.split('/');
    +
    + if(parts.length <= 1) {
    + // set the welcome page or whatever
    + return;
    + }
    +
    + // If the first item is and empty string pop it off.
    + if(parts[0] == '') {
    + parts.shift();
    + }
    +
    + const book = parts.shift();
    + const version = parts.shift();
    + const path = parts.join('/');
    +
    + this.src = `/${this.rawLocation}/${book}/${version}/${path}`;
    + }
    +};
    +</script>
    --- a/frontend/src/main.js Sun Jan 17 05:37:28 2021 -0600
    +++ b/frontend/src/main.js Thu Jan 21 11:42:13 2021 -0600
    @@ -1,5 +1,6 @@
    // basics
    import Vue from 'vue'
    +import VueRouter from 'vue-router'
    import App from './App.vue'
    import i18n from './i18n'
    @@ -10,10 +11,18 @@
    Vue.config.productionTip = false
    +Vue.use(VueRouter)
    Vue.use(BootstrapVue)
    Vue.use(IconsPlugin)
    +const routes = [
    + { path: "/:book/:version", component: App }
    +];
    +
    +const router = new VueRouter({routes});
    +
    new Vue({
    i18n,
    + router,
    render: h => h(App)
    }).$mount('#app')