Skip to content

Instantly share code, notes, and snippets.

@hogart
Created October 20, 2018 09:11
Show Gist options
  • Save hogart/5fab3db0e36ef7e1697543993403c122 to your computer and use it in GitHub Desktop.
Save hogart/5fab3db0e36ef7e1697543993403c122 to your computer and use it in GitHub Desktop.
compiled abbr macro
(function () {
// usage: <<abbr "text" "long explanation">>
'use strict';
/* globals version, Macro, jQuery */
if (!version || !version.title || 'SugarCube' !== version.title || !version.major || version.major < 2) {
throw new Error('<<abbr>> macro requires SugarCube 2.0 or greater, aborting load');
}
version.extensions.abbr = { major: 1, minor: 2, revision: 1 };
var clsPrefix = 'abbr-macro';
var styles = '\n .' + clsPrefix + ' {\n position: relative;\n display: inline;\n cursor: pointer;\n border-bottom: 1px dotted;\n }\n .' + clsPrefix + '::before {\n content: attr(data-title);\n position: absolute;\n display: table;\n top: 100%;\n left: 0;\n z-index: 10;\n max-width: 25vw;\n padding: 0.3em;\n font-size: 90%;\n pointer-events: none;\n opacity: 0;\n border: 1px solid currentColor;\n transition: 150ms linear all; \n }\n .' + clsPrefix + ':active::before,\n .' + clsPrefix + ':hover::before {\n pointer-events: auto;\n opacity: 1;\n transition: 150ms linear all; \n }\n /* to avoid setting bg color manually */\n #story, #passages, .passage, .passage *, .passage * .' + clsPrefix + ', .' + clsPrefix + '::before {\n background-color: inherit;\n }';
jQuery('head').append('<style type="text/css">' + styles + '</style>');
Macro.add('abbr', {
handler: function handler() {
var abr = jQuery('<abbr class="' + clsPrefix + '" data-title="' + this.args[1] + '">' + this.args[0] + '</abbr>');
abr.appendTo(this.output);
}
});
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment