BIV v1.0.1 show as overlay
This commit is contained in:
parent
a8c94b8874
commit
c08eef29d2
|
@ -37,16 +37,16 @@ var BetterImageViewer = (() => {
|
|||
twitter_username: ''
|
||||
}
|
||||
],
|
||||
version: '1.0.0',
|
||||
version: '1.0.1',
|
||||
description: 'Telegram image viewer ported to Discord. Adds ability to go between images in the current channel with arrow keys, or on screen buttons. Also provides info about the image, who posted it and when.',
|
||||
github: 'https://github.com/1Lighty',
|
||||
github_raw: 'https://raw.githubusercontent.com/1Lighty/BetterDiscordPlugins/master/Plugins/BetterImageViewer/BetterImageViewer.plugin.js'
|
||||
},
|
||||
changelog: [
|
||||
{
|
||||
title: 'Huzzah!',
|
||||
type: 'added',
|
||||
items: ['Plugin exists. That is all.']
|
||||
title: "Now you're thinking with portals!",
|
||||
type: 'fixed',
|
||||
items: ['Nav buttons and info are now an overlay which means, fixed an issue from a certain trash plugin from a certain bad developer of who we do not speak of.']
|
||||
}
|
||||
],
|
||||
defaultConfig: [
|
||||
|
@ -120,9 +120,10 @@ var BetterImageViewer = (() => {
|
|||
/* Build */
|
||||
const buildPlugin = ([Plugin, Api]) => {
|
||||
const { Utilities, WebpackModules, DiscordModules, ReactComponents, DiscordAPI, Logger, Patcher, PluginUtilities, PluginUpdater } = Api;
|
||||
const { React, ModalStack, DiscordConstants, Dispatcher, GuildStore, GuildMemberStore, TextElement, MessageStore, APIModule, NavigationUtils } = DiscordModules;
|
||||
const { React, ReactDOM, ModalStack, DiscordConstants, Dispatcher, GuildStore, GuildMemberStore, TextElement, MessageStore, APIModule, NavigationUtils } = DiscordModules;
|
||||
|
||||
let PluginBrokenFatal = false;
|
||||
let overlayDOMNode;
|
||||
|
||||
const { ARROW_LEFT, ARROW_RIGHT } = DiscordConstants.KeyboardKeys;
|
||||
const Icon = WebpackModules.getByDisplayName('Icon');
|
||||
|
@ -658,6 +659,8 @@ var BetterImageViewer = (() => {
|
|||
ret.props.children[0].props.id = message.id + currentImage;
|
||||
const iMember = DiscordAPI.currentGuild && GuildMemberStore.getMember(DiscordAPI.currentGuild.id, message.author.id);
|
||||
ret.props.children.push(
|
||||
ReactDOM.createPortal(
|
||||
[
|
||||
this.props.settings.ui.navButtons
|
||||
? [
|
||||
React.createElement(
|
||||
|
@ -878,6 +881,9 @@ var BetterImageViewer = (() => {
|
|||
)
|
||||
)
|
||||
)
|
||||
],
|
||||
overlayDOMNode
|
||||
)
|
||||
);
|
||||
return ret;
|
||||
}
|
||||
|
@ -885,6 +891,11 @@ var BetterImageViewer = (() => {
|
|||
|
||||
return class BetterImageViewer extends Plugin {
|
||||
onStart() {
|
||||
if (!overlayDOMNode) {
|
||||
overlayDOMNode = document.createElement('div');
|
||||
overlayDOMNode.className = 'biv-overlay';
|
||||
}
|
||||
document.querySelector('#app-mount').append(overlayDOMNode);
|
||||
this.promises = { state: { cancelled: false } };
|
||||
if (PluginBrokenFatal) {
|
||||
PluginUpdater.checkForUpdate(this.name, this.version, this._config.info.github_raw);
|
||||
|
@ -983,11 +994,22 @@ var BetterImageViewer = (() => {
|
|||
max-width: 900px;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.biv-overlay {
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
z-index: 1000;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.biv-overlay > * {
|
||||
pointer-events: all;
|
||||
}
|
||||
`
|
||||
);
|
||||
}
|
||||
|
||||
onStop() {
|
||||
if (overlayDOMNode) overlayDOMNode.remove();
|
||||
this.promises.state.cancelled = true;
|
||||
Patcher.unpatchAll();
|
||||
Dispatcher.unsubscribe('MESSAGE_DELETE', this.handleMessageDelete);
|
||||
|
@ -1028,6 +1050,7 @@ var BetterImageViewer = (() => {
|
|||
const original = _this.props.original || _this.props.src;
|
||||
ModalStack.push(e => {
|
||||
return React.createElement(
|
||||
/* this safety net should prevent any major issues or crashes, in theory */
|
||||
ErrorCatcher,
|
||||
{
|
||||
label: 'Image modal',
|
||||
|
@ -1231,12 +1254,15 @@ var BetterImageViewer = (() => {
|
|||
ret.props.children.splice(
|
||||
1,
|
||||
0,
|
||||
ReactDOM.createPortal(
|
||||
React.createElement(
|
||||
'div',
|
||||
{
|
||||
className: XenoLib.joinClassNames('BIV-info BIV-info-extra', { 'BIV-hidden': !_this.state.controlsHidden, 'BIV-inactive': _this.state.controlsInactive }, TextElement.Colors.PRIMARY)
|
||||
},
|
||||
React.createElement('table', {}, settings.infoResolution ? renderTableEntry(basicImageInfo ? `${basicImageInfo.width}x${basicImageInfo.height}` : 'NaNxNaN', `${_this.props.width}x${_this.props.height}`) : null, settings.infoScale ? renderTableEntry(basicImageInfo ? `${(basicImageInfo.ratio * 100).toFixed(0)}%` : 'NaN%', basicImageInfo ? `${(100 - basicImageInfo.ratio * 100).toFixed(0)}%` : 'NaN%') : null, settings.infoSize ? renderTableEntry(imageSize ? imageSize : 'NaN', originalImageSize ? (originalImageSize === imageSize ? '~' : originalImageSize) : 'NaN') : null)
|
||||
),
|
||||
overlayDOMNode
|
||||
)
|
||||
);
|
||||
});
|
||||
|
@ -1256,12 +1282,10 @@ var BetterImageViewer = (() => {
|
|||
}
|
||||
get short() {
|
||||
let string = '';
|
||||
|
||||
for (let i = 0, len = config.info.name.length; i < len; i++) {
|
||||
const char = config.info.name[i];
|
||||
if (char === char.toUpperCase()) string += char;
|
||||
}
|
||||
|
||||
return string;
|
||||
}
|
||||
get author() {
|
||||
|
@ -1327,7 +1351,7 @@ var BetterImageViewer = (() => {
|
|||
ret += 'XenoLib ';
|
||||
if (zlibMissing || ZeresPluginLibraryOutdated) ret += 'and ZeresPluginLibrary ';
|
||||
} else if (zlibMissing || ZeresPluginLibraryOutdated) ret += 'ZeresPluginLibrary ';
|
||||
ret += `required for ${this.getName()} ${bothLibsShit ? 'are' : 'is'} ${XenoLibMissing || zlibMissing ? 'missing' : ''}${XenoLibOutdated || ZeresPluginLibraryOutdated ? (XenoLibMissing || zlibMissing ? ' and/or outdated' : 'outdated') : ''}.`;
|
||||
ret += `required for ${this.name} ${bothLibsShit ? 'are' : 'is'} ${XenoLibMissing || zlibMissing ? 'missing' : ''}${XenoLibOutdated || ZeresPluginLibraryOutdated ? (XenoLibMissing || zlibMissing ? ' and/or outdated' : 'outdated') : ''}.`;
|
||||
return ret;
|
||||
})();
|
||||
const ModalStack = BdApi.findModuleByProps('push', 'update', 'pop', 'popWithKey');
|
||||
|
@ -1342,7 +1366,7 @@ var BetterImageViewer = (() => {
|
|||
const listener = () => {
|
||||
BDEvents.off('xenolib-loaded', listener);
|
||||
ModalStack.popWithKey(modalId); /* make it easier on the user */
|
||||
pluginModule.reloadPlugin(this.getName());
|
||||
pluginModule.reloadPlugin(this.name);
|
||||
};
|
||||
BDEvents.on('xenolib-loaded', listener);
|
||||
return () => BDEvents.off('xenolib-loaded', listener);
|
||||
|
@ -1352,7 +1376,7 @@ var BetterImageViewer = (() => {
|
|||
BDEvents.off('plugin-loaded', onLibLoaded);
|
||||
BDEvents.off('plugin-reloaded', onLibLoaded);
|
||||
ModalStack.popWithKey(modalId); /* make it easier on the user */
|
||||
pluginModule.reloadPlugin(this.getName());
|
||||
pluginModule.reloadPlugin(this.name);
|
||||
};
|
||||
BDEvents.on('plugin-loaded', onLibLoaded);
|
||||
BDEvents.on('plugin-reloaded', onLibLoaded);
|
||||
|
|
|
@ -1,3 +1,6 @@
|
|||
# [BetterImageViewer](https://1lighty.github.io/BetterDiscordStuff/?plugin=BetterImageViewer "BetterImageViewer") Changelog
|
||||
### 1.0.1
|
||||
- Nav buttons and info are now an overlay which means, fixed an issue from a certain trash plugin from a certain bad developer of who we do not speak of.
|
||||
|
||||
### 1.0.0
|
||||
- Initial release
|
||||
|
|
Loading…
Reference in New Issue