Recently I’ve watched the Chernobyl miniseries on HBO GO. It had this somewhat unusual ratio of 2:1 and the site tried to squeeze it into 16:9 portion of the screen. As with 21:9, this resulted in windowboxing and a video smaller then it should be. Unfortunately my previous script could not fix it, but with a few tweaks it was easy enough to make a new one. Obviously, before I could enjoy the series, I ** had** to write a new script.

The black rectangle represents a 21:9 screen, the red rectangle is the 16:9 area used by HBO GO and finally the blue rectangle is the area where a 2:1 video gets displayed. This means that if I want to use more of the screen for 2:1 video, I need to compensate for the difference between 2:1 video and the 16:9 area that HBO GO intends to use. So the question is, how much do I need to upscale the video.

**(16/9) * x = 2/1**

**(16/9) * x = 2** | / (16/9)

**x = 2 * (9/16)**

**x = 18/16**

**x = 112.5%**

As before, I also need to offset the video to get rid of the upper black bar.

Let **H** be the height of the screen, **h** the height of 2:1 video squeezed into 16:9 area and **b** the height of a single black bar.

We know that to make the image fit the screen height, we need to multiply it by 18/16. So we are trying to inverse the downscaling operation that was already done to the video. This means that that the two heights are related by an inverse ratio.

**h = (16/18) * H**

The difference between those two heights is the area occupied by the black bars and since there are two of those, the height of a single black bar is half of this number.

**b = (H – h) / 2**

**b = (H – (16/18) * H) / 2**

**b = H * (1 – (16/18)) * (1/2)**

**b = H * ((18/18) – (16/18)) * (1/2)**

**b = H * (2/18) * (1/2)**

**b = H * (1/9) * (1/2)**

**b = (1/18) * H** | / H

**b / H = 5.(5)%**

This means we need to offset the image vertically by roughly **5.55%**.

After changing the numbers in my old script, the new one looks like this:

`javascript: (function(){ var video = document.body.querySelector('.video-js .vjs-tech'); if (video.getAttribute("style") == null) { video.setAttribute("style", "height: 112.5% !important; transform: translateY(-5.55%) !important;"); } else { video.removeAttribute("style"); } })();`

As with the previous script, I recommend adding it to your browser as a bookmarklet. Just create a new bookmark, paste the code into the url/address field and click on it whenever you want to watch a 2:1 video on HBO GO and you have a screen that has ratio wider than 16:9 (in my case 21:9).