aspect ratio is a getter now. Use said getter

This commit is contained in:
Tamius Han 2021-04-10 04:08:09 +02:00
parent d406438527
commit cb548c3a3d
4 changed files with 31 additions and 19 deletions

View File

@ -68,6 +68,17 @@ class PlayerData {
private observer: ResizeObserver; private observer: ResizeObserver;
//#endregion //#endregion
/**
* Gets player aspect ratio. If in full screen, it returns screen aspect ratio unless settings say otherwise.
*/
get aspectRatio() {
if (this.dimensions.fullscreen && !this.settings.getSettingsForSite()?.usePlayerArInFullscreen) {
return window.innerWidth / window.innerHeight;
}
return this.dimensions.width / this.dimensions.height;
}
constructor(videoData) { constructor(videoData) {
try { try {
this.logger = videoData.logger; this.logger = videoData.logger;

View File

@ -48,6 +48,10 @@ class VideoData {
//#endregion //#endregion
get aspectRatio() {
return this.video.videoWidth / this.video.videoHeight;
}
constructor(video, settings, pageInfo){ constructor(video, settings, pageInfo){
this.vdid = (Math.random()*100).toFixed(); this.vdid = (Math.random()*100).toFixed();
this.logger = pageInfo.logger; this.logger = pageInfo.logger;

View File

@ -118,8 +118,8 @@ class Scaler {
* * because video width is normalized on 100% of the parent, we don't need to correct * * because video width is normalized on 100% of the parent, we don't need to correct
* anything when the player is wider than the video. * anything when the player is wider than the video.
*/ */
const streamAr = this.conf.video.videoWidth / this.conf.video.videoHeight; const streamAr = this.conf.aspectRatio;
const playerAr = this.conf.player.dimensions.width / this.conf.player.dimensions.height; const playerAr = this.conf.player.aspectRatio;
const heightCompensationFactor = this.conf.getHeightCompensationFactor(); const heightCompensationFactor = this.conf.getHeightCompensationFactor();
const compensatedStreamAr = streamAr * heightCompensationFactor; const compensatedStreamAr = streamAr * heightCompensationFactor;

View File

@ -47,8 +47,8 @@ class Stretcher {
} }
applyConditionalStretch(stretchFactors, actualAr){ applyConditionalStretch(stretchFactors, actualAr){
let playerAr = this.conf.player.dimensions.width / this.conf.player.dimensions.height; let playerAr = this.conf.player.aspectRatio;
let videoAr = this.conf.video.videoWidth / this.conf.video.videoHeight; let videoAr = this.conf.aspectRatio;
if (! actualAr){ if (! actualAr){
actualAr = playerAr; actualAr = playerAr;
@ -102,25 +102,25 @@ class Stretcher {
// This means we want to calculate stretching using those values, but we don't know // This means we want to calculate stretching using those values, but we don't know
// them. This means we have to calculate them. // them. This means we have to calculate them.
const videoAr = this.conf.video.videoWidth / this.conf.video.videoHeight; const streamAr = this.conf.aspectRatio;
if (this.conf.player.dimensions.width > this.conf.player.dimensions.height * videoAr) { if (this.conf.player.dimensions.width > this.conf.player.dimensions.height * streamAr) {
return { return {
xFactor: this.conf.player.dimensions.width / (this.conf.player.dimensions.height * videoAr), xFactor: this.conf.player.dimensions.width / (this.conf.player.dimensions.height * streamAr),
yFactor: 1 yFactor: 1
}; };
} }
return { return {
xFactor: 1, xFactor: 1,
yFactor: this.conf.player.dimensions.height / (this.conf.player.dimensions.width / videoAr) yFactor: this.conf.player.dimensions.height / (this.conf.player.dimensions.width / streamAr)
}; };
} }
applyStretchFixedSource(postCropStretchFactors) { applyStretchFixedSource(postCropStretchFactors) {
const videoAr = this.conf.video.videoWidth / this.conf.video.videoHeight; const streamAr = this.conf.aspectRatio;
const playerAr = this.conf.player.dimensions.width / this.conf.player.dimensions.height; const playerAr = this.conf.player.aspectRatio;
const squeezeFactor = this.fixedStretchRatio / videoAr; const squeezeFactor = this.fixedStretchRatio / streamAr;
// Whether squeezing happens on X or Y axis depends on whether required AR is wider or narrower than // Whether squeezing happens on X or Y axis depends on whether required AR is wider or narrower than
// the player, in which the video is displayed // the player, in which the video is displayed
@ -130,7 +130,7 @@ class Stretcher {
this.logger.log('info', 'stretcher', `[Stretcher::applyStretchFixedSource] here's what we got: this.logger.log('info', 'stretcher', `[Stretcher::applyStretchFixedSource] here's what we got:
postCropStretchFactors: x=${postCropStretchFactors.xFactor} y=${postCropStretchFactors.yFactor} postCropStretchFactors: x=${postCropStretchFactors.xFactor} y=${postCropStretchFactors.yFactor}
fixedStretchRatio: ${this.fixedStretchRatio} fixedStretchRatio: ${this.fixedStretchRatio}
videoAr: ${videoAr} videoAr: ${streamAr}
playerAr: ${playerAr} playerAr: ${playerAr}
squeezeFactor: ${squeezeFactor}`, '\nvideo', this.conf.video); squeezeFactor: ${squeezeFactor}`, '\nvideo', this.conf.video);
@ -151,9 +151,6 @@ squeezeFactor: ${squeezeFactor}`, '\nvideo', this.conf.video);
} }
getArCorrectionFactor() { getArCorrectionFactor() {
const streamAr = this.conf.video.videoWidth / this.conf.video.videoHeight;
const playerAr = this.conf.player.dimensions.width / this.conf.player.dimensions.height;
let arCorrectionFactor = 1; let arCorrectionFactor = 1;
arCorrectionFactor = this.conf.player.dimensions.width / this.conf.video.offsetWidth; arCorrectionFactor = this.conf.player.dimensions.width / this.conf.video.offsetWidth;
@ -161,8 +158,8 @@ squeezeFactor: ${squeezeFactor}`, '\nvideo', this.conf.video);
} }
calculateStretch(actualAr, playerArOverride?) { calculateStretch(actualAr, playerArOverride?) {
const playerAr = playerArOverride || this.conf.player.dimensions.width / this.conf.player.dimensions.height; const playerAr = playerArOverride || this.conf.player.aspectRatio;
const streamAr = this.conf.video.videoWidth / this.conf.video.videoHeight; const streamAr = this.conf.aspectRatio;
if (! actualAr){ if (! actualAr){
actualAr = playerAr; actualAr = playerAr;
@ -276,8 +273,8 @@ squeezeFactor: ${squeezeFactor}`, '\nvideo', this.conf.video);
&& (this.conf.player?.dimensions?.fullscreen || ! this.settings?.active?.mitigations?.zoomLimit?.fullscreenOnly) && (this.conf.player?.dimensions?.fullscreen || ! this.settings?.active?.mitigations?.zoomLimit?.fullscreenOnly)
&& this.settings?.active?.mitigations?.zoomLimit?.enabled && this.settings?.active?.mitigations?.zoomLimit?.enabled
) { ) {
const playerAr = this.conf.player.dimensions.width / this.conf.player.dimensions.height; const playerAr = this.conf.player.aspectRatio;
const streamAr = this.conf.video.videoWidth / this.conf.video.videoHeight; const streamAr = this.conf.aspectRatio;
let maxSafeAr: number; let maxSafeAr: number;
let arLimitFactor = this.settings?.active?.mitigations?.zoomLimit?.limit ?? 0.997; let arLimitFactor = this.settings?.active?.mitigations?.zoomLimit?.limit ?? 0.997;