The fat arrow functions and modern syntax really let you make some great abstractions. I've switched to this for my showHelp formatting (See it in the latest version of Bump): const _h = {
outer: (...o) => `<div style="border: 1px solid black; background-color: white; padding: 3px 3px;">${o.join(' ')}</div>`,
title: (t,v) => `<div style="font-weight: bold; border-bottom: 1px solid black;font-size: 130%;">${t} v${v}</div>`,
subhead: (...o) => `<b>${o.join(' ')}</b>`,
minorhead: (...o) => `<u>${o.join(' ')}</u>`,
optional: (...o) => `${ch('[')}${o.join(` ${ch('|')} `)}${ch(']')}`,
required: (...o) => `${ch('<')}${o.join(` ${ch('|')} `)}${ch('>')}`,
header: (...o) => `<div style="padding-left:10px;margin-bottom:3px;">${o.join(' ')}</div>`,
section: (s,...o) => `${_h.subhead(s)}${_h.inset(...o)}`,
paragraph: (...o) => `<p>${o.join(' ')}</p>`,
group: (...o) => `${o.join(' ')}`,
items: (o) => `<li>${o.join('</li><li>')}</li>`,
ol: (...o) => `<ol>${_h.items(o)}</ol>`,
ul: (...o) => `<ul>${_h.items(o)}</ul>`,
grid: (...o) => `<div style="padding: 12px 0;">${o.join('')}<div style="clear:both;"></div></div>`,
cell: (o) => `<div style="width: 130px; padding: 0 3px; float: left;">${o}</div>`,
inset: (...o) => `<div style="padding-left: 10px;padding-right:20px">${o.join(' ')}</div>`,
pre: (...o) =>`<div style="border:1px solid #e1e1e8;border-radius:4px;padding:8.5px;margin-bottom:9px;font-size:12px;white-space:normal;word-break:normal;word-wrap:normal;background-color:#f7f7f9;font-family:monospace;overflow:auto;">${o.join(' ')}</div>`,
preformatted: (...o) =>_h.pre(o.join('<br>').replace(/\s/g,ch(' '))),
code: (...o) => `<code>${o.join(' ')}</code>`,
attr: {
bare: (o)=>`${ch('@')}${ch('{')}${o}${ch('}')}`,
selected: (o)=>`${ch('@')}${ch('{')}selected${ch('|')}${o}${ch('}')}`,
target: (o)=>`${ch('@')}${ch('{')}target${ch('|')}${o}${ch('}')}`,
char: (o,c)=>`${ch('@')}${ch('{')}${c||'CHARACTER NAME'}${ch('|')}${o}${ch('}')}`
},
bold: (...o) => `<b>${o.join(' ')}</b>`,
italic: (...o) => `<i>${o.join(' ')}</i>`,
font: {
command: (...o)=>`<b><span style="font-family:serif;">${o.join(' ')}</span></b>`
}
};
Used thusly: const showHelp = (playerid) => {
const who=(getObj('player',playerid)||{get:()=>'API'}).get('_displayname');
sendChat('',`/w "${who}" `+
_h.outer(
_h.title('Bump', version),
_h.header(
_h.paragraph('Bump provides a way to invisibly manipulate tokens on the GM Layer from the Objects Layer, and vice versa.')
),
_h.subhead('Commands'),
_h.inset(
_h.font.command(
`!bump-slave`,
_h.optional(
`--push`,
`--help`
)
),
_h.paragraph( 'Adds the selected tokens to Bump, creating their slave tokens.'),
_h.ul(
`${_h.bold('--push')} -- If the selected token is on the Objects Layer, it will be pushed to the GM Layer.`,
`${_h.bold('--help')} -- Shows the Help screen.`
),
_h.font.command(
`!bump`,
_h.optional(
`--help`
)
),
_h.paragraph( `Using !bump on a token in Bump causes it to swap with it${ch("'")}s counterpart on the other layer.`),
_h.ul(
`${_h.bold('--help')} -- Shows the Help screen.`
)
),
_h.subhead('Description'),
_h.inset(
_h.paragraph('When a token is added to Bump a slave token is created that mimics everything about the master token. The slave token is only visible to the GM and has a color on it to show if the master token is on the GM Layer or the Objects layer. Moving the slave token will move the master token and vice versa. The slave token represents the same character as the master token and changes on the slave token will be reflected on the master token.'),
_h.paragraph('Non-GM players can also use bump on characters they control. They will be able to see their bumped token as a transparent aura, but other players will not. This is useful for invisible characters.'),
_h.paragraph(`While changes on the slave token will be reflected on the master token, Status Markers have a special behavior. Status Markers are always cleared from the slave token to prevent it from being visible, with the following changes being made to the master token. Adding a Status Marker on a slave token that is not on the master token will cause that Status Marker to be added to the master token. Adding a Status Marker to the slave token that is on the master token causes it to be removed from the master token. Adding a Status Marker with a number on the slave token will cause that number to be added to the master token${ch("'")}s Status Marker. Note that non-GM players will not be able to see Status Markers.`)
),
( playerIsGM(playerid)
? _h.group(
_h.subhead('Configuration'),
getAllConfigOptions()
)
: ''
)
)
);
};
