diff options
| -rw-r--r-- | src/content/dependencies/linkThing.js | 53 | ||||
| -rw-r--r-- | src/static/site6.css | 11 | ||||
| -rw-r--r-- | tap-snapshots/test/snapshot/linkArtist.js.test.cjs | 2 | ||||
| -rw-r--r-- | tap-snapshots/test/snapshot/linkThing.js.test.cjs | 8 | ||||
| -rw-r--r-- | test/snapshot/generateTrackCoverArtwork.js | 15 | ||||
| -rw-r--r-- | test/snapshot/linkThing.js | 7 |
6 files changed, 77 insertions, 19 deletions
diff --git a/src/content/dependencies/linkThing.js b/src/content/dependencies/linkThing.js index 4c38c51d..d1f6a097 100644 --- a/src/content/dependencies/linkThing.js +++ b/src/content/dependencies/linkThing.js @@ -1,5 +1,11 @@ export default { - contentDependencies: ['generateColorStyleAttribute', 'linkTemplate'], + contentDependencies: [ + 'generateColorStyleAttribute', + 'generateTextWithTooltip', + 'generateTooltip', + 'linkTemplate', + ], + extraDependencies: ['html', 'language'], relations: (relation, _pathKey, thing) => ({ @@ -8,6 +14,12 @@ export default { colorStyle: relation('generateColorStyleAttribute', thing.color ?? null), + + textWithTooltip: + relation('generateTextWithTooltip'), + + tooltip: + relation('generateTooltip'), }), data: (pathKey, thing) => ({ @@ -37,8 +49,8 @@ export default { }, tooltipStyle: { - validate: v => v.is('none', 'browser'), - default: 'none', + validate: v => v.is('none', 'auto', 'browser', 'wiki'), + default: 'auto', }, color: { @@ -79,6 +91,18 @@ export default { ? data.nameShort : data.name); + const showWikiTooltip = + (slots.tooltipStyle === 'auto' + ? showShortName + : slots.tooltipStyle === 'wiki'); + + const wikiTooltip = + showWikiTooltip && + relations.tooltip.slots({ + attributes: {class: 'thing-name-tooltip'}, + content: data.name, + }); + if (slots.tooltipStyle === 'browser') { attributes.add('title', data.name); } @@ -100,14 +124,19 @@ export default { attributes.add(colorStyle); } - return relations.linkTemplate - .slots({ - path: slots.anchor ? [] : path, - href: slots.anchor ? '' : null, - content, - attributes, - hash: slots.hash, - linkless: slots.linkless, - }); + return relations.textWithTooltip.slots({ + text: + relations.linkTemplate.slots({ + path: slots.anchor ? [] : path, + href: slots.anchor ? '' : null, + content, + attributes, + hash: slots.hash, + linkless: slots.linkless, + }), + + tooltip: + wikiTooltip ?? null, + }); }, } diff --git a/src/static/site6.css b/src/static/site6.css index 4e761963..0e77a6e6 100644 --- a/src/static/site6.css +++ b/src/static/site6.css @@ -562,6 +562,11 @@ li:not(:first-child:last-child) .tooltip, left: -10px; } +.thing-name-tooltip { + padding: 3px 4px 2px 2px; + left: -6px !important; +} + .icons-tooltip .tooltip-content { padding: 6px 2px 2px 2px; @@ -577,6 +582,12 @@ li:not(:first-child:last-child) .tooltip, font-size: 0.9em; } +.thing-name-tooltip .tooltip-content { + padding: 3px 4.5px; + white-space: nowrap; + max-width: 120px; +} + .icons { font-style: normal; white-space: nowrap; diff --git a/tap-snapshots/test/snapshot/linkArtist.js.test.cjs b/tap-snapshots/test/snapshot/linkArtist.js.test.cjs index 6b532aef..8dc209fd 100644 --- a/tap-snapshots/test/snapshot/linkArtist.js.test.cjs +++ b/tap-snapshots/test/snapshot/linkArtist.js.test.cjs @@ -10,5 +10,5 @@ exports[`test/snapshot/linkArtist.js > TAP > linkArtist (snapshot) > basic behav ` exports[`test/snapshot/linkArtist.js > TAP > linkArtist (snapshot) > prefer short name 1`] = ` -<a href="artist/55gore/">55gore</a> +<span class="text-with-tooltip"><a href="artist/55gore/">55gore</a><span class="tooltip thing-name-tooltip"><span class="tooltip-content">ICCTTCMDMIROTMCWMWFTPFTDDOTARHPOESWGBTWEATFCWSEBTSSFOFG</span></span></span> ` diff --git a/tap-snapshots/test/snapshot/linkThing.js.test.cjs b/tap-snapshots/test/snapshot/linkThing.js.test.cjs index 114116ee..ae46443e 100644 --- a/tap-snapshots/test/snapshot/linkThing.js.test.cjs +++ b/tap-snapshots/test/snapshot/linkThing.js.test.cjs @@ -20,7 +20,7 @@ exports[`test/snapshot/linkThing.js > TAP > linkThing (snapshot) > nested links ` exports[`test/snapshot/linkThing.js > TAP > linkThing (snapshot) > preferShortName 1`] = ` -<a href="tag/five-oceanfalls/">Five</a> +<span class="text-with-tooltip"><a href="tag/five-oceanfalls/">Five</a><span class="tooltip thing-name-tooltip"><span class="tooltip-content">Five (Oceanfalls)</span></span></span> ` exports[`test/snapshot/linkThing.js > TAP > linkThing (snapshot) > tags in name escaped 1`] = ` @@ -34,5 +34,11 @@ exports[`test/snapshot/linkThing.js > TAP > linkThing (snapshot) > tooltip & con <a href="album/beyond-canon/">Beyond Canon</a> <a title="Beyond Canon" href="album/beyond-canon/">Beyond Canon</a> <a title="Beyond Canon" href="album/beyond-canon/">Next</a> +<a href="album/beyond-canon/">Beyond Canon</a> +<span class="text-with-tooltip"><a href="album/beyond-canon/">BC</a><span class="tooltip thing-name-tooltip"><span class="tooltip-content">Beyond Canon</span></span></span> +<span class="text-with-tooltip"><a href="album/beyond-canon/">Next</a><span class="tooltip thing-name-tooltip"><span class="tooltip-content">Beyond Canon</span></span></span> +<a href="album/beyond-canon/">Next</a> +<span class="text-with-tooltip"><a href="album/beyond-canon/">Beyond Canon</a><span class="tooltip thing-name-tooltip"><span class="tooltip-content">Beyond Canon</span></span></span> +<span class="text-with-tooltip"><a href="album/beyond-canon/">Next</a><span class="tooltip thing-name-tooltip"><span class="tooltip-content">Beyond Canon</span></span></span> <a href="album/beyond-canon/">Banana</a> ` diff --git a/test/snapshot/generateTrackCoverArtwork.js b/test/snapshot/generateTrackCoverArtwork.js index 1e651eb1..51eba1ff 100644 --- a/test/snapshot/generateTrackCoverArtwork.js +++ b/test/snapshot/generateTrackCoverArtwork.js @@ -1,5 +1,6 @@ import t from 'tap'; import {testContentFunctions} from '#test-lib'; +import {showAggregate} from '#sugar'; testContentFunctions(t, 'generateTrackCoverArtwork (snapshot)', async (t, evaluate) => { await evaluate.load({ @@ -35,11 +36,15 @@ testContentFunctions(t, 'generateTrackCoverArtwork (snapshot)', async (t, evalua album, }; - evaluate.snapshot('display: primary - unique art', { - name: 'generateTrackCoverArtwork', - args: [track1], - slots: {mode: 'primary'}, - }); + try { + evaluate.snapshot('display: primary - unique art', { + name: 'generateTrackCoverArtwork', + args: [track1], + slots: {mode: 'primary'}, + }); + } catch (error) { + showAggregate(error); + } evaluate.snapshot('display: thumbnail - unique art', { name: 'generateTrackCoverArtwork', diff --git a/test/snapshot/linkThing.js b/test/snapshot/linkThing.js index 5aaf99ca..d7d28a55 100644 --- a/test/snapshot/linkThing.js +++ b/test/snapshot/linkThing.js @@ -32,11 +32,18 @@ testContentFunctions(t, 'linkThing (snapshot)', async (t, evaluate) => { args: ['localized.album', { directory: 'beyond-canon', name: 'Beyond Canon', + nameShort: 'BC', }], multiple: [ {slots: {tooltipStyle: 'none'}}, {slots: {tooltipStyle: 'browser'}}, {slots: {tooltipStyle: 'browser', content: 'Next'}}, + {slots: {tooltipStyle: 'auto'}}, + {slots: {tooltipStyle: 'auto', preferShortName: true}}, + {slots: {tooltipStyle: 'auto', preferShortName: true, content: 'Next'}}, + {slots: {tooltipStyle: 'auto', content: 'Next'}}, + {slots: {tooltipStyle: 'wiki'}}, + {slots: {tooltipStyle: 'wiki', content: 'Next'}}, {slots: {content: 'Banana'}}, ], }); |