{
let index = 1;
const ui = htl.html`<div>`;
const increment = () => {
if (index < images.length-1) {
index = index + 1;
updateUi();
}
};
const decrement = () => {
if (index > 0) {
index = index - 1;
updateUi();
}
};
const next = htl.html`<button onclick=${increment}>Next</button>`;
const prev = htl.html`<button onclick=${decrement}>Previous</button>`;
const updateUi = () => {
console.log(index)
const internal = html`<div>
<img width=300 height=300 src=${images[index]}>
${prev}
${next}
</div>`;
ui.innerHTML = null;
ui.append(internal);
};
updateUi();
return ui;
}