diff options
Diffstat (limited to 'src/content/dependencies/generateCoverGrid.js')
-rw-r--r-- | src/content/dependencies/generateCoverGrid.js | 42 |
1 files changed, 42 insertions, 0 deletions
diff --git a/src/content/dependencies/generateCoverGrid.js b/src/content/dependencies/generateCoverGrid.js new file mode 100644 index 00000000..20130c5e --- /dev/null +++ b/src/content/dependencies/generateCoverGrid.js @@ -0,0 +1,42 @@ +import {stitchArrays} from '../../util/sugar.js'; + +export default { + extraDependencies: ['html'], + + slots: { + images: {validate: v => v.arrayOf(v.isHTML)}, + links: {validate: v => v.arrayOf(v.isHTML)}, + names: {validate: v => v.arrayOf(v.isHTML)}, + info: {validate: v => v.arrayOf(v.isHTML)}, + + lazy: {validate: v => v.oneOf(v.isWholeNumber, v.isBoolean)}, + }, + + generate(slots, {html}) { + return ( + html.tag('div', {class: 'grid-listing'}, + stitchArrays({ + image: slots.images, + link: slots.links, + name: slots.names, + info: slots.info, + }).map(({image, link, name, info}, index) => + link.slots({ + attributes: {class: ['grid-item', 'box']}, + content: [ + image.slots({ + thumb: 'medium', + square: true, + lazy: + (typeof slots.lazy === 'number' + ? index >= slots.lazy + : typeof slots.lazy === 'boolean' + ? slots.lazy + : false), + }), + html.tag('span', {[html.onlyIfContent]: true}, name), + html.tag('span', {[html.onlyIfContent]: true}, info), + ], + })))); + }, +}; |