A little more refactoring

This commit is contained in:
Kovid Goyal 2016-10-02 19:44:36 +05:30
parent a1b59e7932
commit f360a7affa
2 changed files with 20 additions and 20 deletions

View File

@ -11,16 +11,25 @@ THUMBNAIL_MAX_HEIGHT = 400
COVER_GRID = unique_id('cover-grid') COVER_GRID = unique_id('cover-grid')
def cover_grid_css(sel): def cover_grid_css():
ans = build_rule(f'{sel} #{COVER_GRID} > div:hover', transform='scale(1.2)') sel = '#' + COVER_GRID
ans += build_rule(f'{sel} #{COVER_GRID} > div:active', transform='scale(2)') ans = build_rule(sel, display='flex', flex_wrap='wrap', justify_content='space-around', align_items='flex-end', align_content='flex-start', user_select='none', overflow='hidden')
sel += ' > div'
ans += build_rule(
sel, margin='10px', display='flex', align_content='flex-end', align_items='flex-end', justify_content='space-around',
width='21vw', height='28vw', max_width=THUMBNAIL_MAX_WIDTH+'px', max_height=THUMBNAIL_MAX_HEIGHT+'px', cursor='pointer',
min_width=f'{THUMBNAIL_MAX_WIDTH // 2}px', min_height=f'{THUMBNAIL_MAX_HEIGHT // 2}px')
ans += build_rule(f'{sel}:hover', transform='scale(1.2)')
ans += build_rule(f'{sel}:active', transform='scale(2)')
sel += ' > img'
ans += build_rule(sel, max_width='100%', max_height='100%', display='block', width='auto', height='auto', border_radius='10px')
return ans return ans
def init(container): def init(container):
clear(container) clear(container)
div = E.div(id=COVER_GRID) container.appendChild(E.div(id=COVER_GRID))
set_css(div, display='flex', flex_wrap='wrap', justify_content='space-around', align_items='flex-end', align_content='flex-start', user_select='none', overflow='hidden')
container.appendChild(div)
def on_img_load_error(err): def on_img_load_error(err):
img = err.target img = err.target
@ -40,17 +49,10 @@ def create_item(book_id, interface_data, onclick):
cover_url = 'get/thumb/{}/{}?sz={}x{}'.format(book_id, interface_data['library_id'], Math.ceil(THUMBNAIL_MAX_WIDTH*window.devicePixelRatio), Math.ceil(THUMBNAIL_MAX_HEIGHT*window.devicePixelRatio)) cover_url = 'get/thumb/{}/{}?sz={}x{}'.format(book_id, interface_data['library_id'], Math.ceil(THUMBNAIL_MAX_WIDTH*window.devicePixelRatio), Math.ceil(THUMBNAIL_MAX_HEIGHT*window.devicePixelRatio))
metadata = interface_data['metadata'][book_id] metadata = interface_data['metadata'][book_id]
alt = _('{} by {}').format(metadata['title'], metadata['authors'].join(' & ')) alt = _('{} by {}').format(metadata['title'], metadata['authors'].join(' & '))
img = E.img(src=cover_url, alt=alt, title=alt, data_title=metadata['title'], data_authors=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; width:auto; height:auto; border-radius: 10px')
img.onerror = on_img_load_error img.onerror = on_img_load_error
ans = E.div( ans = E.div(img, data_book_id=str(book_id))
style=('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; cursor:pointer').format(
THUMBNAIL_MAX_WIDTH, THUMBNAIL_MAX_HEIGHT, THUMBNAIL_MAX_WIDTH // 2, THUMBNAIL_MAX_HEIGHT // 2),
data_book_id=str(book_id),
img
)
ans.addEventListener('click', onclick) ans.addEventListener('click', onclick)
return ans return ans

View File

@ -17,12 +17,10 @@ bv_counter = 0
CLASS_NAME = 'books-main-list' CLASS_NAME = 'books-main-list'
def widget_css(): add_extra_css(def():
ans = '' ans = cover_grid_css()
sel = f'.{CLASS_NAME} '
ans += cover_grid_css(sel)
return ans return ans
add_extra_css(widget_css) )
class BooksView: class BooksView: