From d7290a5803285117da60637ed7b4ef8b54402561 Mon Sep 17 00:00:00 2001 From: Florrie Date: Wed, 20 Nov 2019 11:25:48 -0400 Subject: new writePage function; remove grid site code writePage should make it a bit easier to add a zillion new pages, for listings and the like --- grid-site.css | 51 ------- upd8.js | 468 ++++++++++++++++++++++++---------------------------------- 2 files changed, 195 insertions(+), 324 deletions(-) delete mode 100644 grid-site.css diff --git a/grid-site.css b/grid-site.css deleted file mode 100644 index 865c441f..00000000 --- a/grid-site.css +++ /dev/null @@ -1,51 +0,0 @@ -body { - background-color: #222222; -} - -.grid-listing { - display: flex; - flex-wrap: wrap; - justify-content: center; - align-items: stretch; -} - -.grid-listing > .grid-item { - flex: 1 1 0; - display: inline-block; - min-width: 200px; - max-width: 240px; - background-color: #111111; - position: relative; - overflow: hidden; -} - -.grid-listing > .grid-item > img { - width: 100%; - transition: filter 0.25s, transform 0.25s; - display: block; -} - -.grid-listing > .grid-item:hover > img { - filter: saturate(0.25) brightness(0.85) blur(1px); - transform: scale(1.15); -} - -.grid-listing > .grid-item > span { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - color: white; - display: flex; - align-items: center; - justify-content: center; - text-align: center; - opacity: 0; - transition: opacity 0.25s; - text-shadow: 0 0 2px #000000; -} - -.grid-listing > .grid-item:hover > span { - opacity: 1; -} diff --git a/upd8.js b/upd8.js index 05df1f71..7fb72f64 100644 --- a/upd8.js +++ b/upd8.js @@ -82,6 +82,10 @@ const { th } = require('./upd8-util'); +// This can 8e changed if you want to output to some other directory. Just make +// sure static files are copied into it too! (Which, ahem. Might 8e a todo.) +const SITE_DIRECTORY = ''; + const SITE_TITLE = 'Homestuck Music Wiki'; const SITE_INTRO = fixWS` @@ -108,7 +112,6 @@ const ALBUM_DIRECTORY = 'album'; const TRACK_DIRECTORY = 'track'; const ARTIST_DIRECTORY = 'artist'; const ARTIST_AVATAR_DIRECTORY = 'artist-avatar'; -const GRID_DIRECTORY = 'grid'; // Might ena8le this later... we'll see! Eventually. May8e. const ENABLE_ARTIST_AVATARS = false; @@ -116,7 +119,6 @@ const ENABLE_ARTIST_AVATARS = false; const ALBUM_DATA_FILE = 'album.txt'; const CSS_FILE = 'site.css'; -const GRID_CSS_FILE = 'grid-site.css'; // Note there isn't a 'find track data files' function. I plan on including the // data for all tracks within an al8um collected in the single metadata file @@ -494,38 +496,56 @@ function getArtistNames(albumData) { )); } -async function writeTopIndexPage(albumData) { - // This is hard-coded, i.e. we don't do a path.join(ROOT_DIRECTORY). +// 8asic function for writing any site page. Handles all the 8asename, +// directory, and site-template shenanigans! +async function writePage(directoryParts, title, body) { + const directory = path.join(SITE_DIRECTORY, ...directoryParts); + await mkdirp(directory); + // This is sort of hard-coded, i.e. we don't do path.join(ROOT_DIRECTORY). // May8e that's 8ad? Yes, definitely 8ad. 8ut I'm too lazy to fix it... - // for now. TM. - await writeFile('index.html', fixWS` + // for now. TM. (Ahem. Still. Soon...may8e. TM. -- Should 8e easier now + // that we'll have a proper function for writing any page - just appending + // a ROOT_DIRECTORY should work. Um... okay, fine, I'll do that.) + if (directoryParts.length === 0) console.log(directory, SITE_DIRECTORY); + await writeFile(path.join(directory, 'index.html'), fixWS` - - ${SITE_TITLE} - + ${[ + ``, + `${title}`, + directory !== SITE_DIRECTORY && + directory !== '.' && + ``, + `` + ].filter(Boolean).join('\n')} - -

${SITE_TITLE}

- ${SITE_INTRO} -

- ${albumData.map(album => fixWS` - -

- ${album.name} - - `).join('\n')} -

- + ${body} `); } +async function writeTopIndexPage(albumData) { + await writePage([], SITE_TITLE, fixWS` + +

${SITE_TITLE}

+ ${SITE_INTRO} +

+ ${albumData.map(album => fixWS` + +

+ ${album.name} + + `).join('\n')} +

+ + `); +} + // This function title is my gr8test work of art. async function writeIndexAndTrackPagesForAlbum(album, albumData) { await writeAlbumPage(album, albumData); @@ -534,138 +554,116 @@ async function writeIndexAndTrackPagesForAlbum(album, albumData) { async function writeAlbumPage(album, albumData) { const allTracks = getAllTracks(albumData); - const albumDirectory = path.join(ALBUM_DIRECTORY, album.directory); - await mkdirp(albumDirectory); - await writeFile(path.join(albumDirectory, 'index.html'), fixWS` - - - - - ${album.name} - - - - - -

${album.name}

- ${album.artists && `By ${getArtistString(album.artists)}.
`} - ${album.coverArtists && `Cover art by ${joinNoOxford(album.coverArtists.map(({ who, what }) => fixWS` - ${who}${what && ` (${getContributionString({what}, allTracks)})`} - `))}.
`} - Released ${getDateString(album)}. -

- ${track.name} - ${track.artists !== album.artists && fixWS` - by ${getArtistString(track.artists)} - `} -

- ${album.commentary && fixWS` -

Artist commentary:

- ${album.commentary} -

- `} -

- - + await writePage([ALBUM_DIRECTORY, album.directory], album.name, fixWS` + + +

${album.name}

+ ${album.artists && `By ${getArtistString(album.artists)}.
`} + ${album.coverArtists && `Cover art by ${joinNoOxford(album.coverArtists.map(({ who, what }) => fixWS` + ${who}${what && ` (${getContributionString({what}, allTracks)})`} + `))}.
`} + Released ${getDateString(album)}. +

+ ${track.name} + ${track.artists !== album.artists && fixWS` + by ${getArtistString(track.artists)} + `} +

+ ${album.commentary && fixWS` +

Artist commentary:

+ ${album.commentary} +

+ `} +

+ `); } async function writeTrackPage(track, albumData) { const artistNames = getArtistNames(albumData); const allTracks = getAllTracks(albumData); - const trackDirectory = path.join(TRACK_DIRECTORY, track.directory); const tracksThatReference = getTracksThatReference(track, allTracks); const tracksReferenced = getTracksReferencedBy(track, allTracks); - await mkdirp(trackDirectory); - await writeFile(path.join(trackDirectory, 'index.html'), fixWS` - - - - - ${track.name} - - - - - -

${track.name}

- By ${getArtistString(track.artists)}.
- ${track.coverArtists && `Cover art by ${joinNoOxford(track.coverArtists.map(({ who, what }) => fixWS` - ${who}${what && ` (${getContributionString({what}, allTracks)})`} - `))}.
`} - Released ${getDateString(track)}. -

Listen on ${joinNoOxford(track.urls.map(url => fixWS` - ${ - url.includes('bandcamp.com') ? 'Bandcamp' : - url.includes('youtu') ? 'YouTube' : - url.includes('soundcloud') ? 'SoundCloud' : - '(External)' - } - `), 'or')}.

- ${track.contributors.length && fixWS` -

Contributors:

${artistNames.includes(who) - ? `${who}` - : who - } ${what && `(${getContributionString({what}, allTracks)})`}

- `} - ${tracksReferenced.length && fixWS` -

Tracks that ${track.name} references:

- ${track.name} - by ${getArtistString(track.artists)} -

- `} - ${tracksThatReference.length && fixWS` -

Tracks that reference ${track.name}:

- ${track.name} - by ${getArtistString(track.artists)} -

- `} - ${track.commentary && fixWS` -

Artist commentary:

- ${track.commentary} -

- `} -

- - + await writePage([TRACK_DIRECTORY, track.directory], track.name, fixWS` + + +

${track.name}

+ By ${getArtistString(track.artists)}.
+ ${track.coverArtists && `Cover art by ${joinNoOxford(track.coverArtists.map(({ who, what }) => fixWS` + ${who}${what && ` (${getContributionString({what}, allTracks)})`} + `))}.
`} + Released ${getDateString(track)}. +

Listen on ${joinNoOxford(track.urls.map(url => fixWS` + ${ + url.includes('bandcamp.com') ? 'Bandcamp' : + url.includes('youtu') ? 'YouTube' : + url.includes('soundcloud') ? 'SoundCloud' : + '(External)' + } + `), 'or')}.

+ ${track.contributors.length && fixWS` +

Contributors:

${artistNames.includes(who) + ? `${who}` + : who + } ${what && `(${getContributionString({what}, allTracks)})`}

+ `} + ${tracksReferenced.length && fixWS` +

Tracks that ${track.name} references:

+ ${track.name} + by ${getArtistString(track.artists)} +

+ `} + ${tracksThatReference.length && fixWS` +

Tracks that reference ${track.name}:

+ ${track.name} + by ${getArtistString(track.artists)} +

+ `} + ${track.commentary && fixWS` +

Artist commentary:

+ ${track.commentary} +

+ `} +

+ `); } async function writeArtistPages(albumData) { - await Promise.all(getArtistNames(albumData).map(artistName => writeArtistPage(artistName, albumData))); + await progressPromiseAll('Writing artist pages.', getArtistNames(albumData).map(artistName => writeArtistPage(artistName, albumData))); } async function writeArtistPage(artistName, albumData) { @@ -679,74 +677,62 @@ async function writeArtistPage(artistName, albumData) { // Shish! const kebab = getArtistDirectory(artistName); - - const artistDirectory = path.join(ARTIST_DIRECTORY, kebab); const index = `${ARTIST_DIRECTORY}/${kebab}/index.html`; - await mkdirp(artistDirectory); - await writeFile(path.join(artistDirectory, 'index.html'), fixWS` - - - - - ${artistName} - - - - -

- ${ENABLE_ARTIST_AVATARS && await access(path.join(ARTIST_AVATAR_DIRECTORY, kebab + '.jpg')).then(() => true, () => false) && fixWS` -

- `} -

${artistName}

Jump to: ${[ - tracks.length && `Tracks`, - artThings.length && `Art`, - commentaryThings.length && `Commentary` - ].filter(Boolean).join(', ')}

- ${tracks.length && fixWS` -

Tracks

- ${albumChunkedList(tracks, (track, i) => { - const contrib = { - who: artistName, - what: track.contributors.filter(({ who }) => who === artistName).map(({ what }) => what).join(', ') - }; - return fixWS` -

- ${track.name} - ${track.artists.includes(artistName) && track.artists.length > 1 && `(with ${getArtistString(track.artists.filter(a => a !== artistName))})`} - ${contrib.what && `(${getContributionString(contrib, tracks) || 'contributed'})`} -

- `; - })} - `} - ${artThings.length && fixWS` -

Art

- ${albumChunkedList(artThings, (thing, i) => { - const contrib = thing.coverArtists.find(({ who }) => who === artistName); - return fixWS` -

- ${thing.album ? fixWS` - ${thing.name} - ` : '(cover art)'} - ${contrib.what && `(${getContributionString(contrib, tracks)})`} -

- `; - })} - `} - ${commentaryThings.length && fixWS` -

Commentary

- ${albumChunkedList(commentaryThings, thing => fixWS` -

+ await writePage([ARTIST_DIRECTORY, kebab], artistName, fixWS` + +

+ ${ENABLE_ARTIST_AVATARS && await access(path.join(ARTIST_AVATAR_DIRECTORY, kebab + '.jpg')).then(() => true, () => false) && fixWS` +

+ `} +

${artistName}

Jump to: ${[ + tracks.length && `Tracks`, + artThings.length && `Art`, + commentaryThings.length && `Commentary` + ].filter(Boolean).join(', ')}

+ ${tracks.length && fixWS` +

Tracks

+ ${albumChunkedList(tracks, (track, i) => { + const contrib = { + who: artistName, + what: track.contributors.filter(({ who }) => who === artistName).map(({ what }) => what).join(', ') + }; + return fixWS` +

+ ${track.name} + ${track.artists.includes(artistName) && track.artists.length > 1 && `(with ${getArtistString(track.artists.filter(a => a !== artistName))})`} + ${contrib.what && `(${getContributionString(contrib, tracks) || 'contributed'})`} +

+ `; + })} + `} + ${artThings.length && fixWS` +

Art

+ ${albumChunkedList(artThings, (thing, i) => { + const contrib = thing.coverArtists.find(({ who }) => who === artistName); + return fixWS` +

${thing.album ? fixWS` ${thing.name} - ` : '(album commentary)'} + ` : '(cover art)'} + ${contrib.what && `(${getContributionString(contrib, tracks)})`}

- `, false)} - - `} -

- - + `; + })} + `} + ${commentaryThings.length && fixWS` +

Commentary

+ ${albumChunkedList(commentaryThings, thing => fixWS` +

+ ${thing.album ? fixWS` + ${thing.name} + ` : '(album commentary)'} +

+ `, false)} + + `} + + `); } @@ -878,68 +864,6 @@ function getTrackCover(track) { } } -// Super fancy, more interactive 8rowsing section of the site. May8e the -// primary one in time???????? We'll see! For real. -async function writeGridSite(albumData) { - await mkdirp(GRID_DIRECTORY); - await writeFile(path.join(GRID_DIRECTORY, 'index.html'), fixWS` - - - - - ${SITE_TITLE} - - - - -

- ${albumData.map(album => fixWS` - -

- ${album.name} - - `).join('\n')} -

- - - `); - await Promise.all(albumData.map(writeGridAlbumPage)); -} - -async function writeGridAlbumPage(album) { - const albumDirectory = path.join(GRID_DIRECTORY, ALBUM_DIRECTORY, album.directory); - await mkdirp(albumDirectory); - await writeFile(path.join(albumDirectory, 'index.html'), fixWS` - - - - - ${album.name} - - - - - -

- ${album.tracks.map(track => fixWS` - -

- ${track.name}
by ${joinNoOxford(track.artists)} - - `).join('\n')} -

- - - `); -} - async function main() { // 8ut wait, you might say, how do we know which al8um these data files // correspond to???????? You wouldn't dare suggest we parse the actual @@ -986,8 +910,6 @@ async function main() { await progressPromiseAll(`Writing album & track pages.`, albumData.map(album => writeIndexAndTrackPagesForAlbum(album, albumData))); await writeArtistPages(albumData); - // await writeGridSite(albumData); - // The single most important step. console.log('Written!'); } -- cgit 1.3.0-6-gf8a5