Module:MasonryLayout: Difference between revisions

// via Wikitext Extension for VSCode
// via Wikitext Extension for VSCode
Tag: Reverted
Line 621: Line 621:
function p.renderDistributedLayout(distribution, options)
function p.renderDistributedLayout(distribution, options)
     options = options or {}
     options = options or {}
    local columnClass = options.columnClass or 'country-hub-masonry-column'
     local cardClass = options.cardClass or 'country-hub-masonry-card'
     local cardClass = options.cardClass or 'country-hub-masonry-card'
      
      
Line 631: Line 630:
     end
     end
      
      
     -- Build HTML for each column
     -- Build flat list of cards with column and order data attributes
     local columnHtml = {}
     local allCards = {}
    local cardOrder = 1
      
      
     for i = 1, columnCount do
    -- First pass: collect intro and infoBox cards to ensure they come first
         local columnCards = columns[i]
     for colNum = 1, columnCount do
        local cardHtml = {}
         local columnCards = columns[colNum]
       
         for _, card in ipairs(columnCards) do
        -- Render cards in this column
             if card.id == 'intro' or card.id == 'infoBox' then
         for j, card in ipairs(columnCards) do
                 table.insert(allCards, {
             -- ALL cards should be wrapped in the card class for consistent styling
                    card = card,
            cardHtml[j] = string.format(
                    column = colNum,
                '<div class="%s" data-card-id="%s">%s</div>',
                    order = cardOrder
                 cardClass,
                 })
                card.id or 'unknown',
                cardOrder = cardOrder + 1
                 card.content or EMPTY_STRING
             end
             )
         end
         end
          
    end
         -- Wrap column
   
         columnHtml[i] = string.format(
    -- Second pass: collect all other cards
             '<div class="%s" data-column="%d">%s</div>',
    for colNum = 1, columnCount do
             columnClass,
        local columnCards = columns[colNum]
             i,
         for _, card in ipairs(columnCards) do
             table.concat(cardHtml, '\n')
            if card.id ~= 'intro' and card.id ~= 'infoBox' then
                table.insert(allCards, {
                    card = card,
                    column = colNum,
                    order = cardOrder
                })
                cardOrder = cardOrder + 1
            end
         end
    end
   
    -- Build HTML for flat structure
    local cardHtml = {}
   
    for i, item in ipairs(allCards) do
         cardHtml[i] = string.format(
             '<div class="%s" data-card-id="%s" data-column="%d" data-order="%d">%s</div>',
             cardClass,
            item.card.id or 'unknown',
             item.column,
             item.order,
            item.card.content or EMPTY_STRING
         )
         )
     end
     end
      
      
     return table.concat(columnHtml, '\n')
     return table.concat(cardHtml, '\n')
end
end