diff options
Diffstat (limited to 'src/content/dependencies')
| -rw-r--r-- | src/content/dependencies/generateCoverGrid.js | 37 | ||||
| -rw-r--r-- | src/content/dependencies/generateExpandableGallerySection.js | 92 | ||||
| -rw-r--r-- | src/content/dependencies/generateGridExpando.js | 39 | ||||
| -rw-r--r-- | src/content/dependencies/generateGroupGalleryPageSeriesSection.js | 147 | ||||
| -rw-r--r-- | src/content/dependencies/generateLyricsEntry.js | 31 | ||||
| -rw-r--r-- | src/content/dependencies/generateSearchSidebarBox.js | 17 | ||||
| -rw-r--r-- | src/content/dependencies/index.js | 7 |
7 files changed, 192 insertions, 178 deletions
diff --git a/src/content/dependencies/generateCoverGrid.js b/src/content/dependencies/generateCoverGrid.js index 89371015..53b2b8b8 100644 --- a/src/content/dependencies/generateCoverGrid.js +++ b/src/content/dependencies/generateCoverGrid.js @@ -1,14 +1,16 @@ import {empty, stitchArrays, unique} from '#sugar'; export default { - contentDependencies: ['generateGridActionLinks'], + contentDependencies: ['generateGridActionLinks', 'generateGridExpando'], extraDependencies: ['html', 'language'], - relations(relation) { - return { - actionLinks: relation('generateGridActionLinks'), - }; - }, + relations: (relation) => ({ + actionLinks: + relation('generateGridActionLinks'), + + expando: + relation('generateGridExpando'), + }), slots: { attributes: {type: 'attributes', mutable: false}, @@ -45,6 +47,13 @@ export default { revealAllWarnings: { validate: v => v.looseArrayOf(v.isString), }, + + bottomCaption: { + type: 'html', + mutable: false, + }, + + cutIndex: {validate: v => v.isWholeNumber}, }, generate: (relations, slots, {html, language}) => @@ -121,6 +130,10 @@ export default { (classes ? {class: classes} : null), + + slots.cutIndex >= 1 && + index >= slots.cutIndex && + {class: 'hidden-by-expandable-cut'}, ], colorContext: 'image-box', @@ -168,5 +181,17 @@ export default { relations.actionLinks .slot('actionLinks', slots.actionLinks), + + (slots.cutIndex >= 1 && + slots.cutIndex < slots.links.length + ? relations.expando.slots({ + caption: slots.bottomCaption, + }) + + : !html.isBlank(relations.bottomCaption) + ? html.tag('p', {class: 'grid-caption'}, + slots.caption) + + : html.blank()), ]), }; diff --git a/src/content/dependencies/generateExpandableGallerySection.js b/src/content/dependencies/generateExpandableGallerySection.js deleted file mode 100644 index 122ca4b1..00000000 --- a/src/content/dependencies/generateExpandableGallerySection.js +++ /dev/null @@ -1,92 +0,0 @@ -export default { - contentDependencies: ['generateContentHeading'], - extraDependencies: ['html', 'language'], - - relations: (relation) => ({ - contentHeading: - relation('generateContentHeading'), - }), - - slots: { - title: { - type: 'html', - mutable: false, - }, - - contentAboveCut: { - type: 'html', - mutable: false, - }, - - contentBelowCut: { - type: 'html', - mutable: false, - }, - - caption: { - type: 'html', - mutable: false, - }, - - expandCue: { - type: 'html', - mutable: false, - }, - - collapseCue: { - type: 'html', - mutable: false, - }, - }, - - generate: (relations, slots, {html, language}) => - html.tag('section', {class: 'expandable-gallery-section'}, [ - relations.contentHeading.slots({ - tag: 'h2', - title: slots.title, - }), - - html.tag('div', {class: 'section-content-above-cut'}, - {[html.onlyIfContent]: true}, - - slots.contentAboveCut), - - html.tag('div', {class: 'section-content-below-cut'}, - {[html.onlyIfContent]: true}, - - !html.isBlank(slots.contentBelowCut) && - {style: 'display: none'}, - - slots.contentBelowCut), - - html.tag('div', {class: 'section-expando'}, - {[html.onlyIfSiblings]: true}, - - html.tag('div', {class: 'section-expando-content'}, - {[html.joinChildren]: html.tag('br')}, - - [ - html.tag('span', {class: 'section-caption'}, - slots.caption), - - !html.isBlank(slots.contentBelowCut) && - language.$('misc.coverGrid.expandCollapseCue', { - cue: - html.tag('a', {class: 'section-expando-toggle'}, - {href: '#'}, - - {[html.joinChildren]: ''}, - {[html.noEdgeWhitespace]: true}, - - [ - html.tag('span', {class: 'section-expand-cue'}, - slots.expandCue), - - html.tag('span', {class: 'section-collapse-cue'}, - {style: 'display: none'}, - slots.collapseCue), - ]), - }), - ])), - ]), -}; diff --git a/src/content/dependencies/generateGridExpando.js b/src/content/dependencies/generateGridExpando.js new file mode 100644 index 00000000..71c2f970 --- /dev/null +++ b/src/content/dependencies/generateGridExpando.js @@ -0,0 +1,39 @@ +export default { + extraDependencies: ['html', 'language'], + + slots: { + caption: {type: 'html', mutable: false}, + }, + + generate: (slots, {html, language}) => + language.encapsulate('misc.coverGrid', capsule => + html.tag('div', {class: 'grid-expando'}, + {[html.onlyIfSiblings]: true}, + + html.tag('p', {class: 'grid-expando-content'}, + {[html.joinChildren]: html.tag('br')}, + + [ + html.tag('span', {class: 'grid-caption'}, + slots.caption), + + !html.isBlank(slots.contentBelowCut) && + language.$(capsule, 'expandCollapseCue', { + cue: + html.tag('a', {class: 'grid-expando-toggle'}, + {href: '#'}, + + {[html.joinChildren]: ''}, + {[html.noEdgeWhitespace]: true}, + + [ + html.tag('span', {class: 'grid-expand-cue'}, + language.$(capsule, 'expand')), + + html.tag('span', {class: 'grid-collapse-cue'}, + {style: 'display: none'}, + language.$(capsule, 'collapse')), + ]), + }), + ]))), +}; diff --git a/src/content/dependencies/generateGroupGalleryPageSeriesSection.js b/src/content/dependencies/generateGroupGalleryPageSeriesSection.js index 2ccead5d..b88adfa3 100644 --- a/src/content/dependencies/generateGroupGalleryPageSeriesSection.js +++ b/src/content/dependencies/generateGroupGalleryPageSeriesSection.js @@ -2,7 +2,7 @@ import {sortChronologically} from '#sort'; export default { contentDependencies: [ - 'generateExpandableGallerySection', + 'generateContentHeading', 'generateGroupGalleryPageAlbumGrid', ], @@ -11,12 +11,8 @@ export default { query(series) { const query = {}; - // Includes undated albums. - const albumsLatestFirst = - sortChronologically(series.albums, {latestFirst: true}); - - query.albumsAboveCut = albumsLatestFirst.slice(0, 4); - query.albumsBelowCut = albumsLatestFirst.slice(4); + query.albums = + sortChronologically(series.albums.slice(), {latestFirst: true}); query.allAlbumsDated = series.albums.every(album => album.date); @@ -25,13 +21,13 @@ export default { series.albums.some(album => !album.groups.includes(series.group)); query.latestAlbum = - albumsLatestFirst + query.albums .filter(album => album.date) .at(0) ?? null; query.earliestAlbum = - albumsLatestFirst + query.albums .filter(album => album.date) .at(-1) ?? null; @@ -40,17 +36,12 @@ export default { }, relations: (relation, query, series) => ({ - gallerySection: - relation('generateExpandableGallerySection'), + contentHeading: + relation('generateContentHeading'), - gridAboveCut: + grid: relation('generateGroupGalleryPageAlbumGrid', - query.albumsAboveCut, - series.group), - - gridBelowCut: - relation('generateGroupGalleryPageAlbumGrid', - query.albumsBelowCut, + query.albums, series.group), }), @@ -88,69 +79,67 @@ export default { generate: (data, relations, {html, language}) => language.encapsulate('groupGalleryPage.albumSection', capsule => - relations.gallerySection.slots({ - title: data.name, - - contentAboveCut: relations.gridAboveCut, - contentBelowCut: relations.gridBelowCut, - - caption: - language.encapsulate(capsule, 'caption', captionCapsule => - html.tags([ - data.anyAlbumNotFromThisGroup && - language.$(captionCapsule, 'seriesAlbumsNotFromGroup', { - marker: - language.$('misc.coverGrid.details.notFromThisGroup.marker'), - - series: - html.tag('i', data.name), - - group: data.groupName, - }), - - language.encapsulate(captionCapsule, workingCapsule => { - const workingOptions = {}; - - workingOptions.tracks = - html.tag('b', - language.countTracks(data.tracks, {unit: true})); - - workingOptions.albums = - html.tag('b', - language.countAlbums(data.albums, {unit: true})); - - if (data.allAlbumsDated) { - const earliestDate = data.earliestAlbumDate; - const latestDate = data.latestAlbumDate; - - const earliestYear = earliestDate.getFullYear(); - const latestYear = latestDate.getFullYear(); - - if (earliestYear === latestYear) { - if (data.albums === 1) { - workingCapsule += '.withDate'; - workingOptions.date = - language.formatDate(earliestDate); + html.tags([ + relations.contentHeading.slots({ + tag: 'h2', + title: language.sanitize(data.name), + }), + + relations.grid.slots({ + cutIndex: 4, + + bottomCaption: + language.encapsulate(capsule, 'caption', captionCapsule => + html.tags([ + data.anyAlbumNotFromThisGroup && + language.$(captionCapsule, 'seriesAlbumsNotFromGroup', { + marker: + language.$('misc.coverGrid.details.notFromThisGroup.marker'), + + series: + html.tag('i', data.name), + + group: data.groupName, + }), + + language.encapsulate(captionCapsule, workingCapsule => { + const workingOptions = {}; + + workingOptions.tracks = + html.tag('b', + language.countTracks(data.tracks, {unit: true})); + + workingOptions.albums = + html.tag('b', + language.countAlbums(data.albums, {unit: true})); + + if (data.allAlbumsDated) { + const earliestDate = data.earliestAlbumDate; + const latestDate = data.latestAlbumDate; + + const earliestYear = earliestDate.getFullYear(); + const latestYear = latestDate.getFullYear(); + + if (earliestYear === latestYear) { + if (data.albums === 1) { + workingCapsule += '.withDate'; + workingOptions.date = + language.formatDate(earliestDate); + } else { + workingCapsule += '.withYear'; + workingOptions.year = + language.formatYear(earliestDate); + } } else { - workingCapsule += '.withYear'; - workingOptions.year = - language.formatYear(earliestDate); + workingCapsule += '.withYearRange'; + workingOptions.yearRange = + language.formatYearRange(earliestDate, latestDate); } - } else { - workingCapsule += '.withYearRange'; - workingOptions.yearRange = - language.formatYearRange(earliestDate, latestDate); } - } - - return language.$(workingCapsule, workingOptions); - }), - ], {[html.joinChildren]: html.tag('br')})), - expandCue: - language.$(capsule, 'expand'), - - collapseCue: - language.$(capsule, 'collapse'), - })), + return language.$(workingCapsule, workingOptions); + }), + ], {[html.joinChildren]: html.tag('br')})), + }), + ])), }; diff --git a/src/content/dependencies/generateLyricsEntry.js b/src/content/dependencies/generateLyricsEntry.js index 0c91ce0c..1379ae06 100644 --- a/src/content/dependencies/generateLyricsEntry.js +++ b/src/content/dependencies/generateLyricsEntry.js @@ -28,6 +28,30 @@ export default { hasSquareBracketAnnotations: entry.hasSquareBracketAnnotations, + + numStanzas: + 1 + + + (Array.from( + entry.body + .matchAll(/\n\n|<br><br>/g)) + + .length) + + + (entry.body.includes('<br') + ? entry.body.split('\n').length + : 0), + + numLines: + 1 + + + (Array.from( + entry.body + .replaceAll(/(<br>){1,}/g, '\n') + .replaceAll(/\n{2,}/g, '\n') + .matchAll(/\n/g)) + + .length), }), slots: { @@ -42,6 +66,13 @@ export default { html.tag('div', {class: 'lyrics-entry'}, slots.attributes, + {'data-stanzas': data.numStanzas}, + {'data-lines': data.numLines}, + + (data.numStanzas > 1 || + data.numLines > 8) && + {class: 'long-lyrics'}, + [ html.tag('p', {class: 'lyrics-details'}, {[html.onlyIfContent]: true}, diff --git a/src/content/dependencies/generateSearchSidebarBox.js b/src/content/dependencies/generateSearchSidebarBox.js index 308a1105..87785906 100644 --- a/src/content/dependencies/generateSearchSidebarBox.js +++ b/src/content/dependencies/generateSearchSidebarBox.js @@ -58,6 +58,23 @@ export default { language.$(capsule, 'artTag')), ]), + language.encapsulate(capsule, 'resultDisambiguator', capsule => [ + html.tag('template', {class: 'wiki-search-group-result-disambiguator-string'}, + language.$(capsule, 'group', { + disambiguator: html.tag('slot', {name: 'disambiguator'}), + })), + + html.tag('template', {class: 'wiki-search-flash-result-disambiguator-string'}, + language.$(capsule, 'flash', { + disambiguator: html.tag('slot', {name: 'disambiguator'}), + })), + + html.tag('template', {class: 'wiki-search-track-result-disambiguator-string'}, + language.$(capsule, 'track', { + disambiguator: html.tag('slot', {name: 'disambiguator'}), + })), + ]), + language.encapsulate(capsule, 'resultFilter', capsule => [ html.tag('template', {class: 'wiki-search-album-result-filter-string'}, language.$(capsule, 'album')), diff --git a/src/content/dependencies/index.js b/src/content/dependencies/index.js index 25d7324f..cfa6346c 100644 --- a/src/content/dependencies/index.js +++ b/src/content/dependencies/index.js @@ -94,6 +94,8 @@ export function watchContentDependencies({ const filePaths = files.map(file => path.join(watchPath, file)); for (const filePath of filePaths) { if (filePath === metaPath) continue; + if (filePath.endsWith('.DS_Store')) continue; + const functionName = getFunctionName(filePath); if (!isMocked(functionName)) { contentDependencies[functionName] = null; @@ -105,8 +107,9 @@ export function watchContentDependencies({ watcher.on('all', (event, filePath) => { if (!['add', 'change'].includes(event)) return; if (filePath === metaPath) return; - handlePathUpdated(filePath); + if (filePath.endsWith('.DS_Store')) return; + handlePathUpdated(filePath); }); watcher.on('unlink', (filePath) => { @@ -115,6 +118,8 @@ export function watchContentDependencies({ return; } + if (filePath.endsWith('.DS_Store')) return; + handlePathRemoved(filePath); }); |