lightcordwarez
/
1Lighty-BetterDiscordPlugins
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

BIV v1.4.1 image filename, zoom fixes

This commit is contained in:
_Lighty_ 2020-09-02 14:21:30 +02:00
parent c733c83b54
commit 37ddedd990
2 changed files with 59 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

83
Plugins/BetterImageViewer/BetterImageViewer.plugin.js
View File

@ -37,7 +37,7 @@ module.exports = (() => {
twitter_username: '' twitter_username: ''
} }
], ],
version: '1.4.0', version: '1.4.1',
description: 'Move between images in the entire channel with arrow keys, image zoom enabled by clicking and holding, scroll wheel to zoom in and out, hold shift to change lens size. Image previews will look sharper no matter what scaling you have, and will take up as much space as possible.', description: 'Move between images in the entire channel with arrow keys, image zoom enabled by clicking and holding, scroll wheel to zoom in and out, hold shift to change lens size. Image previews will look sharper no matter what scaling you have, and will take up as much space as possible.',
github: 'https://github.com/1Lighty', github: 'https://github.com/1Lighty',
github_raw: 'https://raw.githubusercontent.com/1Lighty/BetterDiscordPlugins/master/Plugins/BetterImageViewer/BetterImageViewer.plugin.js' github_raw: 'https://raw.githubusercontent.com/1Lighty/BetterDiscordPlugins/master/Plugins/BetterImageViewer/BetterImageViewer.plugin.js'
@ -46,12 +46,17 @@ module.exports = (() => {
{ {
title: 'fixed', title: 'fixed',
type: 'fixed', type: 'fixed',
items: ['Fixed crashes on canary.', 'Fixed image zoom not working on canary.', 'Fixed image zoom not working quite right if you zoomed too early when opening an image (thx A User for reporting this obscure bug).'] items: ['Fixed zoom behaving weird when scrolling and moving the mouse at the same time.', 'Decreased the local ratelimit of using search API from 3.5 seconds to 1.5 seconds so it\'s less annoying to deal with.']
}, },
{ {
title: 'Appropriate backports', title: 'Removed',
type: 'fixed',
items: ['Removed % update and downscaled info.']
},
{
title: 'Added',
type: 'added', type: 'added',
items: ['Image zoom will now show the already loaded image first while it\'s loading the full image, for a smoother experience. After the full image is loaded, it quickly switches to it as it\'s obviously higher quality.'] items: ['Added image filename option.']
} }
], ],
defaultConfig: [ defaultConfig: [
@ -75,16 +80,15 @@ module.exports = (() => {
value: true value: true
}, },
{ {
name: 'Show image resolution', name: 'Show image filename',
note: 'Left is downscaled, right is original', id: 'infoFilename',
id: 'infoResolution',
type: 'switch', type: 'switch',
value: true value: true
}, },
{ {
name: 'Show image scale', name: 'Show image resolution',
note: 'Left value is % of original size, right is % downscaled', note: 'Left is downscaled, right is original',
id: 'infoScale', id: 'infoResolution',
type: 'switch', type: 'switch',
value: true value: true
}, },
@ -322,11 +326,9 @@ module.exports = (() => {
window.removeEventListener('mousewheel', this.handleMouseWheel); window.removeEventListener('mousewheel', this.handleMouseWheel);
this._handleSaveLensWHChangeDC.cancel(); this._handleSaveLensWHChangeDC.cancel();
this._handleSaveLensWHChange(); this._handleSaveLensWHChange();
if (typeof this._controller.destroy === 'function') this._controller.destroy(); this._controller.dispose();
else this._controller.dispose();
this._controller = null; this._controller = null;
if (typeof this._zoomController.destroy === 'function') this._zoomController.destroy(); this._zoomController.dispose();
else this._zoomController.dispose();
this._zoomController = null; this._zoomController = null;
} }
componentDidUpdate(prevProps, prevState, snapshot) { componentDidUpdate(prevProps, prevState, snapshot) {
@ -489,13 +491,13 @@ module.exports = (() => {
React.createElement(this.props.__BIV_animated ? ReactSpring.animated.video : ReactSpring.animated.img, { React.createElement(this.props.__BIV_animated ? ReactSpring.animated.video : ReactSpring.animated.img, {
onError: _ => this.getRawImage(true), onError: _ => this.getRawImage(true),
src: this.props.__BIV_animated ? this.props.__BIV_src : this.state.loaded ? this.state.raw : this.props.src, src: this.props.__BIV_animated ? this.props.__BIV_src : this.state.loaded ? this.state.raw : this.props.src,
width: props.imgWidth.to(e => e),
height: props.imgHeight.to(e => e),
style: this.props.__BIV_settings.interp style: this.props.__BIV_settings.interp
? { transform: ReactSpring.to([props.imgLeft, props.imgTop], (x, y) => `translate3d(${x}px, ${y}px, 0)`) } ? { transform: props.img.to(({ x, y }) => `translate3d(${x}px, ${y}px, 0)`) }
: { : {
imageRendering: 'pixelated', imageRendering: 'pixelated',
transform: ReactSpring.to([props.imgLeft, props.imgTop], (x, y) => `translate3d(${x}px, ${y}px, 0)`) transform: props.img.to(({ x, y }) => `translate3d(${x}px, ${y}px, 0)`),
width: props.img.to(({ w }) => `${w}px`).to(e => e),
height: props.img.to(({ h }) => `${h}px`).to(e => e) /* even when you animate everything at the same time */
}, },
...(this.props.__BIV_animated ? { autoPlay: true, muted: true, loop: true } : {}) ...(this.props.__BIV_animated ? { autoPlay: true, muted: true, loop: true } : {})
}) })
@ -541,15 +543,19 @@ module.exports = (() => {
className: 'BIV-zoom-backdrop' className: 'BIV-zoom-backdrop'
}), }),
this.renderLens(ea, { this.renderLens(ea, {
imgContainerLeft:(this._controller.animated || this._controller.springs).panelX, imgContainerLeft: this._controller.springs.panelX,
imgContainerTop:(this._controller.animated || this._controller.springs).panelY, imgContainerTop: this._controller.springs.panelY,
imgLeft: ReactSpring.to([(this._zoomController.animated || this._zoomController.springs).zoom, (this._controller.animated || this._controller.springs).offsetX], (z, x) => (this._bcr.left - ((this._bcr.width * z - this._bcr.width) / (this._bcr.width * z)) * x * z)), img: ReactSpring.to([this._zoomController.springs.zoom, this._controller.springs.offsetX, this._controller.springs.offsetY], (z, x, y) => {
imgTop: ReactSpring.to([(this._zoomController.animated || this._zoomController.springs).zoom, (this._controller.animated || this._controller.springs).offsetY], (z, y) => (this._bcr.top - ((this._bcr.height * z - this._bcr.height) / (this._bcr.height * z)) * y * z)), return {
imgWidth: ReactSpring.to([(this._zoomController.animated || this._zoomController.springs).zoom], e => e * this.props.width), x: this._bcr.left - ((this._bcr.width * z - this._bcr.width) / (this._bcr.width * z)) * x * z,
imgHeight: ReactSpring.to([(this._zoomController.animated || this._zoomController.springs).zoom], e => e * this.props.height), y: this._bcr.top - ((this._bcr.height * z - this._bcr.height) / (this._bcr.height * z)) * y * z,
panelX: (this._controller.animated || this._controller.springs).panelX, w: z * this.props.width,
panelY: (this._controller.animated || this._controller.springs).panelY, h: z * this.props.height
panelWH: (this._controller.animated || this._controller.springs).panelWH };
}),
panelX: this._controller.springs.panelX,
panelY: this._controller.springs.panelY,
panelWH: this._controller.springs.panelWH
}) })
] ]
), ),
@ -884,13 +890,13 @@ module.exports = (() => {
if (!this.props.__BIV_isSearch && this.processCache(OldForwardSearchCache, lastId, reverse)) return; if (!this.props.__BIV_isSearch && this.processCache(OldForwardSearchCache, lastId, reverse)) return;
if (!this.props.__BIV_isSearch && this.processCache(OldSearchCache, lastId, reverse)) return; if (!this.props.__BIV_isSearch && this.processCache(OldSearchCache, lastId, reverse)) return;
if (this.state.rateLimited) return; if (this.state.rateLimited) return;
if (!this.state.indexing && Date.now() - this._lastSearch < 3500) { if (!this.state.indexing && Date.now() - this._lastSearch < 1500) {
if (!this.state.localRateLimited) { if (!this.state.localRateLimited) {
this.state.localRateLimited = this.setState({ this.state.localRateLimited = this.setState({
localRateLimited: setTimeout(() => { localRateLimited: setTimeout(() => {
this.state.localRateLimited = 0; this.state.localRateLimited = 0;
this.handleSearch(lastId, reverse); this.handleSearch(lastId, reverse);
}, 3500 - (Date.now() - this._lastSearch)) }, 1500 - (Date.now() - this._lastSearch))
}); });
} }
return; return;
@ -1542,6 +1548,23 @@ module.exports = (() => {
this.saveHiddenSettings(); this.saveHiddenSettings();
} }
fetchFilename(url) {
try {
if (url.indexOf('//giphy.com/gifs/') !== -1) url = `https://i.giphy.com/media/${url.match(/-([^-]+)$/)[1]}/giphy.gif`;
const match = url.match(/(?:\/)([^\/]+?)(?:(?:\.)([^.\/?:]+)){0,1}(?:[^\w\/\.]+\w+){0,1}(?:(?:\?[^\/]+){0,1}|(?:\/){0,1})$/);
let name = match[1];
let extension = match[2] || '.png';
if (url.indexOf('//media.tenor.co') !== -1) {
extension = name;
name = url.match(/\/\/media.tenor.co\/[^\/]+\/([^\/]+)\//)[1];
} else if (url.indexOf('//i.giphy.com/media/') !== -1) name = url.match(/\/\/i\.giphy\.com\/media\/([^\/]+)\//)[1];
return `${name}.${extension}`;
} catch (err) {
Logger.stacktrace('Failed to fetch filename', url, err);
return 'unknown.png';
}
}
/* PATCHES */ /* PATCHES */
patchAll() { patchAll() {
@ -1847,7 +1870,7 @@ module.exports = (() => {
{ {
className: XenoLib.joinClassNames('BIV-info BIV-info-extra', { 'BIV-hidden': !_this.state.controlsVisible, 'BIV-inactive': _this.state.controlsInactive && !debug }, TextElement.Colors.STANDARD) className: XenoLib.joinClassNames('BIV-info BIV-info-extra', { 'BIV-hidden': !_this.state.controlsVisible, 'BIV-inactive': _this.state.controlsInactive && !debug }, TextElement.Colors.STANDARD)
}, },
React.createElement('table', {}, settings.infoResolution || debug ? renderTableEntry(basicImageInfo ? React.createElement('span', { className: _this.state.showFullRes ? TextElement.Colors.ERROR : undefined }, `${basicImageInfo.width}x${basicImageInfo.height}`) : 'NaNxNaN', `${_this.props.width}x${_this.props.height}`) : null, settings.infoScale || debug ? renderTableEntry(basicImageInfo ? `${(basicImageInfo.ratio * 100).toFixed(0)}%` : 'NaN%', basicImageInfo ? `${(100 - basicImageInfo.ratio * 100).toFixed(0)}%` : 'NaN%') : null, settings.infoSize || debug ? renderTableEntry(imageSize ? imageSize : 'NaN', originalImageSize ? (originalImageSize === imageSize ? '~' : originalImageSize) : 'NaN') : null, debug ? Object.keys(_this.state).map(key => (!XenoLib._.isObject(_this.state[key]) && key !== 'src' && key !== 'original' && key !== 'placeholder' ? renderTableEntry(key, String(_this.state[key])) : null)) : null) React.createElement('table', {}, settings.infoFilename || debug ? React.createElement('tr', {}, React.createElement('td', {colspan:2}, this.fetchFilename(_this.props.src))) : null, settings.infoResolution || debug ? renderTableEntry(basicImageInfo ? React.createElement('span', { className: _this.state.showFullRes ? TextElement.Colors.ERROR : undefined }, `${basicImageInfo.width}x${basicImageInfo.height}`) : 'NaNxNaN', `${_this.props.width}x${_this.props.height}`) : null, settings.infoSize || debug ? renderTableEntry(imageSize ? imageSize : 'NaN', originalImageSize ? (originalImageSize === imageSize ? '~' : originalImageSize) : 'NaN') : null, debug ? Object.keys(_this.state).map(key => (!XenoLib._.isObject(_this.state[key]) && key !== 'src' && key !== 'original' && key !== 'placeholder' ? renderTableEntry(key, String(_this.state[key])) : null)) : null)
), ),
overlayDOMNode overlayDOMNode
) )

6
Plugins/BetterImageViewer/CHANGELOG.md
View File

@ -1,4 +1,10 @@
# [BetterImageViewer](https://1lighty.github.io/BetterDiscordStuff/?plugin=BetterImageViewer "BetterImageViewer") Changelog # [BetterImageViewer](https://1lighty.github.io/BetterDiscordStuff/?plugin=BetterImageViewer "BetterImageViewer") Changelog
### 1.4.1
- Fixed zoom behaving weird when scrolling and moving the mouse at the same time.
- Decreased the local ratelimit of using search API from 3.5 seconds to 1.5 seconds so it's less annoying to deal with.
- Removed % update and downscaled info.
- Added image filename option.
### 1.4.0 ### 1.4.0
- Fixed crashes on canary. - Fixed crashes on canary.
- Fixed image zoom not working on canary. - Fixed image zoom not working on canary.