czaks
9 years ago
2 changed files with 179 additions and 0 deletions
@ -0,0 +1,124 @@ |
|||
if (active_page == 'index' || active_page == 'thread') |
|||
$(function(){ |
|||
|
|||
var gallery_view = false; |
|||
|
|||
$('hr:first').before('<div id="gallery-view" style="text-align:right"><a class="unimportant" href="javascript:void(0)">-</a></div>'); |
|||
$('#gallery-view a').html(gallery_view ? _("Disable gallery mode") : _("Enable gallery mode")).click(function() { |
|||
gallery_view = !gallery_view; |
|||
$(this).html(gallery_view ? _("Disable gallery mode") : _("Enable gallery mode")); |
|||
toggle_gview(document); |
|||
}); |
|||
|
|||
var toggle_gview = function(elem) { |
|||
if (gallery_view) { |
|||
$(elem).find('img.post-image').parent().each(function() { |
|||
this.oldonclick = this.onclick; |
|||
this.onclick = handle_click; |
|||
$(this).attr('data-galid', Math.random()); |
|||
}); |
|||
} |
|||
else { |
|||
$(elem).find('img.post-image').parent().each(function() { |
|||
if (this.onclick == handle_click) this.onclick = this.oldonclick; |
|||
}); |
|||
} |
|||
}; |
|||
|
|||
$(document).on('new_post', toggle_gview); |
|||
|
|||
var gallery_opened = false; |
|||
|
|||
var handle_click = function(e) { |
|||
e.stopPropagation(); |
|||
e.preventDefault(); |
|||
|
|||
if (!gallery_opened) open_gallery(); |
|||
|
|||
gallery_setimage($(this).attr('data-galid')); |
|||
}; |
|||
|
|||
var handler, images, active, toolbar; |
|||
|
|||
var open_gallery = function() { |
|||
$('body').css('overflow', 'hidden'); |
|||
|
|||
gallery_opened = true; |
|||
|
|||
handler = $("<div id='alert_handler'></div>").hide().appendTo('body').css('text-align', 'left'); |
|||
|
|||
$("<div id='alert_background'></div>").click(close_gallery).appendTo(handler); |
|||
|
|||
images = $("<div id='gallery_images'></div>").appendTo(handler); |
|||
toolbar = $("<div id='gallery_toolbar'></div>").appendTo(handler); |
|||
active = $("<div id='gallery_main'></div>").appendTo(handler); |
|||
|
|||
active.on('click', function() { |
|||
close_gallery(); |
|||
}); |
|||
|
|||
$('img.post-image').parent().each(function() { |
|||
var thumb = $(this).find('img').attr('src'); |
|||
|
|||
var i = $('<img>').appendTo(images); |
|||
i.attr('src', thumb); |
|||
i.attr('data-galid-th', $(this).attr('data-galid')); |
|||
|
|||
i.on('click', function(e) { |
|||
gallery_setimage($(this).attr('data-galid-th')); |
|||
}); |
|||
}); |
|||
|
|||
$("<a href='javascript:void(0)'><i class='fa fa-times'></i></div>") |
|||
.click(close_gallery).appendTo(toolbar); |
|||
|
|||
handler.fadeIn(400); |
|||
}; |
|||
|
|||
var gallery_setimage = function(a) { |
|||
if (a == +1 || a == -1) { |
|||
var meth = (a == -1) ? 'prev' : 'next'; |
|||
a = $('#gallery_images img.active')[meth]().attr('data-galid-th'); |
|||
if (!a) return; |
|||
} |
|||
|
|||
$('#gallery_images img.active').removeClass('active'); |
|||
|
|||
var thumb = $('#gallery_images img[data-galid-th="'+a+'"]'); |
|||
var elem = $('a[data-galid="'+a+'"]'); |
|||
|
|||
thumb.addClass('active'); |
|||
|
|||
var topscroll = thumb.position().top + images.scrollTop(); |
|||
topscroll -= images.height() / 2; |
|||
topscroll += thumb.height() / 2; |
|||
images.animate({'scrollTop': topscroll}, 300); |
|||
|
|||
var img = elem.attr('href'); |
|||
|
|||
active.find('img').fadeOut(200, function() { $(this).remove(); }); |
|||
|
|||
var i = $('<img>'); |
|||
i.attr('src', img); |
|||
i.appendTo(active); |
|||
i.hide(); |
|||
|
|||
i.on('load', function() { |
|||
i.css('left', 'calc(50% - '+i.width()+'px / 2)'); |
|||
i.css('top', 'calc(50% - '+i.height()+'px / 2)'); |
|||
i.fadeIn(200); |
|||
}).on('click', function(e) { |
|||
e.stopPropagation(); |
|||
gallery_setimage(+1); |
|||
}); |
|||
}; |
|||
|
|||
var close_gallery = function() { |
|||
$('body').css('overflow', 'auto'); |
|||
|
|||
gallery_opened = false; |
|||
|
|||
handler.fadeOut(400, function() { handler.remove(); }); |
|||
}; |
|||
|
|||
}); |
Loading…
Reference in new issue