tamius-han/ultrawidify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'stable'

Browse Source
This commit is contained in:
Tamius Han 2019-08-24 23:21:53 +02:00
commit 24dcbdf770
13 changed files with 237 additions and 285 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -13,7 +13,7 @@
"build-edge:dev": "cross-env NODE_ENV=development BROWSER=edge webpack --hide-modules",
"build-zip": "node scripts/build-zip.js",
"watch": "npm run build -- --watch",
"watch-chrome": "npm run build-chrome-- --watch",
"watch-chrome": "npm run build-chrome -- --watch",
"watch-edge": "npm run build-edge -- --watch",
"watch:dev": "cross-env HMR=true npm run build:dev -- --watch",
"watch-chrome:dev": "cross-env HMR=true npm run build-chrome:dev -- --watch",

6
src/ext/conf/Debug.js
View File

@ -1,6 +1,6 @@
// Set prod to true when releasing
const _prod = true;
// const _prod = false;
// const _prod = true;
const _prod = false;
var Debug = {
// performanceMetrics: true, // should not be affected by debug.debug in order to allow benchmarking of the impact logging in console has
@ -19,7 +19,7 @@ var Debug = {
// flushStoredSettings: false,
// playerDetect: true,
// periodic: true,
// videoRescan: true,
// // videoRescan: true,
// mousemove: true,
// arDetect: {
// edgeDetect: true

35
src/ext/lib/ar-detect/ArDetector.js
View File

@ -705,18 +705,31 @@ class ArDetector {
// we also know edges for guardline, so set them.
// we need to be mindful of fallbackMode though
if (!this.fallbackMode) {
this.guardLine.setBlackbar({top: edgePost.guardLineTop, bottom: edgePost.guardLineBottom});
} else {
if (this.conf.player.dimensions){
this.guardLine.setBlackbarManual({
top: this.settings.active.arDetect.fallbackMode.noTriggerZonePx,
bottom: this.conf.player.dimensions.height - this.settings.active.arDetect.fallbackMode.noTriggerZonePx - 1
},{
top: edgePost.guardLineTop + this.settings.active.arDetect.guardLine.edgeTolerancePx,
bottom: edgePost.guardLineBottom - this.settings.active.arDetect.guardLine.edgeTolerancePx
})
// if edges are okay and not invalid, we also
// allow automatic aspect ratio correction. If edges
// are bogus, we remain aspect ratio unchanged.
try {
if (!this.fallbackMode) {
// throws error if top/bottom are invalid
this.guardLine.setBlackbar({top: edgePost.guardLineTop, bottom: edgePost.guardLineBottom});
} else {
if (this.conf.player.dimensions){
this.guardLine.setBlackbarManual({
top: this.settings.active.arDetect.fallbackMode.noTriggerZonePx,
bottom: this.conf.player.dimensions.height - this.settings.active.arDetect.fallbackMode.noTriggerZonePx - 1
},{
top: edgePost.guardLineTop + this.settings.active.arDetect.guardLine.edgeTolerancePx,
bottom: edgePost.guardLineBottom - this.settings.active.arDetect.guardLine.edgeTolerancePx
})
}
}
this.processAr(newAr);
} catch (e) {
// edges weren't gucci, so we'll just reset
// the aspect ratio to defaults
this.guardline.reset();
this.conf.resizer.setAr({type: AspectRatio.Automatic, ratio: this.getDefaultAr()});
}
// }

4
src/ext/lib/ar-detect/GuardLine.js
View File

@ -34,9 +34,7 @@ class GuardLine {
// to odstrani vse neveljavne nastavitve in vse možnosti, ki niso smiselne
// this removes any configs with invalid values or values that dont make sense
if (bbTop < 0 || bbBottom >= this.conf.canvas.height ){
console.log("%c[GuardLine::setBlackbar] INVALID SETTINGS IN GUARDLINE","background: #000; color: #fff")
this.reset();
return;
throw "INVALID_SETTINGS_IN_GUARDLINE"
}
this.blackbar = {

160
src/ext/lib/ar-detect/edge-detect/EdgeDetect.js
View File

@ -247,91 +247,91 @@ class EdgeDetect{
var bottomEdgeCount = 0;
try {
for (const sample of samples.res_top){
blackEdgeViolation = false; // reset this
// determine our bounds. Note that sample.col is _not_ corrected for imageData, but halfSample is
sampleStart = (sample.col << 2) - this.halfSample;
if(sampleStart < 0)
sampleStart = 0;
sampleEnd = sampleStart + this.sampleWidthBase;
if(sampleEnd > this.conf.canvasImageDataRowLength)
sampleEnd = this.conf.canvasImageDataRowLength;
// calculate row offsets for imageData array
sampleRow_black = (sample.black - this.settings.active.arDetect.edgeDetection.edgeTolerancePx - 1) * this.conf.canvasImageDataRowLength;
sampleRow_color = (sample.black + this.settings.active.arDetect.edgeDetection.edgeTolerancePx) * this.conf.canvasImageDataRowLength;
// že ena kršitev črnega roba pomeni, da kandidat ni primeren
// even a single black edge violation means the candidate is not an edge
loopEnd = sampleRow_black + sampleEnd;
for (const sample of samples.res_top){
blackEdgeViolation = false; // reset this
// determine our bounds. Note that sample.col is _not_ corrected for imageData, but halfSample is
sampleStart = (sample.col << 2) - this.halfSample;
if(sampleStart < 0)
sampleStart = 0;
sampleEnd = sampleStart + this.sampleWidthBase;
if (sampleEnd > this.conf.canvasImageDataRowLength)
sampleEnd = this.conf.canvasImageDataRowLength;
// calculate row offsets for imageData array
sampleRow_black = (sample.black - this.settings.active.arDetect.edgeDetection.edgeTolerancePx - 1) * this.conf.canvasImageDataRowLength;
sampleRow_color = (sample.black + this.settings.active.arDetect.edgeDetection.edgeTolerancePx) * this.conf.canvasImageDataRowLength;
// že ena kršitev črnega roba pomeni, da kandidat ni primeren
// even a single black edge violation means the candidate is not an edge
loopEnd = sampleRow_black + sampleEnd;
if(Debug.debugCanvas.enabled){
blackEdgeViolation = this._blackbarTest_dbg(image, sampleRow_black + sampleStart, loopEnd);
} else {
blackEdgeViolation = this._blackbarTest(image, sampleRow_black + sampleStart, loopEnd);
}
if (Debug.debugCanvas.enabled){
blackEdgeViolation = this._blackbarTest_dbg(image, sampleRow_black + sampleStart, loopEnd);
} else {
blackEdgeViolation = this._blackbarTest(image, sampleRow_black + sampleStart, loopEnd);
}
// če je bila črna črta skrunjena, preverimo naslednjega kandidata
// if we failed, we continue our search with the next candidate
if (blackEdgeViolation) {
continue;
}
detections = 0;
loopEnd = sampleRow_color + sampleEnd;
// če je bila črna črta skrunjena, preverimo naslednjega kandidata
// if we failed, we continue our search with the next candidate
if (blackEdgeViolation) {
continue;
}
detections = 0;
loopEnd = sampleRow_color + sampleEnd;
if(Debug.debugCanvas.enabled) {
this._imageTest_dbg(image, sampleRow_color + sampleStart, loopEnd, sample.black, edgeCandidatesTop)
} else {
this._imageTest(image, sampleRow_color + sampleStart, loopEnd, sample.black, edgeCandidatesTop);
}
}
for (const sample of samples.res_bottom){
blackEdgeViolation = false; // reset this
// determine our bounds. Note that sample.col is _not_ corrected for imageData, but this.halfSample is
sampleStart = (sample.col << 2) - this.halfSample;
if(sampleStart < 0)
sampleStart = 0;
sampleEnd = sampleStart + this.sampleWidthBase;
if(sampleEnd > this.conf.canvasImageDataRowLength)
sampleEnd = this.conf.canvasImageDataRowLength;
// calculate row offsets for imageData array
sampleRow_black = (sample.black + this.settings.active.arDetect.edgeDetection.edgeTolerancePx + 1) * this.conf.canvasImageDataRowLength;
sampleRow_color = (sample.black - this.settings.active.arDetect.edgeDetection.edgeTolerancePx) * this.conf.canvasImageDataRowLength;
// že ena kršitev črnega roba pomeni, da kandidat ni primeren
// even a single black edge violation means the candidate is not an edge
loopEnd = sampleRow_black + sampleEnd;
if(Debug.debugCanvas.enabled){
blackEdgeViolation = this._blackbarTest_dbg(image, sampleRow_black + sampleStart, loopEnd);
} else {
blackEdgeViolation = this._blackbarTest(image, sampleRow_black + sampleStart, loopEnd);
if (Debug.debugCanvas.enabled) {
this._imageTest_dbg(image, sampleRow_color + sampleStart, loopEnd, sample.black, edgeCandidatesTop)
} else {
this._imageTest(image, sampleRow_color + sampleStart, loopEnd, sample.black, edgeCandidatesTop);
}
}
// če je bila črna črta skrunjena, preverimo naslednjega kandidata
// if we failed, we continue our search with the next candidate
if (blackEdgeViolation) {
continue;
}
detections = 0;
loopEnd = sampleRow_color + sampleEnd;
for (const sample of samples.res_bottom){
blackEdgeViolation = false; // reset this
// determine our bounds. Note that sample.col is _not_ corrected for imageData, but this.halfSample is
sampleStart = (sample.col << 2) - this.halfSample;
if(sampleStart < 0)
sampleStart = 0;
sampleEnd = sampleStart + this.sampleWidthBase;
if(sampleEnd > this.conf.canvasImageDataRowLength)
sampleEnd = this.conf.canvasImageDataRowLength;
// calculate row offsets for imageData array
sampleRow_black = (sample.black + this.settings.active.arDetect.edgeDetection.edgeTolerancePx + 1) * this.conf.canvasImageDataRowLength;
sampleRow_color = (sample.black - this.settings.active.arDetect.edgeDetection.edgeTolerancePx) * this.conf.canvasImageDataRowLength;
// že ena kršitev črnega roba pomeni, da kandidat ni primeren
// even a single black edge violation means the candidate is not an edge
loopEnd = sampleRow_black + sampleEnd;
if(Debug.debugCanvas.enabled){
blackEdgeViolation = this._blackbarTest_dbg(image, sampleRow_black + sampleStart, loopEnd);
} else {
blackEdgeViolation = this._blackbarTest(image, sampleRow_black + sampleStart, loopEnd);
}
// če je bila črna črta skrunjena, preverimo naslednjega kandidata
// if we failed, we continue our search with the next candidate
if (blackEdgeViolation) {
continue;
}
detections = 0;
loopEnd = sampleRow_color + sampleEnd;
if(Debug.debugCanvas.enabled) {
this._imageTest_dbg(image, sampleRow_color + sampleStart, loopEnd, sample.black, edgeCandidatesBottom);
} else {
this._imageTest(image, sampleRow_color + sampleStart, loopEnd, sample.black, edgeCandidatesBottom);
if(Debug.debugCanvas.enabled) {
this._imageTest_dbg(image, sampleRow_color + sampleStart, loopEnd, sample.black, edgeCandidatesBottom);
} else {
this._imageTest(image, sampleRow_color + sampleStart, loopEnd, sample.black, edgeCandidatesBottom);
}
}
}
} catch (e) {
console.log("\n\nuwu fucky wucky:", e, "\n\n")
}
@ -623,7 +623,9 @@ class EdgeDetect{
if (reverseSearchDirection) {
increment = -this.conf.canvasImageDataRowLength;
arrayStart = bottom - this.conf.canvasImageDataRowLength;
// don't subtract this.conf.canvasImageDataRowLength — it has already been accounted for
// when we calculated bottom and top
arrayStart = bottom;
arrayEnd = top;
// this is a hack so we get pointer-like things rather than values

5
src/ext/lib/comms/CommsServer.js
View File

@ -220,10 +220,13 @@ class CommsServer {
this.server.injectCss(message.cssString, sender);
return;
}
if (message.cmd === 'remove-css') {
if (message.cmd === 'remove-css' || message.cmd === 'eject-css') {
this.server.removeCss(message.cssString, sender);
return;
}
if (message.cmd === 'replace-css') {
this.server.replaceCss(message.oldCssString, message.newCssString, sender);
}
if (message.forwardToContentScript) {
if (Debug.debug && Debug.comms) {

22
src/ext/lib/video-data/PageInfo.js
View File

@ -43,6 +43,28 @@ class PageInfo {
this.currentZoomScale = 1;
}
injectCss(cssString) {
this.comms.sendMessage({
cmd: 'inject-css',
cssString: cssString
});
}
ejectCss(cssString) {
this.comms.sendMessage({
cmd: 'eject-css',
cssString: cssString
});
}
replaceCss(oldCssString, newCssString) {
this.comms.sendMessage({
cmd: 'replace-css',
newCssString,
oldCssString
});
}
destroy() {
this.logger.log('info', ['debug', 'init'], "[PageInfo::destroy] destroying all videos!")
if(this.rescanTimer){

45
src/ext/lib/video-data/VideoData.js
View File

@ -14,6 +14,19 @@ class VideoData {
this.extensionMode = pageInfo.extensionMode;
this.logger = logger;
this.vdid = (Math.random()*100).toFixed();
this.userCssClassName = `uw-fuck-you-and-do-what-i-tell-you_${this.vdid}`;
// We'll replace cssWatcher (in resizer) with mutationObserver
const observerConf = {
attributes: true,
// attributeFilter: ['style', 'class'],
attributeOldValue: true,
};
this.observer = new MutationObserver(this.onVideoDimensionsChanged);
this.observer.observe(video, observerConf);
// POZOR: VRSTNI RED JE POMEMBEN (arDetect mora bit zadnji)
// NOTE: ORDERING OF OBJ INITIALIZATIONS IS IMPORTANT (arDetect needs to go last)
this.player = new PlayerData(this, logger);
@ -28,10 +41,38 @@ class VideoData {
this.resizer.reset();
this.vdid = (Math.random()*100).toFixed();
this.logger.log('info', 'init', "[VideoData::ctor] Created videoData with vdid", this.vdid,"\nextension mode:", this.extensionMode);
if (Debug.init) {
console.log("[VideoData::ctor] Created videoData with vdid", this.vdid,"\nextension mode:", this.extensionMode);
}
this.pageInfo.initMouseActionHandler(this);
this.video.classList.add(this.userCssClassName); // this also needs to be applied BEFORE we initialize resizer!
}
onVideoDimensionsChanged(mutationList, observer) {
for (let mutation of mutationList) {
if (mutation.type === 'attributes') {
console.log("video attributes were changed:", mutation)
if (mutation.attributeName === 'class') {
if (!this.video.classList.contains(this.userCssClassName)) {
console.log("class changed!")
// force the page to include our class in classlist, if the classlist has been removed
this.video.classList.add(this.userCssClassName);
// } else if () {
// this bug should really get
} else {
this.restoreAr();
}
} else if (mutation.attributeName === 'style' && mutation.attributeOldValue !== this.video.getAttribute('style')) {
console.log("style changed")
// if size of the video has changed, this may mean we need to recalculate/reapply
// last calculated aspect ratio
this.restoreAr();
}
}
}
}
firstTimeArdInit(){

209
src/ext/lib/video-transform/Resizer.js
View File

@ -26,8 +26,6 @@ class Resizer {
this.stretcher = new Stretcher(this.conf, logger);
this.zoom = new Zoom(this.conf, logger);
this.cssCheckDisabled = false;
// load up default values
this.correctedVideoDimensions = {};
this.currentCss = {};
@ -35,16 +33,6 @@ class Resizer {
this.currentPlayerStyleString = "";
this.currentCssValidFor = {};
// restore watchdog. While true, applyCss() tries to re-apply new css until this value becomes false again
// value becomes false when width and height of <video> tag match with what we want to set. Only necessary when
// calling _res_restore() for some weird reason.
this.restore_wd = false;
// CSS watcher will trigger _very_ often for this many iterations
this.cssWatcherIncreasedFrequencyCounter = 0;
// this.lastAr = this.settings.getDefaultAr(); // this is the aspect ratio we start with
this.lastAr = {type: AspectRatio.Initial};
this.videoAlignment = this.settings.getDefaultVideoAlignment(window.location.hostname); // this is initial video alignment
this.destroyed = false;
@ -52,27 +40,35 @@ class Resizer {
this.resizerId = (Math.random(99)*100).toFixed(0);
if (this.settings.active.pan) {
this.logger.log('info', 'debug', "can pan:", this.settings.active.miscSettings.mousePan.enabled, "(default:", this.settings.active.miscSettings.mousePan.enabled, ")")
// console.log("can pan:", this.settings.active.miscSettings.mousePan.enabled, "(default:", this.settings.active.miscSettings.mousePan.enabled, ")")
this.canPan = this.settings.active.miscSettings.mousePan.enabled;
} else {
this.canPan = false;
}
this.userCss = '';
this.userCssClassName = videoData.userCssClassName;
}
start(){
if(!this.destroyed) {
this.startCssWatcher();
}
injectCss(css) {
this.conf.pageInfo.injectCss(css);
}
ejectCss(css) {
this.conf.pageInfo.ejectCss(css);
}
replaceCss(oldCss, newCss) {
this.conf.pageInfo.replaceCss(oldCss, newCss);
}
stop(){
this.stopCssWatcher();
prepareCss(css) {
return `.${this.userCssClassName} {${css}}`;
}
destroy(){
this.logger.log('info', ['debug', 'init'], `[Resizer::destroy] <rid:${this.resizerId}> received destroy command.`);
this.destroyed = true;
this.stopCssWatcher();
}
calculateRatioForLegacyOptions(ar){
@ -197,14 +193,9 @@ class Resizer {
if (! this.video) {
// console.log("No video detected.")
this.videoData.destroy();
this.conf.destroy();
}
if (this.extensionMode === ExtensionMode.Enabled || PlayerData.isFullScreen()) {
this.startCssWatcher();
}
this.cssWatcherIncreasedFrequencyCounter = 20;
// // pause AR on basic stretch, unpause when using other mdoes
// fir sine reason unpause doesn't unpause. investigate that later
try {
@ -229,14 +220,11 @@ class Resizer {
this.conf.destroy();
}
if (stretchFactors.error === 'illegal_video_dimensions') {
this.logger.log('error', 'debug', "[Resizer::setAr] <rid:"+this.resizerId+"> Illegal video dimensions found. We will pause everything.");
// if we get illegal video dimensions, cssWatcher goes nuts. This is harmful,
// so we stop it until that sorts itself out
this.stopCssWatcher();
if(Debug.debug){
console.log("[Resizer::setAr] <rid:"+this.resizerId+"> Illegal video dimensions found. We will pause everything.");
}
}
return;
} else {
this.startCssWatcher();
}
if(this.stretcher.mode === Stretch.Conditional){
this.stretcher.applyConditionalStretch(stretchFactors, ar.ratio);
@ -322,66 +310,10 @@ class Resizer {
this.restore();
}
startCssWatcher(){
this.logger.log('info', 'cssWatcher', "[Resizer.js::startCssWatcher] starting css watcher. Is resizer destroyed?", this.destroyed);
if (this.destroyed) {
return;
}
this.cssCheckDisabled = false;
if(!this.cssWatcherTimer){
this.scheduleCssWatcher(1);
} else {
clearTimeout(this.cssWatcherTimer);
this.scheduleCssWatcher(1);
}
}
scheduleCssWatcher(timeout, force_reset) {
if (this.destroyed || (this.extensionMode !== ExtensionMode.Enabled && !PlayerData.isFullScreen())) {
return;
}
if(timeout === undefined) {
this.cssCheck(); // no timeout = one-off
return;
}
// one extra check to ensure we don't run css checks when we aren't supposed to
if (this.cssCheckDisabled) {
return;
}
if(this.cssWatcherTimeout) {
clearTimeout(this.cssWatcherTimer);
}
var ths = this;
this.cssWatcherTimer = setTimeout(function () {
ths.cssWatcherTimer = null;
try {
if (! ths.cssCheckDisabled) {
ths.cssCheck();
}
} catch (e) {
this.logger.log('error', 'debug', "[Resizer.js::scheduleCssWatcher] Css check failed. Error:", e);
}
}, timeout);
}
stopCssWatcher() {
this.logger.log('info', 'cssWatcher', `[Resizer.js] <${this.resizerId}> STOPPING CSS WATCHER!`)
this.cssCheckDisabled = true;
clearInterval(this.cssWatcherTimeout);
}
restore() {
this.logger.log('info', 'debug', "[Resizer::restore] <rid:"+this.resizerId+"> attempting to restore aspect ratio. this & settings:", {'a_lastAr': this.lastAr, 'this': this, "settings": this.settings} );
// this is true until we verify that css has actually been applied
this.restore_wd = true;
if(this.lastAr.type === AspectRatio.Initial){
this.setAr({type: AspectRatio.Reset});
}
@ -528,7 +460,7 @@ class Resizer {
for(var i in styleArray) {
if(styleArray[i]) {
styleString += styleArray[i] + "; ";
styleString += styleArray[i] + " !important; ";
}
}
@ -554,7 +486,6 @@ class Resizer {
// videoHeight: dimensions.height
}
const styleArrayString = this.video.getAttribute('style');
let extraStyleString;
try {
extraStyleString = this.settings.active.sites[window.location.host].DOM.video.additionalCss;
@ -562,105 +493,31 @@ class Resizer {
// do nothing. It's ok if no special settings are defined for this site, we'll just do defaults
}
const styleArray = this.buildStyleArray(styleArrayString, extraStyleString)
const styleArray = this.buildStyleArray('', extraStyleString)
// add remaining elements
if (stretchFactors) {
styleArray.push(`transform: translate(${translate.x}px, ${translate.y}px) scale(${stretchFactors.xFactor}, ${stretchFactors.yFactor})`);
styleArray.push("top: 0px; left: 0px; bottom: 0px; right: 0px");
styleArray.push("top: 0px !important; left: 0px !important; bottom: 0px !important; right: 0px");
}
const styleString = this.buildStyleString(styleArray);
const styleString = `${this.buildStyleString(styleArray)}${extraStyleString || ''}`; // string returned by buildStyleString() should end with ; anyway
// build style string back
this.setStyleString(styleString);
}
setStyleString (styleString) {
this.video.setAttribute("style", styleString);
this.currentStyleString = styleString;
this.currentCssValidFor = this.conf.player.dimensions;
if (this.restore_wd) {
if (!this.video){
this.logger.log('warn', 'debug', "[Resizer::_res_setStyleString] <rid:"+this.resizerId+"> Video element went missing, nothing to do here.")
return;
}
// if(
// styleString.indexOf("width: " + this.video.style.width) == -1 ||
// styleString.indexOf("height: " + this.video.style.height) == -1) {
// // css ni nastavljen?
// // css not set?
// if(Debug.debug)
// console.log("[Resizer::_res_setStyleString] Style string not set ???");
// if(count < settings.active.resizer.setStyleString.maxRetries){
// setTimeout( this.setStyleString, settings.active.resizer.setStyleString.retryTimeout, count + 1);
// }
// else if(Debug.debug){
// console.log("[Resizer::_res_setStyleString] we give up. css string won't be set");
// }
// }
// else{
this.restore_wd = false;
// }
}
else{
this.logger.log('info', 'resizer', "[Resizer::_res_setStyleString] <rid:"+this.resizerId+"> css applied. Style string:", styleString);
}
}
const newCssString = this.prepareCss(styleString);
cssCheck(){
if (this.cssCheckDisabled) {
// throw "fucking dont"
return;
}
// this means we haven't set our CSS yet, or that we changed video.
// if(! this.currentCss.tranform) {
// this.scheduleCssWatcher(200);
// return;
// }
// this means video went missing. videoData will be re-initialized when the next video is found
if (!this.video){
this.logger.log('info', 'cssWatcher', "[Resizer::cssCheck] <rid:"+this.resizerId+"> no video detecting, issuing destroy command");
this.conf.destroy();
return;
}
if(this.destroyed) {
this.logger.log('info', 'cssWatcher', "[Resizer::cssCheck] <rid:"+this.resizerId+"> destroyed flag is set, we shouldnt be running");
this.stopCssWatcher();
return;
}
let cssValid = true;
// first, a quick test:
cssValid &= this.currentVideoSettings.validFor.width === this.conf.player.dimensions.width;
if (cssValid) {
const styleString = this.video.getAttribute('style');
cssValid &= this.currentStyleString === styleString;
}
if (cssValid && this.currentPlayerStyleString) { // only check for changes to player element if we applied them before
const playerStyleString = this.player.element.getAttribute('style');
cssValid &= this.currentPlayerStyleString === playerStyleString;
}
if (!cssValid){
this.logger.log('info', 'cssWatcher', `%c[Resizer::cssCheck] <rid:${this.resizerId}> something touched our style string. We need to re-apply the style.`, {background: '#ddf', color: '#007'});
this.restore();
this.scheduleCssWatcher(10);
return;
}
if (this.cssWatcherIncreasedFrequencyCounter > 0) {
--this.cssWatcherIncreasedFrequencyCounter;
this.scheduleCssWatcher(20);
} else {
this.scheduleCssWatcher(1000);
// inject new CSS or replace existing one
if (!this.userCss) {
this.injectCss(newCssString);
this.userCss = newCssString;
} else if (newCssString !== this.userCss) {
// we only replace css if it
this.replaceCss(this.userCss, newCssString);
this.userCss = newCssString;
}
}
}

22
src/ext/uw-bg.js
View File

@ -58,7 +58,7 @@ class UWServer {
console.log("[uwbg::injectCss] Injecting CSS:", css, sender);
}
if (BrowserDetect.firefox || BrowserDetect.edge) {
await browser.tabs.insertCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
browser.tabs.insertCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
} else if (BrowserDetect.chrome) {
chrome.tabs.insertCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
}
@ -68,11 +68,21 @@ class UWServer {
}
}
}
removetCss(css, sender) {
if (BrowserDetect.firefox || BrowserDetect.edge) {
browser.tabs.removeCSS(sender.tab.idd, {code: css, cssOrigin: 'user', frameId: sender.frameId});
} else if (BrowserDetect.chrome) {
chrome.tabs.removeCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
async removeCss(css, sender) {
try {
if (BrowserDetect.firefox || BrowserDetect.edge) {
browser.tabs.removeCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
} else if (BrowserDetect.chrome) {
// this doesn't work currently, but hopefully chrome will get this feature in the future
chrome.tabs.removeCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
}
} catch (e) { }
}
async replaceCss(oldCss, newCss, sender) {
if (oldCss !== newCss) {
this.injectCss(newCss, sender);
this.removeCss(oldCss, sender);
}
}

2
src/manifest.json
View File

@ -2,7 +2,7 @@
"manifest_version": 2,
"name": "Ultrawidify",
"description": "Removes black bars on ultrawide videos and offers advanced options to fix aspect ratio.",
"version": "4.2.2",
"version": "4.2.3",
"applications": {
"gecko": {
"id": "{cf02b1a7-a01a-4e37-a609-516a283f1ed3}"

2
src/options/AutodetectionSettings.vue
View File

@ -517,7 +517,7 @@
<div class="flex flex-input">
<input type="checkbox"
v-model="settings.active.arDetect.guardLine.enabled"
/> Enable guardline</span>
/> Enable guardline
</div>
</div>
<div class="flex flex-row row-padding">

8
src/popup/panels/WhatsNewPanel.vue
View File

@ -16,8 +16,14 @@
</div>
</template>
<script>
export default {
import BrowserDetect from '../../ext/conf/BrowserDetect';
export default {
data () {
return {
BrowserDetect: BrowserDetect
}
}
}
</script>