gallery fix

This commit is contained in:
2026-02-21 21:39:23 +01:00
parent e4e0bdf8f1
commit 48e2055b6a
20 changed files with 1064 additions and 481 deletions

View File

@@ -44,6 +44,13 @@ $(document).on("change", ".quickThumbShow", function(evt) {
});
var numCols = 4;
var GRID_V2_ENABLED = (function () {
try {
return new URLSearchParams(window.location.search).get('grid') === 'v2';
} catch (e) {
return false;
}
})();
$(document).ready(function() {
@@ -73,22 +80,28 @@ $(document).ready(function() {
$(".photo_frame").css("width", "250px");
}
$container1.isotope({
masonry: { columnWidth: wc }
});
if (!GRID_V2_ENABLED) {
$container1.isotope({
masonry: { columnWidth: wc }
});
}
}
$container1.imagesLoaded( function() {
$container1.isotope({
itemSelector : '.photo_frame',
layoutMode : 'masonry'
if (!GRID_V2_ENABLED) {
$container1.imagesLoaded( function() {
$container1.isotope({
itemSelector : '.photo_frame',
layoutMode : 'masonry'
});
size();
});
size();
});
}
$(window).smartresize(size);
if (!GRID_V2_ENABLED) {
$(window).smartresize(size);
}
$(".summernote").summernote();
$(".summernote_lite").summernote({
@@ -101,21 +114,25 @@ $(document).ready(function() {
});
var $container = $('.container_gallery');
$container.imagesLoaded( function(){
$container.isotope({
itemSelector : '.photo_frame',
layoutMode : 'masonry'
if (!GRID_V2_ENABLED) {
$container.imagesLoaded( function(){
$container.isotope({
itemSelector : '.photo_frame',
layoutMode : 'masonry'
});
size();
});
size();
});
}
var $container = $('.container_news');
$container.imagesLoaded( function(){
$container.isotope({
itemSelector : '.news_frame',
layoutMode : 'masonry'
if (!GRID_V2_ENABLED) {
$container.imagesLoaded( function(){
$container.isotope({
itemSelector : '.news_frame',
layoutMode : 'masonry'
});
});
});
}
if ($("a[rel^='prettyPhoto']").length > 0) {
$("a[rel^='prettyPhoto']").prettyPhoto({theme:'dark_rounded'});

View File

@@ -6,6 +6,14 @@
(function () {
'use strict';
var GRID_V2_ENABLED = (function () {
try {
return new URLSearchParams(window.location.search).get('grid') === 'v2';
} catch (e) {
return false;
}
})();
var MAX_DOM_CARDS_FOR_VIRTUAL_HINT = 220;
var LOAD_TRIGGER_MARGIN = '900px';
@@ -28,11 +36,16 @@
box.classList.remove('is-loading');
return;
}
var templateHost = root.querySelector('[data-gallery-skeleton-template]');
var templateNode = templateHost ? templateHost.firstElementChild : null;
box.classList.add('is-loading');
var total = Math.max(4, count || 8);
for (var i = 0; i < total; i += 1) {
var sk = document.createElement('div');
sk.className = 'nova-skeleton-card';
var sk = templateNode ? templateNode.cloneNode(true) : document.createElement('div');
if (!templateNode) {
sk.className = 'nova-skeleton-card';
sk.innerHTML = '<div class="nova-skeleton-media"></div><div class="nova-skeleton-body"><div class="nova-skeleton-line"></div><div class="nova-skeleton-line"></div><div class="nova-skeleton-pill"></div></div>';
}
box.appendChild(sk);
}
}
@@ -131,25 +144,6 @@
var grid = root.querySelector('[data-gallery-grid]');
if (!grid) return;
// loader overlay element (created lazily)
var loader = null;
function ensureLoader() {
if (loader) return loader;
loader = document.createElement('div');
loader.className = 'nova-loader-overlay';
var inner = document.createElement('div');
inner.className = 'nova-loader-spinner';
loader.appendChild(inner);
// place loader as child of root so it overlays grid area
loader.style.display = 'none';
root.style.position = root.style.position || '';
root.appendChild(loader);
return loader;
}
function showLoader() { var l = ensureLoader(); l.style.display = 'flex'; }
function hideLoader() { if (loader) loader.style.display = 'none'; }
root.classList.add('is-enhanced');
var state = {
@@ -159,8 +153,20 @@
};
function relayout() {
waitForImages(grid).then(function () {
// Apply masonry synchronously first — the card already has inline aspect-ratio
// set from image dimensions, so getBoundingClientRect() returns the correct
// reserved height immediately at DOMContentLoaded without waiting for decode.
// This collapses both the is-enhanced class change and span assignment into one
// paint frame, eliminating the visible layout jump (CLS).
if (!GRID_V2_ENABLED) {
applyMasonry(root);
}
// Secondary pass after images finish decoding — corrects any lazy-loaded or
// dynamically-appended cards whose heights weren't yet known.
waitForImages(grid).then(function () {
if (!GRID_V2_ENABLED) {
applyMasonry(root);
}
applyVirtualizationHints(root);
});
}
@@ -178,8 +184,6 @@
if (state.loading || state.done || !state.nextUrl) return;
state.loading = true;
showLoader();
var sampleCards = toArray(grid.querySelectorAll('.nova-card'));
var skeletonCount = Math.min(12, Math.max(4, sampleCards.length ? sampleCards.slice(-4).length * 2 : 8));
setSkeleton(root, true, skeletonCount);
@@ -215,7 +219,6 @@
} finally {
state.loading = false;
setSkeleton(root, false);
hideLoader();
}
}

View File

@@ -1,4 +1,4 @@
var m_html = '<br/><br/><div align="center"><img src="/gfx/loading.gif" alt="" /></div><br/><br/>';
var m_html = '<br/><br/><div align="center"><img src="/gfx/loading.gif" alt="" /></div><br/><br/>';
var m_browser=0;
var m_browser2=0;
var m_browser3=0;
@@ -58,7 +58,7 @@ $(document).on("click", ".addFavourites", function() {
console.log(id);
$.getJSON("/ajax/add_artwork_favourites/" + id, function(data) {
});
});
});
$(document).on("change", "#root_categories", function() {
var id = $("#root_categories option:selected").val();
@@ -118,12 +118,12 @@ $(document).on("click", ".follow_user", function() {
$(document).on("change", ".quickThumbShow", function(evt) {
var preview = $(this).data("preview_id");
var preview = $(this).data("preview_id");
var files = evt.target.files;
var f = files[0];
var reader = new FileReader();
reader.onload = (function(theFile) {
return function(e) {
fname = (theFile.name);
@@ -136,48 +136,59 @@ $(document).on("change", ".quickThumbShow", function(evt) {
}
};
})(f);
reader.readAsDataURL(f);
});
var numCols = 4;
var GRID_V2_ENABLED = (function () {
try {
return new URLSearchParams(window.location.search).get('grid') === 'v2';
} catch (e) {
return false;
}
})();
function size() {
NProgress.start();
var $container_photo = $('.container_photo');
var w = $container_photo.width();
var c = Math.floor(w / 250);
var wc = parseInt($container_photo.width() / c);
var r = parseInt(w / c) - 30;
//console.log(w, "Cols:" + c, "width: " + r + "px");
$(".photo_frame").css("width", r + "px")
$container_photo.isotope({
masonry: { columnWidth: c }
});
if (!GRID_V2_ENABLED) {
$container_photo.isotope({
masonry: { columnWidth: c }
});
$container_photo.imagesLoaded( function() {
$container_photo.isotope({
itemSelector : '.photo_frame',
layoutMode : 'masonry'
});
});
$container_photo.imagesLoaded( function() {
$container_photo.isotope({
itemSelector : '.photo_frame',
layoutMode : 'masonry'
});
});
$container_photo.isotope( 'on', 'layoutComplete', function() {
var hgt = $("#artwork_browser").css("height");
if (hgt < 500) {
hgt = 500;
}
$("#artwork_subcategories").css("height", hgt);
});
$container_photo.isotope( 'on', 'layoutComplete', function() {
var hgt = $("#artwork_browser").css("height");
if (hgt < 500) {
hgt = 500;
}
$("#artwork_subcategories").css("height", hgt);
});
}
NProgress.done();
} // End size()
size();
if (!GRID_V2_ENABLED) {
size();
}
$(document).ready(function() {
@@ -186,16 +197,18 @@ $(document).ready(function() {
NProgress.start();
$(".scrollContent").mCustomScrollbar();
$(".artwork-zoom").magnificPopup({
type: 'image',
removalDelay: 3800,
mainClass: 'mfp-fade'
});
$(window).smartresize(size);
//size();
if (!GRID_V2_ENABLED) {
$(window).smartresize(size);
}
//size();
$(".selectme").select2();
$(".summernote").summernote();
$(".summernote_lite").summernote({
@@ -206,41 +219,43 @@ $(document).ready(function() {
['color', ['color']],
]
});
var $box_gallery = $('.box_gallery');
$box_gallery.imagesLoaded( function(){
$box_gallery.isotope({
itemSelector : '.img-frame',
layoutMode : 'masonry'
});
});
var $container_comments = $(".masonry");
$container_comments.imagesLoaded( function(){
$container_comments.isotope({
itemSelector : '.masonry_item',
layoutMode : 'masonry'
});
});
var $container_news = $('.container_news');
$container_news.imagesLoaded( function(){
$container_news.isotope({
itemSelector : '.news_frame',
layoutMode : 'masonry'
});
});
if (!GRID_V2_ENABLED) {
var $box_gallery = $('.box_gallery');
$box_gallery.imagesLoaded( function(){
$box_gallery.isotope({
itemSelector : '.img-frame',
layoutMode : 'masonry'
});
});
var $container_comments = $(".masonry");
$container_comments.imagesLoaded( function(){
$container_comments.isotope({
itemSelector : '.masonry_item',
layoutMode : 'masonry'
});
});
var $container_news = $('.container_news');
$container_news.imagesLoaded( function(){
$container_news.isotope({
itemSelector : '.news_frame',
layoutMode : 'masonry'
});
});
}
if ($("a[rel^='prettyPhoto']").length > 0) {
$("a[rel^='prettyPhoto']").prettyPhoto({theme:'dark_rounded'});
}
$("#sideBarSep").click(function() {
if(sbc == 0) {
$("#sideBarChat").animate({
height: '700px'
}, 1000, function(){
@@ -263,13 +278,13 @@ $(document).ready(function() {
}
});
if ($(".followingButton").length > 0) {
$(".followingButton").click(function() {
$("#showNoticeBox").load("/include/hideNoticeBox.php?show=following");
});
}
if ($(".streamPost").length > 0) {
var remme = false;
$(".stream_Remove").click(function() {
@@ -280,7 +295,7 @@ $(document).ready(function() {
remme = true;
}
});
$(".streamPost").click(function() {
$("BODY").scrollTop(0);
var wid = $(this).attr("rel");
@@ -292,41 +307,41 @@ $(document).ready(function() {
}
remme = false;
});
}
if ($("#js-news").length >0) {
$('#js-news').ticker();
}
if ($("#imageTicker").length >0) {
$("#imageTicker").slideDown().newsticker();
}
if ($(".changeCoverArt").length > 0) {
$(".changeCoverArt").click(function() {
$("#mywindow").center();
$("#mywindow").show();
});
}
$(".openwin").fancybox({});
$('#ajaxForm').submit(function() {
alert('Handler for .submit() called.');
return false;
});
$(".btn_category").fancybox({
'href' : '/ajax/show-categories',
'width' : 600,
'height' : 200,
'transitionIn' : 'fade'
});
$(".navbar-fixed-top").autoHidingNavbar({
});
@@ -348,7 +363,7 @@ $(document).ready(function() {
if ($("#chat_box").length > 0) {
InitChat();
}
$("#loginMenu span").click(function() {
$("#subLoginMenu").toggle();
});
@@ -357,7 +372,7 @@ $(document).ready(function() {
$("#browseMenu").click(function(){
//showCategories();
$("#browserMenuList").toggle();
});
}
@@ -379,7 +394,7 @@ $(document).ready(function() {
$("#update_button").html("Attach link");
$("#streamMessage").val("http://");
});
$("#publishButton").click(function(){
//event.preventDefault();
var type = $("#streamType").val();
@@ -387,16 +402,16 @@ $(document).ready(function() {
//alert("/social/getStreamData.php?type="+type+"&data="+data);
$("#streamWork").load("/social/getStreamData.php?type="+type+"&data="+data);
$("#streamMessage").val("");
});
$("#shareBox textarea").elastic();
/*if($("#total_msgs").length > 0) {
showDownloadCounter();
}*/
$('textarea.tinymce').tinymce({
// Location of TinyMCE script
@@ -429,12 +444,12 @@ function showSubCat(id) {
function put_smiley(smiley,outp) {
document.forms['newMsg'].comment.value += ' ' + smiley + ' ';
document.forms['newMsg'].comment.focus();
}
function put_smiley_art(smiley,outp) {
document.forms['newMsg'].commentText.value += ' ' + smiley + ' ';
document.forms['newMsg'].commentText.focus();
document.forms['newMsg'].commentText.focus();
}
function put_smiley_chat(smiley) {
@@ -450,14 +465,14 @@ function put_smiley2(smiley,outp)
document.forms['newMsg'].Review.focus();
}
function expw(listID)
function expw(listID)
{
if (document.getElementById(listID).style.display=="none")
if (document.getElementById(listID).style.display=="none")
{
document.getElementById(listID).style.display="";
document.getElementById(listID).style.visibility="visible";
}
else
else
{
document.getElementById(listID).style.display="none";
document.getElementById(listID).style.visibility="hidden";
@@ -465,7 +480,7 @@ function expw(listID)
}
function contw(listID)
function contw(listID)
{
if (listID.style.display=="show") {listID.style.display="";}
else {listID.style.display="none";}
@@ -475,7 +490,7 @@ function contw(listID)
function Confirm(link,text)
function Confirm(link,text)
{
if(confirm(text))
window.location=link
@@ -510,7 +525,7 @@ function InitChat() {
NProgress.done();
}
function compare(s1, s2) {
function compare(s1, s2) {
return s1===s2;
}
@@ -590,12 +605,12 @@ function ShowPrivateMessage(id) {
function ShowPrivateMessageList(box, id) {
if (box !== 'new') {
$("#msgList").html(m_html);
$("#msgShow").html('');
}
if (box == 'new') {
//alert ("/privmsg.php?ajax=true&action=msgList&box="+box+"&id=" + id);
$("#msgShow").load("/privmsg.php?ajax=true&action=msgList&box="+box+"&id=" + id);
@@ -628,7 +643,7 @@ function showDailySkins(datums,x){
document.getElementById('tab-'+selected_tab).style.fontWeight = 'normal';
document.getElementById('tab-'+selected_tab).style.backgroundColor = '#eee';
}
document.getElementById('tab-'+x).style.fontWeight = 'bold';
document.getElementById('tab-'+x).style.backgroundColor = '#ccc';
selected_tab = x;
@@ -675,7 +690,7 @@ function showCategories2(namek)
//new Effect.Appear(document.getElementById("displayCategories"));
document.getElementById("mainDisplay2").style.visibility = "visible";
updateSkinBrowser("displayCategories2",0,0);
}
}
}
@@ -690,7 +705,7 @@ function findPosX(obj)
{
var curleft = 0;
if(obj.offsetParent)
while(1)
while(1)
{
curleft += obj.offsetLeft;
if(!obj.offsetParent)
@@ -749,37 +764,37 @@ function removeNotice(id,type) {
$(this).css({position:'absolute', margin:0, top: (top > 0 ? top : 0)+'px', left: (left > 0 ? left : 0)+'px'});
});
}
});
});
})(jQuery);
(function($,sr){
// debouncing function from John Hann
// http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/
var debounce = function (func, threshold, execAsap) {
var timeout;
return function debounced () {
var obj = this, args = arguments;
function delayed () {
if (!execAsap)
func.apply(obj, args);
timeout = null;
timeout = null;
};
if (timeout)
clearTimeout(timeout);
else if (execAsap)
func.apply(obj, args);
timeout = setTimeout(delayed, threshold || 100);
timeout = setTimeout(delayed, threshold || 100);
};
}
// smartresize
// smartresize
jQuery.fn[sr] = function(fn){ return fn ? this.bind('resize', debounce(fn)) : this.trigger(sr); };
})(jQuery,'smartresize');
@@ -800,4 +815,4 @@ function getCookie(cname) {
if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
}
return "";
}
}