aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--cgi/templates/board.html20
-rw-r--r--cgi/templates/board.jp.html24
-rw-r--r--static/css/ib.css16
-rw-r--r--static/js/weabot.js38
4 files changed, 53 insertions, 45 deletions
diff --git a/cgi/templates/board.html b/cgi/templates/board.html
index b338cfe..486c380 100644
--- a/cgi/templates/board.html
+++ b/cgi/templates/board.html
@@ -217,17 +217,19 @@
<small>Imagen miniatura</small>
<?py #endif ?>
</div><?py #div .fs ?>
- <a target="_blank" href="#{images_url}#{board}/src/#{post['file']}" id="thumb#{post['id']}">
- <?py if post['thumb'].startswith('mime'): ?>
- <img class="thumb" alt="#{post['id']}" src="/static/#{post['thumb']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
- <?py elif post['file'][-3:] == 'gif': ?>
- <img class="thumb" alt="#{post['id']}" src="#{images_url}#{board}/src/#{post['file']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
- <?py else: ?>
- <img class="thumb" alt="#{post['id']}" src="#{images_url}#{board}/thumb/#{post['thumb']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
- <?py #endif ?>
- </a>
<?py #endif ?>
</div><?py #div .info ?>
+ <?py if post['parentid'] and post['file']: ?>
+ <a target="_blank" href="#{images_url}#{board}/src/#{post['file']}" id="thumb#{post['id']}">
+ <?py if post['thumb'].startswith('mime'): ?>
+ <img class="thumb" alt="#{post['id']}" src="/static/#{post['thumb']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
+ <?py elif post['file'][-3:] == 'gif': ?>
+ <img class="thumb" alt="#{post['id']}" src="#{images_url}#{board}/src/#{post['file']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
+ <?py else: ?>
+ <img class="thumb" alt="#{post['id']}" src="#{images_url}#{board}/thumb/#{post['thumb']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
+ <?py #endif ?>
+ </a>
+ <?py #endif ?>
<?py if post['thumb_width'] and post['parentid']: ?>
<blockquote style="margin-left:#{post['thumb_width']+40}px;">#{post['message']}</blockquote>
<?py else: ?>
diff --git a/cgi/templates/board.jp.html b/cgi/templates/board.jp.html
index 6bc5e19..ffb9d67 100644
--- a/cgi/templates/board.jp.html
+++ b/cgi/templates/board.jp.html
@@ -219,17 +219,19 @@
<small>サムネ表示</small>
<?py #endif ?>
</div><?py #div .fs ?>
- <a target="_blank" href="#{images_url}#{board}/src/#{post['file']}" id="thumb#{post['id']}">
- <?py if post['thumb'].startswith('mime'): ?>
- <img class="thumb" alt="#{post['id']}" src="/static/#{post['thumb']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
- <?py elif post['file'][-3:] == 'gif': ?>
- <img class="thumb" alt="#{post['id']}" src="#{images_url}#{board}/src/#{post['file']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
- <?py else: ?>
- <img class="thumb" alt="#{post['id']}" src="#{images_url}#{board}/thumb/#{post['thumb']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
- <?py #endif ?>
- </a>
- <?py #endif ?>
+ <?py #endif ?>
</div><?py #div .info ?>
+ <?py if post['parentid'] and post['file']: ?>
+ <a target="_blank" href="#{images_url}#{board}/src/#{post['file']}" id="thumb#{post['id']}">
+ <?py if post['thumb'].startswith('mime'): ?>
+ <img class="thumb" alt="#{post['id']}" src="/static/#{post['thumb']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
+ <?py elif post['file'][-3:] == 'gif': ?>
+ <img class="thumb" alt="#{post['id']}" src="#{images_url}#{board}/src/#{post['file']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
+ <?py else: ?>
+ <img class="thumb" alt="#{post['id']}" src="#{images_url}#{board}/thumb/#{post['thumb']}" width="#{post['thumb_width']}" height="#{post['thumb_height']}" />
+ <?py #endif ?>
+ </a>
+ <?py #endif ?>
<?py if post['thumb_width'] and post['parentid']: ?>
<blockquote style="margin-left:#{post['thumb_width']+40}px;">#{post['message']}</blockquote>
<?py else: ?>
@@ -275,4 +277,4 @@
<div class="pg">#{pagenav}</div>
<?py #endif ?>
-<?py include('templates/base_bottom.html') ?> \ No newline at end of file
+<?py include('templates/base_bottom.html') ?>
diff --git a/static/css/ib.css b/static/css/ib.css
index a075366..17b078a 100644
--- a/static/css/ib.css
+++ b/static/css/ib.css
@@ -106,7 +106,6 @@ textarea {
margin-left: 1em;
}
.thread {
- margin-right: 170px;
line-height: 18px;
}
.thread table {
@@ -128,9 +127,6 @@ textarea {
float: left;
margin: 0 20px;
}
-.thumb.expanded {
- margin-bottom: 1em;
-}
.ell {
font-family: Mona, IPAMonaPGothic, Monapo, "MS PGothic", YOzFontAA97;
vertical-align: top;
@@ -324,11 +320,7 @@ textarea {
.selector {
font-size: 10pt;
}
-@media (max-width: 900px) {
- .thread {
- margin-right: 0;
- }
-}
+
@media (max-width: 600px) {
body {
font-size: 14px;
@@ -395,15 +387,13 @@ textarea {
margin-left: 4px;
}
.thumb {
- margin: 0 8px 0 2px;
+ margin: 0 8px;
max-width: 100px;
max-height: 100px;
+ object-fit: scale-down;
width: auto;
height: auto;
}
- .thumb.expanded {
- margin-bottom: 8px;
- }
blockquote {
margin: 8px !important;
}
diff --git a/static/js/weabot.js b/static/js/weabot.js
index 48ac7cd..04ac483 100644
--- a/static/js/weabot.js
+++ b/static/js/weabot.js
@@ -35,7 +35,6 @@ function insert(text) {
var textarea = document.forms.postform.message;
if (textarea) {
if (textarea.setSelectionRange) {
- // Firefox
var start = textarea.selectionStart;
var end = textarea.selectionEnd;
textarea.value =
@@ -77,22 +76,28 @@ function expandimg(e) {
var pid = e.dataset.id;
var cont = document.getElementById('thumb'+pid);
var thumb = cont.firstElementChild;
- var aux = e.parentNode.parentNode;
if (e.dataset.expanded == 'true') {
cont.removeChild(cont.lastElementChild);
thumb.removeAttribute('style');
+ cont.removeAttribute('style');
e.dataset.expanded = '';
- if (aux.className != "thread") {
- var bq = aux.nextElementSibling;
- bq.removeAttribute('style');
- bq.style.marginLeft = (thumb.width + 32) + 'px';
+ if (e.parentNode.parentNode.className != "thread") {
+ var bq = cont.nextElementSibling;
+ bq.style.marginLeft = (thumb.width + 40) + 'px';
}
} else {
var imgurl = e.href;
var format = imgurl.split('.').pop();
- var maxw = document.body.clientWidth - thumb.getBoundingClientRect().left - 40;
+
+ var clientw = document.body.clientWidth;
+ if (clientw > 600) {
+ var marginr = 40;
+ } else {
+ var marginr = 15;
+ }
+ var maxw = clientw - thumb.getBoundingClientRect().left - marginr;
if (imgw > maxw) {
var ratio = maxw / imgw;
@@ -100,20 +105,29 @@ function expandimg(e) {
imgh = imgh * ratio;
}
- var exp = document.createElement('img');
- exp.className = 'thumb expanded';
+ if (format.toLowerCase() == 'webm' || format.toLowerCase() == 'mp4') {
+ var exp = document.createElement('video');
+ exp.autoplay = true;
+ exp.loop = true;
+ exp.controls = true;
+ exp.poster = thumb.src;
+ } else {
+ var exp = document.createElement('img');
+ }
+
+ exp.className = 'thumb';
exp.alt = pid;
exp.src = imgurl;
exp.style.maxWidth = imgw + 'px';
exp.style.maxHeight = imgh + 'px';
cont.appendChild(exp);
+ cont.style.display = 'table';
thumb.style.display = 'none';
e.dataset.expanded = 'true';
- if (aux.className != "thread") {
- var bq = aux.nextElementSibling;
+ if (e.parentNode.parentNode.className != "thread") {
+ var bq = cont.nextElementSibling;
bq.style.marginLeft = '';
- bq.style.display = 'table';
}
}
}