Masonry-like Custom Element for sortable tiles that packs efficiently without changing HTML structure (changes CSS only), and adapts it to CSS Grid Layout. Extended renderer for juicy-tile-list.
There are few questions, without clear, stated and documented answer:
Should we support packing tiles with 0 given as size?
If so, should we do it in some other way than currently?
If no, should we block it, silently ignore, throw an error, show warning,...?
Should we support conditionally visible tiles? (dependent on their content, or DOM property, not on the pre-configured JSON setup, like .hidden)
If so, how should it work, how should gutter work, how should we mach setup node to the tile?
Related issues:
Invalid dynamic height calculation #17
Current implementation:
We do, as for any other tile:
After packing all items with higher priority, we pick the first free slot which is wider(or equal) and taller (or equal) to given tile. Then subtract occupied space from remaining free slots/space to pack, which in facts does nothing, and other tiles may be packed at the same x,y.
0-size tile may get gutter as well.
However it will not get separated 0-size grid track, which may become dynamic.
n/a
n/a
Currently we don't, and we do not bother with any validation on that.
All items are being wrapped by Shadow DOM tiles, and all tiles are styled according to the setup. You may add/remove items from <juicy-tile-lis> and -grid> in run-time, and they will get styles according to given setup (and ids).
If you want to show/hide, change any other CSS property of you element your are totally free to do so, you element will behave as it should according to regular W3C rules, however the ShadowDOM tile will be there as long as your element is there.
If you want to show/hide, change size, or any other layout property of a tile, you can do it as well in run-time, but you need to.. well... change the layout property, and .refresh() our element. (This is done automatically if you change entire setup attribute, or on re-size, mutation, attached events, according to custom attributes set, and you can do it manually as well)
There are few questions, without clear, stated and documented answer:
0given as size?.hidden)Related issues:
Current implementation:
We do, as for any other tile: After packing all items with higher priority, we pick the first free slot which is wider(or equal) and taller (or equal) to given tile. Then subtract occupied space from remaining free slots/space to pack, which in facts does nothing, and other tiles may be packed at the same
x,y.0-sizetile may get gutter as well.However it will not get separated
0-sizegrid track, which may become dynamic.<juicy-tile-lis>and-grid>in run-time, and they will get styles according to given setup (and ids).If you want to show/hide, change any other CSS property of you element your are totally free to do so, you element will behave as it should according to regular W3C rules, however the ShadowDOM tile will be there as long as your element is there. If you want to show/hide, change size, or any other layout property of a tile, you can do it as well in run-time, but you need to.. well... change the layout property, and
.refresh()our element. (This is done automatically if you change entire setup attribute, or on re-size, mutation, attached events, according to custom attributes set, and you can do it manually as well)@warpech , @miyconst WDYT?