aspect ratio is a getter now. Use said getter
This commit is contained in:
parent
d406438527
commit
cb548c3a3d
@ -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;
|
||||||
|
@ -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;
|
||||||
|
@ -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;
|
||||||
|
|
||||||
|
@ -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;
|
||||||
|
Loading…
Reference in New Issue
Block a user