CARVIEW |
Select Language
HTTP/2 200
date: Sun, 12 Oct 2025 13:33:41 GMT
content-type: text/html; charset=utf-8
vary: X-PJAX, X-PJAX-Container, Turbo-Visit, Turbo-Frame, X-Requested-With,Accept-Encoding, Accept, X-Requested-With
etag: W/"9d98d7680d852e14bfc8e75cb60bd46d"
cache-control: max-age=0, private, must-revalidate
strict-transport-security: max-age=31536000; includeSubdomains; preload
x-frame-options: deny
x-content-type-options: nosniff
x-xss-protection: 0
referrer-policy: origin-when-cross-origin, strict-origin-when-cross-origin
content-security-policy: default-src 'none'; base-uri 'self'; child-src github.githubassets.com github.com/assets-cdn/worker/ github.com/assets/ gist.github.com/assets-cdn/worker/; connect-src 'self' uploads.github.com www.githubstatus.com collector.github.com raw.githubusercontent.com api.github.com github-cloud.s3.amazonaws.com github-production-repository-file-5c1aeb.s3.amazonaws.com github-production-upload-manifest-file-7fdce7.s3.amazonaws.com github-production-user-asset-6210df.s3.amazonaws.com *.rel.tunnels.api.visualstudio.com wss://*.rel.tunnels.api.visualstudio.com github.githubassets.com objects-origin.githubusercontent.com copilot-proxy.githubusercontent.com proxy.individual.githubcopilot.com proxy.business.githubcopilot.com proxy.enterprise.githubcopilot.com *.actions.githubusercontent.com wss://*.actions.githubusercontent.com productionresultssa0.blob.core.windows.net/ productionresultssa1.blob.core.windows.net/ productionresultssa2.blob.core.windows.net/ productionresultssa3.blob.core.windows.net/ productionresultssa4.blob.core.windows.net/ productionresultssa5.blob.core.windows.net/ productionresultssa6.blob.core.windows.net/ productionresultssa7.blob.core.windows.net/ productionresultssa8.blob.core.windows.net/ productionresultssa9.blob.core.windows.net/ productionresultssa10.blob.core.windows.net/ productionresultssa11.blob.core.windows.net/ productionresultssa12.blob.core.windows.net/ productionresultssa13.blob.core.windows.net/ productionresultssa14.blob.core.windows.net/ productionresultssa15.blob.core.windows.net/ productionresultssa16.blob.core.windows.net/ productionresultssa17.blob.core.windows.net/ productionresultssa18.blob.core.windows.net/ productionresultssa19.blob.core.windows.net/ github-production-repository-image-32fea6.s3.amazonaws.com github-production-release-asset-2e65be.s3.amazonaws.com insights.github.com wss://alive.github.com wss://alive-staging.github.com api.githubcopilot.com api.individual.githubcopilot.com api.business.githubcopilot.com api.enterprise.githubcopilot.com; font-src github.githubassets.com; form-action 'self' github.com gist.github.com copilot-workspace.githubnext.com objects-origin.githubusercontent.com; frame-ancestors 'none'; frame-src viewscreen.githubusercontent.com notebooks.githubusercontent.com; img-src 'self' data: blob: github.githubassets.com media.githubusercontent.com camo.githubusercontent.com identicons.github.com avatars.githubusercontent.com private-avatars.githubusercontent.com github-cloud.s3.amazonaws.com objects.githubusercontent.com release-assets.githubusercontent.com secured-user-images.githubusercontent.com/ user-images.githubusercontent.com/ private-user-images.githubusercontent.com opengraph.githubassets.com marketplace-screenshots.githubusercontent.com/ copilotprodattachments.blob.core.windows.net/github-production-copilot-attachments/ github-production-user-asset-6210df.s3.amazonaws.com customer-stories-feed.github.com spotlights-feed.github.com objects-origin.githubusercontent.com *.githubusercontent.com; manifest-src 'self'; media-src github.com user-images.githubusercontent.com/ secured-user-images.githubusercontent.com/ private-user-images.githubusercontent.com github-production-user-asset-6210df.s3.amazonaws.com gist.github.com; script-src github.githubassets.com; style-src 'unsafe-inline' github.githubassets.com; upgrade-insecure-requests; worker-src github.githubassets.com github.com/assets-cdn/worker/ github.com/assets/ gist.github.com/assets-cdn/worker/
server: github.com
content-encoding: gzip
accept-ranges: bytes
set-cookie: _gh_sess=ol0anGFqNzeNOlqISmiYz%2B3B%2F9GmQvIcP%2B2p6jRzDM%2FIL2g6IwbqlEcgSk2y4w8cWdaUluTsouNsjrsWyQaQC5MvwrRtf0rhncjmyhqN%2By6N1ieDMVzo1iNJ6bnMg%2F8FggownUnly7wgUJauscMgEt%2FRrEtcXvuZJP6nT6JRa9yCaSi1Hu5Xg3JVva5v0BjWHQ5nVKmS6Xux%2FlwlxqpBLcE2%2BOw9nw2ew88rJS44n28Od7gyG1%2BKonsZOggLJ%2BdQwiKuqAUXLKd%2BXe%2FHaRxIiA%3D%3D--6FG5LDzy2QihiwaE--nAnjx75lCdTzubPRYqcIfQ%3D%3D; Path=/; HttpOnly; Secure; SameSite=Lax
set-cookie: _octo=GH1.1.1718269760.1760276021; Path=/; Domain=github.com; Expires=Mon, 12 Oct 2026 13:33:41 GMT; Secure; SameSite=Lax
set-cookie: logged_in=no; Path=/; Domain=github.com; Expires=Mon, 12 Oct 2026 13:33:41 GMT; HttpOnly; Secure; SameSite=Lax
x-github-request-id: 9BFE:1FDE52:FEBD11:151F911:68EBAE35
Group Artworks into columns for a pinterest style layout (for use in emails) · GitHub
Show Gist options
Save mzikherman/9610125 to your computer and use it in GitHub Desktop.
{{ message }}
Instantly share code, notes, and snippets.
Created
March 17, 2014 22:59
-
Star
3
(3)
You must be signed in to star a gist -
Fork
0
(0)
You must be signed in to fork a gist
-
Save mzikherman/9610125 to your computer and use it in GitHub Desktop.
Group Artworks into columns for a pinterest style layout (for use in emails)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
module ArtworkColumns | |
# Return an array of artworks grouped together in sub arrays by being added to the shortest 'column' | |
# based on a fixed width and aspect ratios. | |
# | |
# @param {Array} artworks The array of artworks to group into columns | |
# @param {Number} num_columns The number of columns to group them into | |
# @param {Number} width The width the images will be displayed at | |
# | |
# @return {Array} An array of artworks grouped into sub arrays by being added to the shortest one. | |
def self.artwork_columns(artworks, num_columns, width) | |
artwork_cols = [] | |
# Initialize columns | |
num_columns.times do | |
artwork_cols << [] | |
end | |
artworks.each do |artwork| | |
add_to_shortest_column!(artwork_cols, artwork, width) if artwork.default_image | |
end | |
artwork_cols | |
end | |
private | |
# Adds artwork to shortest column | |
def self.add_to_shortest_column!(artwork_cols, artwork, width) | |
min_height = column_height(artwork_cols[0], width) | |
min_column_idx = 0 | |
artwork_cols.each_with_index do |column, idx| | |
height = column_height(column, width) | |
if height < min_height | |
min_height = height | |
min_column_idx = idx | |
end | |
end | |
artwork_cols[min_column_idx] << artwork | |
end | |
# Calculate sum of heights of artworks in column | |
def self.column_height(artwork_col, width) | |
height = 0 | |
artwork_col.each do |artwork| | |
if (aspect_ratio = artwork.default_image.aspect_ratio) | |
height += (width / aspect_ratio).floor | |
else | |
height += width | |
end | |
end | |
height | |
end | |
# Calculate sun of widths of artworks in row | |
def self.calculate_width(artwork_row, height) | |
width = 0 | |
artwork_row.each do |artwork| | |
if (aspect_ratio = artwork.default_image.aspect_ratio) | |
width += (height * aspect_ratio).ceil | |
else | |
width += height | |
end | |
end | |
width | |
end | |
# calculate height of each artwork in collection to sum up to width | |
def self.calculate_max_height_for_width(artworks, width) | |
calculated_width = 0 | |
height = 0 | |
while calculated_width <= width | |
height += 1 | |
calculated_width = calculate_width(artworks, height) | |
end | |
height - 1 | |
end | |
end |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
You can’t perform that action at this time.