diff --git a/src/pyj/book_list/views.pyj b/src/pyj/book_list/views.pyj index aec0040efe..77dab317c6 100644 --- a/src/pyj/book_list/views.pyj +++ b/src/pyj/book_list/views.pyj @@ -1,7 +1,7 @@ # vim:fileencoding=utf-8 # License: GPL v3 Copyright: 2015, Kovid Goyal -from dom import set_css, build_rule +from dom import set_css, build_rule, clear from elementmaker import E from gettext import gettext as _ @@ -122,13 +122,26 @@ class BooksView: cover_url = str.format('get/thumb/{}/{}?sz={}x{}', book_id, self.interface_data['library_id'], THUMBNAIL_MAX_WIDTH, THUMBNAIL_MAX_HEIGHT) metadata = self.interface_data['metadata'][book_id] alt = str.format(_('{} by {}'), metadata['title'], metadata['authors'].join(' & ')) + img = E.img(src=cover_url, alt=alt, title=alt, data_title=metadata['title'], data_authors=metadata['authors'].join(' & '), + style='max-width: 100%; max-height: 100%; display: block; cursor: pointer; width:auto; height:auto') + img.onerror = def(err): + img = err.target + div = img.parentNode + clear(div) + div.appendChild(E.div( + style='position:relative; top:-50%; transform: translateY(50%); cursor:pointer', + E.h2(img.getAttribute('data-title'), style='text-align:center; font-size:larger; font-weight: bold'), + E.div(_('by'), style='text-align: center'), + E.h2(img.getAttribute('data-authors'), style='text-align:center; font-size:larger; font-weight: bold') + )) + set_css(div, border='dashed 1px currentColor', border_radius='10px') + return E.div( style=str.format(('margin: 10px; display: flex; align-content: flex-end; align-items: flex-end; justify-content: space-around;' 'width: 21vw; height: 28vw; max-width: {}px; max-height: {}px; min-width: {}px; min-height: {}px'), THUMBNAIL_MAX_WIDTH, THUMBNAIL_MAX_HEIGHT, THUMBNAIL_MAX_WIDTH // 2, THUMBNAIL_MAX_HEIGHT // 2), data_book_id=str(book_id), - E.img(src=cover_url, alt=alt, title=alt, - style='max-width: 100%; max-height: 100%; display: block; cursor: pointer; width:auto; height:auto') + img ) # }}}