diff options
Diffstat (limited to 'js')
| -rw-r--r-- | js/inline-expanding.js | 12 | ||||
| -rw-r--r-- | js/no-animated-gif.js | 61 |
2 files changed, 73 insertions, 0 deletions
diff --git a/js/inline-expanding.js b/js/inline-expanding.js index 04d9298f..5bbfa0a0 100644 --- a/js/inline-expanding.js +++ b/js/inline-expanding.js @@ -27,9 +27,17 @@ onready(function(){ if (!this.dataset.src) { this.parentNode.removeAttribute('style'); this.dataset.expanded = 'true'; + + if (this.childNodes[0].tagName === 'CANVAS') { + this.removeChild(this.childNodes[0]); + this.childNodes[0].style.display = 'block'; + } + this.dataset.src= this.childNodes[0].src; this.dataset.width = this.childNodes[0].style.width; this.dataset.height = this.childNodes[0].style.height; + + this.childNodes[0].src = this.href; this.childNodes[0].style.width = 'auto'; this.childNodes[0].style.height = 'auto'; @@ -48,6 +56,10 @@ onready(function(){ delete this.dataset.src; delete this.childNodes[0].style.opacity; delete this.childNodes[0].style.filter; + + if (localStorage.no_animated_gif === 'true' && typeof unanimate_gif === 'function') { + unanimate_gif(this.childNodes[0]); + } } return false; } diff --git a/js/no-animated-gif.js b/js/no-animated-gif.js new file mode 100644 index 00000000..36d48954 --- /dev/null +++ b/js/no-animated-gif.js @@ -0,0 +1,61 @@ +/* + * no-animated-gif.js - Toggle GIF animated thumbnails when gifsicle is enabled + * + * Copyright (c) 2014 Fredrick Brennan <admin@8chan.co> + * + * Usage: + * $config['additional_javascript'][] = 'js/jquery.min.js'; + * $config['additional_javascript'][] = 'js/no-animated-gif.js'; + */ + +function unanimate_gif(e) { + var c = $('<canvas class="post-image"></canvas>'); + $(e).parent().prepend(c); + c.attr('width', $(e).width()); + c.attr('height',$(e).height()); + function draw_image() { + c[0].getContext('2d').drawImage(e, 0, 0, $(e).width(), $(e).height()) + }; + + // Fix drawing image before loaded. Note that Chrome needs to check .complete because load() is NOT called if loaded from cache. + if (!e.complete) { + e.onload = draw_image; + } else { + draw_image(); + } + + $(e).hide(); +} + +function no_animated_gif() { + var anim_gifs = $('img.post-image[src$=".gif"]'); + localStorage.no_animated_gif = true; + $('#no-animated-gif>a').text(_('Animate GIFs')); + + $.each(anim_gifs, function(i, e) {unanimate_gif(e)} ); +} + +function animated_gif() { + $('canvas.post-image').remove(); + $('img.post-image').show(); + localStorage.no_animated_gif = false; + $('#no-animated-gif>a').text(_('Unanimate GIFs')); + +} + +if (active_page == 'thread' || active_page == 'index' || active_page == 'ukko') { + onready(function(){ + $('hr:first').before('<div id="no-animated-gif" style="text-align:right"><a class="unimportant" href="javascript:void(0)">'+_('Unanimate GIFs')+'</a></div>') + + $('#no-animated-gif').on('click', function() { + if (localStorage.no_animated_gif === 'true') { + animated_gif(); + } else { + no_animated_gif(); + } + }); + + if (localStorage.no_animated_gif === 'true') + $(document).ready(no_animated_gif); + }); +} |