Index: src/views/pages/news.ejs =================================================================== --- src/views/pages/news.ejs (revision 544e9c2cff7bc4f99708d4cc7891946bb798614f) +++ src/views/pages/news.ejs (revision 7b04d3b709bae5f43a5c7f73f2d86123a46aa1d4) @@ -88,72 +88,10 @@ <% } else { %> -
    +
      <% timeline.forEach(function(p){ %> -
    1. - <% if (p.reblog_name) { %>
      <%= p.reblog_name %> <%= t('tl.boosted') %>
      <% } %> -
      - <% if (p.author_icon) { %><% } else { %><%= (p.author_name || '?').charAt(0).toUpperCase() %><% } %> - - <%= p.author_name %> - <%= p.author_handle %> - - <% if (p.published || p.created_at) { %><% } %> -
      - - <% - var media = []; try { media = JSON.parse(p.media_json || '[]'); } catch (e) { media = []; } - var imgs = media.filter(function(m){ return m && m.url && (!m.type || /^image\//.test(m.type)); }); - var vids = media.filter(function(m){ return m && m.url && m.type && /^video\//.test(m.type); }); - var auds = media.filter(function(m){ return m && m.url && m.type && /^audio\//.test(m.type); }); - var _nsfwVisual = !!p.nsfw && (imgs.length || vids.length || auds.length); - var _nsfwText = !!p.nsfw && !(imgs.length || vids.length || auds.length); - %> - <% if (_nsfwText) { %> -
      <%- include('../partials/nsfw-veil', { cw: p.cw }) %><%- p.content %>
      - <% } else { %> -
      <%- p.content %>
      - <% } %> - <% if (_nsfwVisual) { %>
      <% } %> - <% if (imgs.length) { %> -
      - <% imgs.forEach(function(m){ %> - - <% }); %> -
      - <% } %> - <% vids.forEach(function(m){ %><% }); %> - <% /* A Klonkt audio post carries an embed player (embedHtml/embedUrl) that already - covers these tracks, so don't ALSO render the raw Audio attachments as bare - players here. Posts without a Klonkt embed (e.g. a plain remote audio) keep them. */ %> - <% if (!p.embedHtml && !p.embedUrl) { auds.forEach(function(m){ %><% }); } %> - <% if (_nsfwVisual) { %>
      <%- include('../partials/nsfw-veil', { cw: p.cw }) %>
      <% } %> - - <% if (p.embedHtml) { %>
      <%- p.embedHtml %>
      <% } %> - <% if (p.embedUrl) { %>▶ <%= t('tl.open_player') %><% } %> - - <% if (p.poll) { var _pl=p.poll; var _tot=_pl.options.reduce(function(s,o){return s+(o.count||0);},0); var _voteable=!_pl.closed&&!_pl.voted; %> -
      - <% if (_voteable) { %> -
      - - <% _pl.options.forEach(function(o){ %><% }); %> - -
      - <% } else { _pl.options.forEach(function(o){ var _pct=_tot?Math.round((o.count||0)*100/_tot):0; var _mine=_pl.voted&&(Array.isArray(_pl.voted)?_pl.voted.indexOf(o.name)>=0:_pl.voted===o.name); %>
      <%= _mine?'✓ ':'' %><%= o.name %><%= _pct %>%
      <% }); } %> -
      <%= (_pl.voters!=null?_pl.voters:_tot) %> <%= t('poll.votes') %><% if(_pl.closed){ %> · <%= t('poll.closed') %><% } %>
      -
      - <% } %> - - <% if (p.url) { %><%= t('tl.view_original') %><% } %> - -
      -
      -
      - -
      -
      -
      2. + <%- include('../partials/tl-item', { p: p }) %> <% }); %>
    + <%- include('../partials/load-more', { hasMore: hasMore, nextOffset: nextOffset, moreBase: moreBase, moreTarget: '#tl-feed', morePath: '/news' }) %> <% } %> Index: src/views/partials/load-more.ejs =================================================================== --- src/views/partials/load-more.ejs (revision 7b04d3b709bae5f43a5c7f73f2d86123a46aa1d4) +++ src/views/partials/load-more.ejs (revision 7b04d3b709bae5f43a5c7f73f2d86123a46aa1d4) @@ -0,0 +1,16 @@ +<% + // Reusable "Load more" control. On the full page it sits after the feed; the + // append response re-emits it with oob=true so htmx swaps the fresh button + // (next offset) in place of the old one, and drops it on the last page. + var _oob = (typeof oob !== 'undefined' && oob); + var _target = (typeof moreTarget !== 'undefined' && moreTarget) ? moreTarget : '#feed'; + var _path = (typeof morePath !== 'undefined' && morePath) ? morePath : ''; + var _base = (typeof moreBase !== 'undefined' && moreBase) ? moreBase : ''; +%> +
    hx-swap-oob="true"<% } %>> + <% if (hasMore) { %> + + <% } %> +
    Index: src/views/partials/news-append.ejs =================================================================== --- src/views/partials/news-append.ejs (revision 7b04d3b709bae5f43a5c7f73f2d86123a46aa1d4) +++ src/views/partials/news-append.ejs (revision 7b04d3b709bae5f43a5c7f73f2d86123a46aa1d4) @@ -0,0 +1,2 @@ +<% timeline.forEach(function(p){ %><%- include('tl-item', { p: p }) %><% }); %> +<%- include('load-more', { hasMore: hasMore, nextOffset: nextOffset, moreBase: moreBase, moreTarget: '#tl-feed', morePath: '/news', oob: true }) %> Index: src/views/partials/shared-styles.ejs =================================================================== --- src/views/partials/shared-styles.ejs (revision 544e9c2cff7bc4f99708d4cc7891946bb798614f) +++ src/views/partials/shared-styles.ejs (revision 7b04d3b709bae5f43a5c7f73f2d86123a46aa1d4) @@ -183,3 +183,13 @@ .htmx-request .pcms-loading { display: block; } @keyframes spin { to { transform: rotate(360deg); } } + +/* Load more (Solo, Cirkel, News, Messages) — page size 72, htmx append. */ +.load-more-wrap { display: flex; justify-content: center; margin: 1.5rem 0 .5rem; } +.load-more-wrap:empty { margin: 0; } +.load-more-btn { padding: .6rem 1.4rem; border-radius: 999px; cursor: pointer; + font: inherit; font-weight: 600; color: var(--ink, inherit); + background: color-mix(in srgb, var(--ink, #000) 5%, transparent); + border: 1px solid color-mix(in srgb, var(--ink, #000) 14%, transparent); } +.load-more-btn:hover { background: color-mix(in srgb, var(--ink, #000) 9%, transparent); } +.load-more-btn.htmx-request { opacity: .6; pointer-events: none; } Index: src/views/partials/tl-item.ejs =================================================================== --- src/views/partials/tl-item.ejs (revision 7b04d3b709bae5f43a5c7f73f2d86123a46aa1d4) +++ src/views/partials/tl-item.ejs (revision 7b04d3b709bae5f43a5c7f73f2d86123a46aa1d4) @@ -0,0 +1,64 @@ +
  1. + <% if (p.reblog_name) { %>
    <%= p.reblog_name %> <%= t('tl.boosted') %>
    <% } %> +
    + <% if (p.author_icon) { %><% } else { %><%= (p.author_name || '?').charAt(0).toUpperCase() %><% } %> + + <%= p.author_name %> + <%= p.author_handle %> + + <% if (p.published || p.created_at) { %><% } %> +
    + + <% + var media = []; try { media = JSON.parse(p.media_json || '[]'); } catch (e) { media = []; } + var imgs = media.filter(function(m){ return m && m.url && (!m.type || /^image\//.test(m.type)); }); + var vids = media.filter(function(m){ return m && m.url && m.type && /^video\//.test(m.type); }); + var auds = media.filter(function(m){ return m && m.url && m.type && /^audio\//.test(m.type); }); + var _nsfwVisual = !!p.nsfw && (imgs.length || vids.length || auds.length); + var _nsfwText = !!p.nsfw && !(imgs.length || vids.length || auds.length); + %> + <% if (_nsfwText) { %> +
    <%- include('../partials/nsfw-veil', { cw: p.cw }) %><%- p.content %>
    + <% } else { %> +
    <%- p.content %>
    + <% } %> + <% if (_nsfwVisual) { %>
    <% } %> + <% if (imgs.length) { %> +
    + <% imgs.forEach(function(m){ %> + + <% }); %> +
    + <% } %> + <% vids.forEach(function(m){ %><% }); %> + <% /* A Klonkt audio post carries an embed player (embedHtml/embedUrl) that already + covers these tracks, so don't ALSO render the raw Audio attachments as bare + players here. Posts without a Klonkt embed (e.g. a plain remote audio) keep them. */ %> + <% if (!p.embedHtml && !p.embedUrl) { auds.forEach(function(m){ %><% }); } %> + <% if (_nsfwVisual) { %>
    <%- include('../partials/nsfw-veil', { cw: p.cw }) %>
    <% } %> + + <% if (p.embedHtml) { %>
    <%- p.embedHtml %>
    <% } %> + <% if (p.embedUrl) { %>▶ <%= t('tl.open_player') %><% } %> + + <% if (p.poll) { var _pl=p.poll; var _tot=_pl.options.reduce(function(s,o){return s+(o.count||0);},0); var _voteable=!_pl.closed&&!_pl.voted; %> +
    + <% if (_voteable) { %> +
    + + <% _pl.options.forEach(function(o){ %><% }); %> + +
    + <% } else { _pl.options.forEach(function(o){ var _pct=_tot?Math.round((o.count||0)*100/_tot):0; var _mine=_pl.voted&&(Array.isArray(_pl.voted)?_pl.voted.indexOf(o.name)>=0:_pl.voted===o.name); %>
    <%= _mine?'✓ ':'' %><%= o.name %><%= _pct %>%
    <% }); } %> +
    <%= (_pl.voters!=null?_pl.voters:_tot) %> <%= t('poll.votes') %><% if(_pl.closed){ %> · <%= t('poll.closed') %><% } %>
    +
    + <% } %> + + <% if (p.url) { %><%= t('tl.view_original') %><% } %> + +
    +
    +
    + +
    +
    +