mirror of
https://github.com/FrankerFaceZ/FrankerFaceZ.git
synced 2025-06-27 21:05:53 +00:00
fdde05030f
* Add extensible actions system. * Add extensive UI for configuring the actions system. * Add setting to disable channel hosting. * Fix the stupid Rooms thing popping up every time you open a channel. * Fix how we grab chat types from React. * Refactor how we handle incoming chat messages. * Add a hook for outgoing chat messages. * Fix emoji appearing squished with baseline emote alignment. * Display arrows on balloons. * Fix an issue generating emoji URLs. * Do not use the default values for settings with merge strategies if profiles have those settings, just empty. * Display a message in the chat settings menu if we tried opening FFZ's settings and failed. * Wait a bit for webpack's loader if it's not immediately there for some reason. * Probably other stuff. * Not mod cards. Yet.
109 lines
No EOL
2.7 KiB
JavaScript
109 lines
No EOL
2.7 KiB
JavaScript
'use strict';
|
|
|
|
// ============================================================================
|
|
// Tooltip Handling
|
|
// ============================================================================
|
|
|
|
import {createElement} from 'utilities/dom';
|
|
import {has, maybe_call} from 'utilities/object';
|
|
|
|
import Tooltip from 'utilities/tooltip';
|
|
import Module from 'utilities/module';
|
|
|
|
export default class TooltipProvider extends Module {
|
|
constructor(...args) {
|
|
super(...args);
|
|
this.types = {};
|
|
|
|
this.should_enable = true;
|
|
|
|
this.types.json = target => {
|
|
const title = target.dataset.title;
|
|
return [
|
|
title && createElement('strong', null, title),
|
|
createElement('code', {
|
|
className: `block${title ? ' pd-t-05 border-t mg-t-05' : ''}`,
|
|
style: {
|
|
fontFamily: 'monospace',
|
|
textAlign: 'left'
|
|
}
|
|
}, target.dataset.data)
|
|
]
|
|
}
|
|
|
|
this.types.html = target => target.dataset.title;
|
|
}
|
|
|
|
onEnable() {
|
|
const container = document.querySelector('.twilight-root,.twilight-minimal-root') || document.body,
|
|
is_minimal = container && container.classList.contains('twilight-minimal-root');
|
|
|
|
this.tips = new Tooltip(is_minimal ? '.twilight-minimal-root,body' : 'body #root,body', 'ffz-tooltip', {
|
|
html: true,
|
|
delayHide: this.checkDelayHide.bind(this),
|
|
delayShow: this.checkDelayShow.bind(this),
|
|
content: this.process.bind(this),
|
|
interactive: this.checkInteractive.bind(this),
|
|
popper: {
|
|
placement: 'top',
|
|
modifiers: {
|
|
flip: {
|
|
behavior: ['top', 'bottom', 'left', 'right']
|
|
},
|
|
preventOverflow: {
|
|
boundariesElement: container
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
checkDelayShow(target, tip) {
|
|
const type = target.dataset.tooltipType,
|
|
handler = this.types[type];
|
|
|
|
if ( has(handler, 'delayShow') )
|
|
return maybe_call(handler.delayShow, null, target, tip);
|
|
|
|
return 0;
|
|
}
|
|
|
|
checkDelayHide(target, tip) {
|
|
const type = target.dataset.tooltipType,
|
|
handler = this.types[type];
|
|
|
|
if ( has(handler, 'delayHide') )
|
|
return maybe_call(handler.delayHide, null, target, tip);
|
|
|
|
return 0;
|
|
}
|
|
|
|
checkInteractive(target, tip) {
|
|
const type = target.dataset.tooltipType,
|
|
handler = this.types[type];
|
|
|
|
if ( has(handler, 'interactive') )
|
|
return maybe_call(handler.interactive, null, target, tip);
|
|
|
|
return false;
|
|
}
|
|
|
|
process(target, tip) {
|
|
const type = target.dataset.tooltipType,
|
|
handler = this.types[type];
|
|
|
|
if ( ! handler )
|
|
return [
|
|
createElement('strong', null, 'Unhandled Tooltip Type'),
|
|
createElement('code', {
|
|
className: 'block pd-t-05 border-t mg-t-05',
|
|
style: {
|
|
fontFamily: 'monospace',
|
|
textAlign: 'left'
|
|
}
|
|
}, JSON.stringify(target.dataset, null, 4))
|
|
];
|
|
|
|
return handler(target, tip);
|
|
}
|
|
} |