- // Filter videos we can play according to our screen resolution and bandwidth
- const filteredFiles = this.videoFiles.filter(f => f.resolution.id <= this.playerElement.width)
- .filter(f => {
- const fileBitrate = (f.size / this.videoDuration)
- let threshold = fileBitrate
-
- // If this is for a higher resolution or an initial load: add a margin
- if (!this.currentVideoFile || f.resolution.id > this.currentVideoFile.resolution.id) {
- threshold += ((fileBitrate * this.CONSTANTS.AUTO_QUALITY_THRESHOLD_PERCENT) / 100)
+ // Limit resolution according to player height
+ const playerHeight = this.playerElement.offsetHeight as number
+
+ // We take the first resolution just above the player height
+ // Example: player height is 530px, we want the 720p file instead of 480p
+ let maxResolution = this.videoFiles[0].resolution.id
+ for (let i = this.videoFiles.length - 1; i >= 0; i--) {
+ const resolutionId = this.videoFiles[i].resolution.id
+ if (resolutionId >= playerHeight) {
+ maxResolution = resolutionId
+ break