Image preview fixes
This commit is contained in:
Mr. Stallion
parent
09c182be3b
commit
ae844e3054
|
|
@ -9,7 +9,8 @@
|
|||
<a @click="toggleStickyMode()" :class="{toggled: sticky}" title="Toggle Stickyness"><i class="fa fa-thumbtack"></i></a>
|
||||
</div>
|
||||
|
||||
<webview src="about:blank" nodeintegration webpreferences="allowRunningInsecureContent, autoplayPolicy=no-user-gesture-required" id="image-preview-ext" ref="imagePreviewExt" class="image-preview-external" :style="externalPreviewStyle"></webview>
|
||||
<!-- note: preload requires a webpack config CopyPlugin configuration -->
|
||||
<webview preload="./preview/assets/browser.pre.js" src="about:blank" nodeintegration webpreferences="allowRunningInsecureContent, autoplayPolicy=no-user-gesture-required" id="image-preview-ext" ref="imagePreviewExt" class="image-preview-external" :style="externalPreviewStyle"></webview>
|
||||
|
||||
<div
|
||||
class="image-preview-local"
|
||||
|
|
@ -540,7 +541,7 @@
|
|||
width: 50%;
|
||||
height: 70%;
|
||||
pointer-events: none;
|
||||
overflow: hidden;
|
||||
overflow: visible;
|
||||
|
||||
&.visible {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,14 @@
|
|||
(() => {
|
||||
try {
|
||||
console.log('RUNNING RUNNING RUNNING', Date.now());
|
||||
document.querySelectorAll('iframe').forEach((e) => e.remove());
|
||||
|
||||
window.addEventListener('DOMContentLoaded', (event) => {
|
||||
document.querySelectorAll('iframe').forEach((e) => e.remove());
|
||||
console.log('DOM fully loaded and parsed', Date.now());
|
||||
});
|
||||
} catch(e) {
|
||||
console.error(e);
|
||||
}
|
||||
})();
|
||||
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { ImageUrlMutator } from '../image-url-mutator';
|
||||
import { ImagePreviewHelper } from './index';
|
||||
import { ImagePreviewHelper } from './helper';
|
||||
import * as _ from 'lodash';
|
||||
|
||||
export class ExternalImagePreviewHelper extends ImagePreviewHelper {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,35 @@
|
|||
import ImagePreview from '../ImagePreview.vue';
|
||||
|
||||
export abstract class ImagePreviewHelper {
|
||||
protected visible = false;
|
||||
protected url: string | null = 'about:blank';
|
||||
protected parent: ImagePreview;
|
||||
protected debug: boolean;
|
||||
|
||||
abstract show(url: string): void;
|
||||
abstract hide(): void;
|
||||
abstract match(domainName: string): boolean;
|
||||
abstract renderStyle(): Record<string, any>;
|
||||
|
||||
constructor(parent: ImagePreview) {
|
||||
if (!parent) {
|
||||
throw new Error('Empty parent!');
|
||||
}
|
||||
|
||||
this.parent = parent;
|
||||
this.debug = parent.debug;
|
||||
}
|
||||
|
||||
isVisible(): boolean {
|
||||
return this.visible;
|
||||
}
|
||||
|
||||
getUrl(): string | null {
|
||||
return this.url;
|
||||
}
|
||||
|
||||
setDebug(debug: boolean): void {
|
||||
this.debug = debug;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1,38 +1,4 @@
|
|||
import ImagePreview from '../ImagePreview.vue';
|
||||
|
||||
export * from './helper';
|
||||
export * from './external';
|
||||
export * from './local';
|
||||
|
||||
export abstract class ImagePreviewHelper {
|
||||
protected visible = false;
|
||||
protected url: string | null = 'about:blank';
|
||||
protected parent: ImagePreview;
|
||||
protected debug: boolean;
|
||||
|
||||
abstract show(url: string): void;
|
||||
abstract hide(): void;
|
||||
abstract match(domainName: string): boolean;
|
||||
abstract renderStyle(): Record<string, any>;
|
||||
|
||||
constructor(parent: ImagePreview) {
|
||||
if (!parent) {
|
||||
throw new Error('Empty parent!');
|
||||
}
|
||||
|
||||
this.parent = parent;
|
||||
this.debug = parent.debug;
|
||||
}
|
||||
|
||||
isVisible(): boolean {
|
||||
return this.visible;
|
||||
}
|
||||
|
||||
getUrl(): string | null {
|
||||
return this.url;
|
||||
}
|
||||
|
||||
setDebug(debug: boolean): void {
|
||||
this.debug = debug;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { ImagePreviewHelper } from './index';
|
||||
import { ImagePreviewHelper } from './helper';
|
||||
|
||||
export class LocalImagePreviewHelper extends ImagePreviewHelper {
|
||||
hide(): void {
|
||||
|
|
|
|||
|
|
@ -19,6 +19,12 @@ export interface ImagePreviewMutatorCollection {
|
|||
}
|
||||
|
||||
|
||||
// tslint:disable-next-line:max-line-length
|
||||
const imgurOuterStyle = 'z-index: 1000000; position: absolute; bottom: 0.75rem; right: 0.75rem; background: rgba(0, 128, 0, 0.8); border: 2px solid rgba(144, 238, 144, 0.5); width: 3rem; height: 3rem; font-size: 15pt; font-weight: normal; color: white; border-radius: 3rem; margin: 0; font-family: Helvetica,Arial,sans-serif; box-shadow: 2px 2px 2px rgba(0,0,0,0.5)';
|
||||
// tslint:disable-next-line:max-line-length
|
||||
const imgurInnerStyle = 'position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); text-shadow: 1px 1px 2px rgba(0,0,0,0.4);';
|
||||
|
||||
|
||||
export class ImagePreviewMutator {
|
||||
// tslint:disable: prefer-function-over-method
|
||||
private hostMutators: ImagePreviewMutatorCollection = {};
|
||||
|
|
@ -120,7 +126,7 @@ export class ImagePreviewMutator {
|
|||
this.add('youtube.com', this.getBaseJsMutatorScript(['video']), undefined, 'dom-ready');
|
||||
this.add('instantfap.com', this.getBaseJsMutatorScript(['#post video', '#post img']));
|
||||
this.add('webmshare.com', this.getBaseJsMutatorScript(['video']));
|
||||
this.add('pornhub.com', this.getBaseJsMutatorScript(['.mainPlayerDiv video', '.photoImageSection img']));
|
||||
this.add('pornhub.com', this.getBaseJsMutatorScript(['.mainPlayerDiv video[preload="auto"]', '.mainPlayerDiv video[preload="none"]', '.mainPlayerDiv video', '.photoImageSection img']));
|
||||
this.add('sex.com', this.getBaseJsMutatorScript(['.image_frame video', '.image_frame img']));
|
||||
this.add('redirect.media.tumblr.com', this.getBaseJsMutatorScript(['picture video', 'picture img']));
|
||||
this.add('postimg.cc', this.getBaseJsMutatorScript(['video', '#main-image']));
|
||||
|
|
@ -131,7 +137,6 @@ export class ImagePreviewMutator {
|
|||
this.add(/^media[0-9]\.tenor\.com$/, this.getBaseJsMutatorScript(['#view .file video', '#view .file img']));
|
||||
this.add('tenor.com', this.getBaseJsMutatorScript(['#view video', '#view img']));
|
||||
|
||||
// tslint:disable max-line-length
|
||||
this.add(
|
||||
'i.imgur.com',
|
||||
`
|
||||
|
|
@ -140,18 +145,17 @@ export class ImagePreviewMutator {
|
|||
${this.getBaseJsMutatorScript(['video', 'img'])}
|
||||
|
||||
if(imageCount > 1) {
|
||||
${this.injectHtmlJs('<div id="imageCount" style="z-index: 1000000; position: absolute; bottom: 0; right: 0; background: green; border: 2px solid lightgreen; width: 5rem; height: 5rem; font-size: 2rem; font-weight: bold; color: white; border-radius: 5rem; margin: 0.75rem;"><div id="imageCountInner" style="position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%);"></div></div>')}
|
||||
${this.injectHtmlJs(`<div id="imageCount" style="${imgurOuterStyle}"><div id="imageCountInner" style="${imgurInnerStyle}"></div></div>`)}
|
||||
|
||||
const imageCountEl = document.getElementById('imageCountInner');
|
||||
|
||||
if (imageCountEl) {
|
||||
imageCountEl.innerHTML = '+' + (imageCount - 1);
|
||||
imageCountEl.innerHTML = '' + (imageCount);
|
||||
}
|
||||
}
|
||||
`
|
||||
);
|
||||
|
||||
// tslint:disable max-line-length
|
||||
this.add(
|
||||
'imgur.com',
|
||||
`
|
||||
|
|
@ -160,7 +164,7 @@ export class ImagePreviewMutator {
|
|||
${this.getBaseJsMutatorScript(['.post-container video', '.post-container img'], true)}
|
||||
|
||||
if(imageCount > 1)
|
||||
$('#flistWrapper').append('<div id="imageCount" style="position: absolute; bottom: 0; right: 0; background: green; border: 2px solid lightgreen; width: 5rem; height: 5rem; font-size: 2rem; font-weight: bold; color: white; border-radius: 5rem; margin: 0.75rem;"><div style="position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%);">+' + (imageCount - 1) + '</div></div>');
|
||||
$('#flistWrapper').append('<div id="imageCount" style="${imgurOuterStyle}"><div style="${imgurInnerStyle}">+' + (imageCount - 1) + '</div></div>');
|
||||
`
|
||||
);
|
||||
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ const ForkTsCheckerWebpackPlugin = require('@f-list/fork-ts-checker-webpack-plug
|
|||
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
|
||||
const VueLoaderPlugin = require('vue-loader/lib/plugin');
|
||||
const vueTransformer = require('@f-list/vue-ts/transform').default;
|
||||
const CopyPlugin = require('copy-webpack-plugin');
|
||||
|
||||
const mainConfig = {
|
||||
entry: [path.join(__dirname, 'main.ts'), path.join(__dirname, 'package.json')],
|
||||
|
|
@ -94,7 +95,12 @@ const mainConfig = {
|
|||
tsconfig: './tsconfig-renderer.json',
|
||||
vue: true
|
||||
}),
|
||||
new VueLoaderPlugin()
|
||||
new VueLoaderPlugin(),
|
||||
new CopyPlugin(
|
||||
[
|
||||
{ from: path.resolve(__dirname, '..', 'chat', 'preview', 'assets', '**/*'), to: path.join('preview', 'assets'), context: path.resolve(__dirname, '..', 'chat', 'preview', 'assets') }
|
||||
]
|
||||
)
|
||||
],
|
||||
resolve: {
|
||||
extensions: ['.ts', '.js', '.vue', '.css'],
|
||||
|
|
@ -125,4 +131,4 @@ module.exports = function(mode) {
|
|||
mainConfig.devtool = rendererConfig.devtool = 'none';
|
||||
}
|
||||
return [mainConfig, rendererConfig];
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@
|
|||
"axios": "^0.19.0",
|
||||
"bootstrap": "^4.3.1",
|
||||
"css-loader": "^3.0.0",
|
||||
"copy-webpack-plugin": "^5.1.1",
|
||||
"date-fns": "^1.30.1",
|
||||
"electron": "^5.0.4",
|
||||
"electron-log": "^3.0.1",
|
||||
|
|
|
|||
83
yarn.lock
83
yarn.lock
|
|
@ -369,6 +369,11 @@ amdefine@>=0.0.4:
|
|||
resolved "https://registry.yarnpkg.com/amdefine/-/amdefine-1.0.1.tgz#4a5282ac164729e93619bcfd3ad151f817ce91f5"
|
||||
integrity sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU=
|
||||
|
||||
ansi-colors@^3.0.0:
|
||||
version "3.2.4"
|
||||
resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.4.tgz#e3a3da4bfbae6c86a9c285625de124a234026fbf"
|
||||
integrity sha512-hHUXGagefjN2iRrID63xckIvotOXOojhQKWIPUZ4mNUZ9nLZW+7FMNoE1lOkEhNWYsx/7ysGIuJYCiMAA9FnrA==
|
||||
|
||||
ansi-regex@^2.0.0:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.1.1.tgz#c3b33ab5ee360d86e0e628f0468ae7ef27d654df"
|
||||
|
|
@ -484,6 +489,18 @@ array-flatten@1.1.1:
|
|||
resolved "https://registry.yarnpkg.com/array-flatten/-/array-flatten-1.1.1.tgz#9a5f699051b1e7073328f2a008968b64ea2955d2"
|
||||
integrity sha1-ml9pkFGx5wczKPKgCJaLZOopVdI=
|
||||
|
||||
array-union@^1.0.1:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/array-union/-/array-union-1.0.2.tgz#9a34410e4f4e3da23dea375be5be70f24778ec39"
|
||||
integrity sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk=
|
||||
dependencies:
|
||||
array-uniq "^1.0.1"
|
||||
|
||||
array-uniq@^1.0.1:
|
||||
version "1.0.3"
|
||||
resolved "https://registry.yarnpkg.com/array-uniq/-/array-uniq-1.0.3.tgz#af6ac877a25cc7f74e058894753858dfdb24fdb6"
|
||||
integrity sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=
|
||||
|
||||
array-unique@^0.3.2:
|
||||
version "0.3.2"
|
||||
resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.3.2.tgz#a894b75d4bc4f6cd679ef3244a9fd8f46ae2d428"
|
||||
|
|
@ -934,7 +951,7 @@ bytes@3.1.0:
|
|||
resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.1.0.tgz#f6cf7933a360e0588fa9fde85651cdc7f805d1f6"
|
||||
integrity sha512-zauLjrfCG+xvoyaqLoV8bLVXXNGC4JqlxFCutSDWA6fJrTo2ZuvLYTqZ7aHBLZSMOopbzwv8f+wZcVzfVTI2Dg==
|
||||
|
||||
cacache@^12.0.2:
|
||||
cacache@^12.0.2, cacache@^12.0.3:
|
||||
version "12.0.3"
|
||||
resolved "https://registry.yarnpkg.com/cacache/-/cacache-12.0.3.tgz#be99abba4e1bf5df461cd5a2c1071fc432573390"
|
||||
integrity sha512-kqdmfXEGFepesTuROHMs3MpFLWrPkSSpRqOw80RCflZXy/khxaArvFrQ7uJxSUduzAufc6G0g1VUCOZXxWavPw==
|
||||
|
|
@ -1386,6 +1403,24 @@ copy-descriptor@^0.1.0:
|
|||
resolved "https://registry.yarnpkg.com/copy-descriptor/-/copy-descriptor-0.1.1.tgz#676f6eb3c39997c2ee1ac3a924fd6124748f578d"
|
||||
integrity sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=
|
||||
|
||||
copy-webpack-plugin@^5.1.1:
|
||||
version "5.1.1"
|
||||
resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-5.1.1.tgz#5481a03dea1123d88a988c6ff8b78247214f0b88"
|
||||
integrity sha512-P15M5ZC8dyCjQHWwd4Ia/dm0SgVvZJMYeykVIVYXbGyqO4dWB5oyPHp9i7wjwo5LhtlhKbiBCdS2NvM07Wlybg==
|
||||
dependencies:
|
||||
cacache "^12.0.3"
|
||||
find-cache-dir "^2.1.0"
|
||||
glob-parent "^3.1.0"
|
||||
globby "^7.1.1"
|
||||
is-glob "^4.0.1"
|
||||
loader-utils "^1.2.3"
|
||||
minimatch "^3.0.4"
|
||||
normalize-path "^3.0.0"
|
||||
p-limit "^2.2.1"
|
||||
schema-utils "^1.0.0"
|
||||
serialize-javascript "^2.1.2"
|
||||
webpack-log "^2.0.0"
|
||||
|
||||
core-js@^2.4.0:
|
||||
version "2.6.11"
|
||||
resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.11.tgz#38831469f9922bded8ee21c9dc46985e0399308c"
|
||||
|
|
@ -1810,6 +1845,13 @@ diffie-hellman@^5.0.0:
|
|||
miller-rabin "^4.0.0"
|
||||
randombytes "^2.0.0"
|
||||
|
||||
dir-glob@^2.0.0:
|
||||
version "2.2.2"
|
||||
resolved "https://registry.yarnpkg.com/dir-glob/-/dir-glob-2.2.2.tgz#fa09f0694153c8918b18ba0deafae94769fc50c4"
|
||||
integrity sha512-f9LBi5QWzIW3I6e//uxZoLBlUt9kcp66qo0sSCxL6YZKc75R1c4MFCoe/LaZiBGmgujvQdxc5Bn3QhfyvK5Hsw==
|
||||
dependencies:
|
||||
path-type "^3.0.0"
|
||||
|
||||
dom-serializer@0:
|
||||
version "0.2.2"
|
||||
resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.2.2.tgz#1afb81f533717175d478655debc5e332d9f9bb51"
|
||||
|
|
@ -2765,6 +2807,18 @@ globalthis@^1.0.1:
|
|||
dependencies:
|
||||
define-properties "^1.1.3"
|
||||
|
||||
globby@^7.1.1:
|
||||
version "7.1.1"
|
||||
resolved "https://registry.yarnpkg.com/globby/-/globby-7.1.1.tgz#fb2ccff9401f8600945dfada97440cca972b8680"
|
||||
integrity sha1-+yzP+UAfhgCUXfral0QMypcrhoA=
|
||||
dependencies:
|
||||
array-union "^1.0.1"
|
||||
dir-glob "^2.0.0"
|
||||
glob "^7.1.2"
|
||||
ignore "^3.3.5"
|
||||
pify "^3.0.0"
|
||||
slash "^1.0.0"
|
||||
|
||||
globule@^1.0.0:
|
||||
version "1.3.1"
|
||||
resolved "https://registry.yarnpkg.com/globule/-/globule-1.3.1.tgz#90a25338f22b7fbeb527cee63c629aea754d33b9"
|
||||
|
|
@ -3006,6 +3060,11 @@ iferr@^0.1.5:
|
|||
resolved "https://registry.yarnpkg.com/iferr/-/iferr-0.1.5.tgz#c60eed69e6d8fdb6b3104a1fcbca1c192dc5b501"
|
||||
integrity sha1-xg7taebY/bazEEofy8ocGS3FtQE=
|
||||
|
||||
ignore@^3.3.5:
|
||||
version "3.3.10"
|
||||
resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.10.tgz#0a97fb876986e8081c631160f8f9f389157f0043"
|
||||
integrity sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug==
|
||||
|
||||
image-size@^0.7.4:
|
||||
version "0.7.5"
|
||||
resolved "https://registry.yarnpkg.com/image-size/-/image-size-0.7.5.tgz#269f357cf5797cb44683dfa99790e54c705ead04"
|
||||
|
|
@ -4373,7 +4432,7 @@ p-limit@^1.1.0:
|
|||
dependencies:
|
||||
p-try "^1.0.0"
|
||||
|
||||
p-limit@^2.0.0:
|
||||
p-limit@^2.0.0, p-limit@^2.2.1:
|
||||
version "2.2.2"
|
||||
resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.2.2.tgz#61279b67721f5287aa1c13a9a7fbbc48c9291b1e"
|
||||
integrity sha512-WGR+xHecKTr7EbUEhyLSh5Dube9JtdiG78ufaeLxTgpudf/20KqyMioIUZJAezlTIi6evxuoUs9YXc11cU+yzQ==
|
||||
|
|
@ -4546,6 +4605,13 @@ path-type@^2.0.0:
|
|||
dependencies:
|
||||
pify "^2.0.0"
|
||||
|
||||
path-type@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/path-type/-/path-type-3.0.0.tgz#cef31dc8e0a1a3bb0d105c0cd97cf3bf47f4e36f"
|
||||
integrity sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==
|
||||
dependencies:
|
||||
pify "^3.0.0"
|
||||
|
||||
pbkdf2@^3.0.3:
|
||||
version "3.0.17"
|
||||
resolved "https://registry.yarnpkg.com/pbkdf2/-/pbkdf2-3.0.17.tgz#976c206530617b14ebb32114239f7b09336e93a6"
|
||||
|
|
@ -5676,6 +5742,11 @@ single-line-log@^1.1.2:
|
|||
dependencies:
|
||||
string-width "^1.0.1"
|
||||
|
||||
slash@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/slash/-/slash-1.0.0.tgz#c41f2f6c39fc16d1cd17ad4b5d896114ae470d55"
|
||||
integrity sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=
|
||||
|
||||
snapdragon-node@^2.0.1:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.yarnpkg.com/snapdragon-node/-/snapdragon-node-2.1.1.tgz#6c175f86ff14bdb0724563e8f3c1b021a286853b"
|
||||
|
|
@ -6686,6 +6757,14 @@ wcwidth@^1.0.1:
|
|||
dependencies:
|
||||
defaults "^1.0.3"
|
||||
|
||||
webpack-log@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/webpack-log/-/webpack-log-2.0.0.tgz#5b7928e0637593f119d32f6227c1e0ac31e1b47f"
|
||||
integrity sha512-cX8G2vR/85UYG59FgkoMamwHUIkSSlV3bBMRsbxVXVUk2j6NleCKjQ/WE9eYg9WY4w25O9w8wKP4rzNZFmUcUg==
|
||||
dependencies:
|
||||
ansi-colors "^3.0.0"
|
||||
uuid "^3.3.2"
|
||||
|
||||
webpack-sources@^1.1.0, webpack-sources@^1.4.0, webpack-sources@^1.4.1:
|
||||
version "1.4.3"
|
||||
resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-1.4.3.tgz#eedd8ec0b928fbf1cbfe994e22d2d890f330a933"
|
||||
|
|
|
|||
Loading…
Reference in New Issue