Twitching issue was fixed but performance is shite
This commit is contained in:
parent
3f8def5268
commit
68b3589e77
@ -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
|
||||
|
@ -220,7 +220,7 @@ 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;
|
||||
}
|
||||
|
@ -41,6 +41,20 @@ 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
|
||||
});
|
||||
}
|
||||
|
||||
destroy() {
|
||||
if(Debug.debug || Debug.init){
|
||||
console.log("[PageInfo::destroy] destroying all videos!")
|
||||
|
@ -13,6 +13,8 @@ class VideoData {
|
||||
this.pageInfo = pageInfo;
|
||||
this.extensionMode = pageInfo.extensionMode;
|
||||
|
||||
this.vdid = (Math.random()*100).toFixed();
|
||||
this.userCssClassName = `uw-fuck-you-and-do-what-i-tell-you_${this.vdid}`;
|
||||
|
||||
// POZOR: VRSTNI RED JE POMEMBEN (arDetect mora bit zadnji)
|
||||
// NOTE: ORDERING OF OBJ INITIALIZATIONS IS IMPORTANT (arDetect needs to go last)
|
||||
@ -30,12 +32,13 @@ class VideoData {
|
||||
this.resizer.reset();
|
||||
|
||||
|
||||
this.vdid = (Math.random()*100).toFixed();
|
||||
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);
|
||||
}
|
||||
|
||||
firstTimeArdInit(){
|
||||
|
@ -55,6 +55,9 @@ class Resizer {
|
||||
} else {
|
||||
this.canPan = false;
|
||||
}
|
||||
|
||||
this.userCss = '';
|
||||
this.userCssClassName = videoData.userCssClassName;
|
||||
}
|
||||
|
||||
start(){
|
||||
@ -67,6 +70,18 @@ class Resizer {
|
||||
this.stopCssWatcher();
|
||||
}
|
||||
|
||||
injectCss(css) {
|
||||
this.conf.pageInfo.injectCss(css);
|
||||
}
|
||||
|
||||
ejectCss(css) {
|
||||
this.conf.pageInfo.ejectCss(css);
|
||||
}
|
||||
|
||||
prepareCss(css) {
|
||||
return `.${this.userCssClassName} {${css}}`;
|
||||
}
|
||||
|
||||
destroy(){
|
||||
if(Debug.debug || Debug.init){
|
||||
console.log(`[Resizer::destroy] <rid:${this.resizerId}> received destroy command.`);
|
||||
@ -211,7 +226,7 @@ class Resizer {
|
||||
|
||||
if (! this.video) {
|
||||
// console.log("No video detected.")
|
||||
this.videoData.destroy();
|
||||
this.conf.destroy();
|
||||
}
|
||||
|
||||
if (this.extensionMode === ExtensionMode.Enabled || PlayerData.isFullScreen()) {
|
||||
@ -572,7 +587,7 @@ class Resizer {
|
||||
|
||||
for(var i in styleArray) {
|
||||
if(styleArray[i]) {
|
||||
styleString += styleArray[i] + "; ";
|
||||
styleString += styleArray[i] + " !important; ";
|
||||
}
|
||||
}
|
||||
|
||||
@ -593,7 +608,7 @@ class Resizer {
|
||||
}
|
||||
|
||||
if (Debug.debug && Debug.resizer) {
|
||||
console.log("[Resizer::applyCss] <rid:"+this.resizerId+"> will apply css.", {stretchFactors, translate});
|
||||
console.log("[Resizer::applyCss] <rid:"+this.resizerId+"> will apply css.", {stretchFactors, translate, video: this.video});
|
||||
}
|
||||
|
||||
// save stuff for quick tests (before we turn numbers into css values):
|
||||
@ -603,7 +618,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;
|
||||
@ -611,51 +625,42 @@ 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.video.setAttribute("style", styleString);
|
||||
|
||||
// remove old CSS
|
||||
if (this.userCss) {
|
||||
this.ejectCss(this.userCss);
|
||||
}
|
||||
|
||||
// this.currentStyleString = styleString;
|
||||
this.currentCssValidFor = this.conf.player.dimensions;
|
||||
|
||||
this.userCss = this.prepareCss(styleString);
|
||||
|
||||
// inject new CSS
|
||||
this.injectCss(this.userCss);
|
||||
this.video.classList.add(this.userCssClassName);
|
||||
|
||||
if (this.restore_wd) {
|
||||
if (!this.video){
|
||||
if(Debug.debug)
|
||||
console.log("[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;
|
||||
// }
|
||||
this.restore_wd = false;
|
||||
}
|
||||
else{
|
||||
if(Debug.debug)
|
||||
@ -697,8 +702,7 @@ class Resizer {
|
||||
cssValid &= this.currentVideoSettings.validFor.width === this.conf.player.dimensions.width;
|
||||
|
||||
if (cssValid) {
|
||||
const styleString = this.video.getAttribute('style');
|
||||
cssValid &= this.currentStyleString === styleString;
|
||||
cssValid &= this.video.classList.contains(this.userCssClassName);
|
||||
}
|
||||
if (cssValid && this.currentPlayerStyleString) { // only check for changes to player element if we applied them before
|
||||
const playerStyleString = this.player.element.getAttribute('style');
|
||||
|
@ -70,7 +70,7 @@ class UWServer {
|
||||
}
|
||||
removetCss(css, sender) {
|
||||
if (BrowserDetect.firefox || BrowserDetect.edge) {
|
||||
browser.tabs.removeCSS(sender.tab.idd, {code: css, cssOrigin: 'user', frameId: sender.frameId});
|
||||
browser.tabs.removeCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
|
||||
} else if (BrowserDetect.chrome) {
|
||||
chrome.tabs.removeCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
|
||||
}
|
||||
|
@ -2,17 +2,11 @@
|
||||
<div>
|
||||
<h2>What's new</h2>
|
||||
<p>Full changelog for older versions <a href="https://github.com/xternal7/ultrawidify/blob/master/CHANGELOG.md">is available here</a>.</p>
|
||||
<p class="label">4.2.2</p>
|
||||
<p class="label">4.2.3</p>
|
||||
<ul>
|
||||
<li>Fixed alignment issues for reddit on videos from v.reddit</li>
|
||||
<li>Some people reported issues with inconsistent video alignment on youtube. While I've not been able to make that bug happen to me,
|
||||
(which means I haven't been able to fix it either), reports describe behaviour similar to what was going on with Iridium. Examining
|
||||
the Iridium issue revealed an issue that could be potentially blamed for this behaviour. That issue was fixed. Since I've never been able to make this problem
|
||||
happen to me, I'm not being able to verify whether that issue is gone. <b>If you're still experiencing issues with inconsistent video alignment,
|
||||
please contact me via github, reddit or email.</b> See 'Report a problem' tab for more details.</li>
|
||||
<li>Fixed twitchy behaviour on Twitch, Facebook and Twatter.</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<p>As you can tell, I don't leave reddit and youtube much. To be fair, the twitching issue was intermittent on twitch.</p>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
Loading…
Reference in New Issue
Block a user