munar-plugin-emotes
Version:
Munar plugin for sharing reaction GIFs.
65 lines (57 loc) • 1.6 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.renderEmotesList = renderEmotesList;
var _nanohtml = _interopRequireDefault(require("nanohtml"));
var _truncateUrl = _interopRequireDefault(require("truncate-url"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function Emote({
id,
url
}) {
return _nanohtml.default`
<tr class="stripe-dark">
<td class="pv2 ph3 name">${id}</td>
<td class="pv2 ph3">
<a href="${url}" title="${url}" class="link dim light-pink" target="_blank">
${(0, _truncateUrl.default)(url, 50)}
</a>
</td>
</tr>
`;
}
function onclick(event) {
if (!event.target.classList.contains('name')) {
return;
}
var s = window.getSelection();
var r = document.createRange();
r.selectNodeContents(event.target);
s.removeAllRanges();
s.addRange(r);
}
function renderEmotesList(emotes) {
return _nanohtml.default`
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://unpkg.com/tachyons@4.6.1/css/tachyons.min.css">
</head>
<body class="bg-dark-gray near-white mh5 mv3">
<table class="collapse" style="margin: auto">
<thead><tr>
<th class="pv2 ph3 ttu">Name</th>
<th class="pv2 ph3 ttu">URL</th>
</tr></thead>
<tbody>
${emotes.map(Emote)}
</tbody>
</table>
<script>
if (document.body.classList) onclick = ${onclick.toString()}
</script>
</body>
</html>
`.toString();
}