Experimenting with collapsing images.

git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@4258 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
Cory McWilliams 2023-04-13 00:03:22 +00:00
parent 84aec0278d
commit 1e37eeea05
3 changed files with 17 additions and 0 deletions

View File

@ -127,6 +127,13 @@ class TfMessageElement extends LitElement {
body_click(event) { body_click(event) {
if (event.srcElement.tagName == 'IMG') { if (event.srcElement.tagName == 'IMG') {
this.show_image(event.srcElement.src); this.show_image(event.srcElement.src);
} else if (event.srcElement.tagName == 'DIV' && event.srcElement.classList.contains('img_caption')) {
let next = event.srcElement.nextSibling;
if (next.style.display == 'block') {
next.style.display = 'none';
} else {
next.style.display = 'block';
}
} }
} }

View File

@ -36,4 +36,13 @@ img {
padding: 8px; padding: 8px;
margin: 4px; margin: 4px;
} }
div.img_caption {
color: #888;
cursor: pointer;
}
div.img_caption::after {
content: ' ±';
}
`; `;

View File

@ -26,6 +26,7 @@ function image(node, entering) {
} else { } else {
if (entering) { if (entering) {
if (this.disableTags === 0) { if (this.disableTags === 0) {
this.lit('<div class="img_caption">' + this.esc(node.firstChild?.literal || node.destination) + '</div>');
if (this.options.safe && potentiallyUnsafe(node.destination)) { if (this.options.safe && potentiallyUnsafe(node.destination)) {
this.lit('<img src="" alt="'); this.lit('<img src="" alt="');
} else { } else {