v26110248 孕妈广场切分类更顺:卡片高度改为直接计算,不再逐张量高;每列先出 14 张,其余滑入后补

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
deploy
2026-11-03 04:14:49 +00:00
parent 45b8a290f4
commit 5448410a69
8 changed files with 52 additions and 38 deletions

View File

@@ -581,10 +581,10 @@ button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:poin
<div id="sheet" role="dialog" aria-modal="true"><i class="sg"></i><div class="sbd" id="sbd"></div></div>
<div class="toast" id="toast"></div>
<script src="topics.js?v=26110247"></script>
<script src="data.js?v=26110247"></script>
<script src="feed.js?v=26110247"></script>
<script src="ceshi/meta.js?v=26110247"></script>
<script src="topics.js?v=26110248"></script>
<script src="data.js?v=26110248"></script>
<script src="feed.js?v=26110248"></script>
<script src="ceshi/meta.js?v=26110248"></script>
<script>
(function () {
'use strict';
@@ -650,7 +650,7 @@ button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:poin
var CMD = null, CMERR = false;
/* 头像编码:数字 = av/NNNN.webp(旧代码头像);'av:c012' = av/c012.webp(卡通/可爱卡通);'/…' = 站内绝对路径(内置头像库 /_bridge/avatars/);其余 = assets/img/mom/xxx.jpg */
var avP = function (a) { return typeof a === 'number' ? 'av/' + ('000' + a).slice(-4) + '.webp' : a.indexOf('av:') === 0 ? 'av/' + a.slice(3) + '.webp' : a.charAt(0) === '/' ? a : '../assets/img/mom/' + a + '.jpg'; };
fetch('cm.json?v=26110247').then(function (r) { return r.json(); }).then(function (j) {
fetch('cm.json?v=26110248').then(function (r) { return r.json(); }).then(function (j) {
CMD = j; if (openId && NBY[openId]) { renderComments(NBY[openId]); syncBar(NBY[openId]); }
}).catch(function () { CMERR = true; if (openId && NBY[openId]) renderComments(NBY[openId]); });
function commentsOf(n) {
@@ -939,29 +939,43 @@ button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:poin
list.forEach(function (n, k) { if (k >= 3 && (k - 3) % 8 === 0) { var tid = csq[ci++ % csq.length]; if (TMBY[tid]) mixed.push({ test: TMBY[tid] }); } mixed.push(n); });
list = [{ mine: 1 }].concat(mixed);
}
var nk = 0;
list.forEach(function (n, k) {
if (n.mine) {
tmp.innerHTML = myCardHTML(); var me = tmp.firstChild;
cols[0].appendChild(me); hs[0] += me.offsetHeight + 8;
tmp.innerHTML = favCardHTML(); var fe = tmp.firstChild;
cols[0].appendChild(fe); hs[0] += fe.offsetHeight + 8;
return;
}
if (n.test) {
tmp.innerHTML = testCardHTML(n.test, dn);
var te = tmp.firstChild; te.style.animationDelay = Math.min(k, 10) * 30 + 'ms';
var tc0 = hs[0] <= hs[1] ? 0 : 1; cols[tc0].appendChild(te); hs[tc0] += te.offsetHeight + 8; lastTx[tc0] = false;
return;
}
k = nk++;
/* 11-03 用户:切分类有点卡。原来每张卡塞进列里再 offsetHeight 量高,每量一次整页重排;85 张卡在中端机上卡 0.5 秒以上,正好卡在滑入动画中间。
现在:帖子卡高度直接算(封面 = 列宽 × 比例,底部 = 标题 1/2 行 + 作者行,和 .nc 样式对应),只有「我的投稿 / 收藏 / 测试卡」这几种
一次性批量量高;整列拼成字符串一次挂上,每列先出前 14 张,其余等滑入动画走完再补;入场动画只给前 12 张。 */
var tw = cw - 18;
function txtW(t) { var w = 0; for (var i = 0; i < t.length; i++) w += t.charCodeAt(i) > 255 ? 13.6 : 7.4; return w; }
function estH(n, r) { return cw * r + 8 + 9 + (txtW(n.title) > tw ? 2 : 1) * 19.6 + 7 + 18; }
var specials = [];
list.forEach(function (n) {
if (n.mine) specials.push(myCardHTML(), favCardHTML());
else if (n.test) specials.push(testCardHTML(n.test, dn));
});
var spH = [];
if (specials.length) {
var meas = document.createElement('div');
meas.className = 'col'; meas.style.cssText = 'position:absolute;left:0;top:0;width:' + cw + 'px;visibility:hidden;pointer-events:none';
meas.innerHTML = specials.join(''); wf.appendChild(meas);
[].forEach.call(meas.children, function (el) { spH.push(el.offsetHeight); }); /* 一次重排量完 */
wf.removeChild(meas);
}
var out = [[], []], si = 0, nk = 0, k2 = 0;
function anim(h, k) { return k >= 12 ? h.replace('class="nc', 'style="animation:none" class="nc') : h.replace('class="nc', 'style="animation-delay:' + Math.min(k, 10) * 30 + 'ms" class="nc'); }
function add(html, c, h) { out[c].push(anim(html, k2++)); hs[c] += h + 8; }
list.forEach(function (n) {
if (n.mine) { add(specials[si], 0, spH[si++]); add(specials[si], 0, spH[si++]); return; }
if (n.test) { var tc0 = hs[0] <= hs[1] ? 0 : 1; add(specials[si], tc0, spH[si++]); lastTx[tc0] = false; return; }
nk++;
var c = hs[0] <= hs[1] ? 0 : 1, sty = !lastTx[c] && n.photo ? (txN[c]++ % 2 ? 'tg' : 'ov') : '';
lastTx[c] = !!sty;
tmp.innerHTML = cardHTML(n, !cur, sty);
var el = tmp.firstChild; el.style.animationDelay = Math.min(k, 10) * 30 + 'ms';
cols[c].appendChild(el);
hs[c] += el.offsetHeight + 8;
var r = n.ratio; if (n.photo && sty === 'ov') r = Math.max(r, 1.33); else if (n.photo && sty === 'tg') r = Math.max(r, 1.2);
add(cardHTML(n, !cur, sty), c, estH(n, r));
});
var FIRST = 14, gen = renderFeed.gen = (renderFeed.gen || 0) + 1;
cols[0].innerHTML = out[0].slice(0, FIRST).join(''); cols[1].innerHTML = out[1].slice(0, FIRST).join('');
if (out[0].length > FIRST || out[1].length > FIRST) setTimeout(function () {
if (gen !== renderFeed.gen) return; /* 期间又切了分类,作废 */
cols[0].insertAdjacentHTML('beforeend', out[0].slice(FIRST).join('')); cols[1].insertAdjacentHTML('beforeend', out[1].slice(FIRST).join(''));
}, 450);
/* 话题下帖子看完,接着引到同分类其他话题,避免以为这块只有这几篇 */
var mo = $('#more'), tc = cur && TBY[cur];
if (tc) {