Color the books according to their id hash

This commit is contained in:
Robbie Antenesse 2019-01-26 12:16:43 -06:00
parent e5f6736f02
commit f95e5cd65c
4 changed files with 15 additions and 4 deletions

View File

@ -23,6 +23,7 @@
"socket.io": "^2.2.0", "socket.io": "^2.2.0",
"socket.io-client": "^2.2.0", "socket.io-client": "^2.2.0",
"striptags": "^3.1.1", "striptags": "^3.1.1",
"tinycolor2": "^1.4.1",
"unused-filename": "^1.0.0" "unused-filename": "^1.0.0"
} }
} }

View File

@ -15,7 +15,7 @@
width: 100px; width: 100px;
height: 300px; /* The tallest a book could be */ height: 300px; /* The tallest a book could be */
border-bottom: 4px solid saddlebrown; border-bottom: 4px solid saddlebrown;
margin: 10px 0 -4px !important; margin: 10px 1px -4px !important;
} }
.book-slot.is-thin { .book-slot.is-thin {
width: 80px; width: 80px;

View File

@ -2,6 +2,7 @@ const path = require('path');
const fs = require('fs'); const fs = require('fs');
const snarkdown = require('snarkdown'); const snarkdown = require('snarkdown');
const fecha = require('fecha'); const fecha = require('fecha');
const tinycolor = require('tinycolor2');
const settings = require('../settings.json'); const settings = require('../settings.json');
@ -45,6 +46,10 @@ module.exports = function (app) {
footer: '<a class="button close">Close</a> <a class="button is-success modal-button" data-modal="' + confirmId + '">Take Book</a>', footer: '<a class="button close">Close</a> <a class="button is-success modal-button" data-modal="' + confirmId + '">Take Book</a>',
}); });
const maxSize = settings.maxFileSize > 0 ? settings.maxFileSize : 10; const maxSize = settings.maxFileSize > 0 ? settings.maxFileSize : 10;
let spineColor = tinycolor('#' + id.substr(0, 6));
if (!spineColor.isValid()) {
spineColor = tinycolor.random();
}
return app.templater.fill('./templates/elements/book.html', { return app.templater.fill('./templates/elements/book.html', {
id, id,
title: bookData.title, title: bookData.title,
@ -52,8 +57,8 @@ module.exports = function (app) {
thickness: (fileDetails.size > (maxSize * 0.3)) || (bookData.title.length > 28) thickness: (fileDetails.size > (maxSize * 0.3)) || (bookData.title.length > 28)
? 'is-thick' : (fileDetails.size < (maxSize * 0.6) ? 'is-thin' : ''), ? 'is-thick' : (fileDetails.size < (maxSize * 0.6) ? 'is-thin' : ''),
tallness: bookData.title.length > 16 ? 'is-tall' : (bookData.title.length < 8 ? 'is-short' : ''), tallness: bookData.title.length > 16 ? 'is-tall' : (bookData.title.length < 8 ? 'is-short' : ''),
spineColor: '#ff0000', spineColor: spineColor.toString(),
textColor: '#ffffff', textColor: spineColor.isLight() ? '#000000' : '#ffffff',
fileType: bookData.fileType, fileType: bookData.fileType,
modal, modal,
}); });
@ -63,7 +68,7 @@ module.exports = function (app) {
books = '<div class="column"><div class="content">The shelf is empty. Would you like to <a href="/give">add a book</a>?</div></div>'; books = '<div class="column"><div class="content">The shelf is empty. Would you like to <a href="/give">add a book</a>?</div></div>';
} }
const body = '<h2 class="title">Available Books</h2><div class="bookshelf columns is-gapless is-multiline">' + books + '</div>'; const body = '<h2 class="title">Available Books</h2><div class="bookshelf columns is-gapless is-multiline is-mobile">' + books + '</div>';
const html = app.templater.fill('./templates/htmlContainer.html', { const html = app.templater.fill('./templates/htmlContainer.html', {
title: 'View', title: 'View',
resourcePath: (req.url.substr(-1) === '/' ? '../' : './'), resourcePath: (req.url.substr(-1) === '/' ? '../' : './'),

View File

@ -908,6 +908,11 @@ striptags@^3.1.1:
resolved "https://registry.yarnpkg.com/striptags/-/striptags-3.1.1.tgz#c8c3e7fdd6fb4bb3a32a3b752e5b5e3e38093ebd" resolved "https://registry.yarnpkg.com/striptags/-/striptags-3.1.1.tgz#c8c3e7fdd6fb4bb3a32a3b752e5b5e3e38093ebd"
integrity sha1-yMPn/db7S7OjKjt1LltePjgJPr0= integrity sha1-yMPn/db7S7OjKjt1LltePjgJPr0=
tinycolor2@^1.4.1:
version "1.4.1"
resolved "https://registry.yarnpkg.com/tinycolor2/-/tinycolor2-1.4.1.tgz#f4fad333447bc0b07d4dc8e9209d8f39a8ac77e8"
integrity sha1-9PrTM0R7wLB9TcjpIJ2POaisd+g=
to-array@0.1.4: to-array@0.1.4:
version "0.1.4" version "0.1.4"
resolved "https://registry.yarnpkg.com/to-array/-/to-array-0.1.4.tgz#17e6c11f73dd4f3d74cda7a4ff3238e9ad9bf890" resolved "https://registry.yarnpkg.com/to-array/-/to-array-0.1.4.tgz#17e6c11f73dd4f3d74cda7a4ff3238e9ad9bf890"