mkImageGallaryHTML = () => {
let margin = 10,
cols = 4,
d = new Date(),
w = (width - margin * 2 * cols) / cols,
srcs = images.map((d) => {
let { url, contents } = d,
spans = contents.map(
(c, i) =>
htl.html`<span style="color:${contentsColormap[c]}">${
i === 0 ? "|" : ""
} ${title(c)} | </span>`
);
return htl.html`
<div style="margin: ${margin}px">
<image style="filter: ${imageFilter}; width:${w}px;" src=${url}></image>
<div>${spans}</div>
</div>`;
});
return htl.html`
<h3>Images with filter: ${imageFilter}</h3>
<div id='gallary'>
${srcs}
</div>
`;
}