From 227164119739b717be30cd500a4a6ab1070665fc Mon Sep 17 00:00:00 2001
From: Eli Barzilay <eli@barzilay.org>
Date: Sun, 23 Jul 2023 15:53:42 -0400
Subject: [PATCH] Add an `aspectratio` attribute

Makes it possible to handle non-16/9 videos, and fixes #92.
---
 lite-youtube.ts | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/lite-youtube.ts b/lite-youtube.ts
index 06f75c0..6e78341 100644
--- a/lite-youtube.ts
+++ b/lite-youtube.ts
@@ -59,6 +59,14 @@ export class LiteYTEmbed extends HTMLElement {
     this.setAttribute('playlistid', id);
   }
 
+  get aspectRatio(): string {
+    return this.getAttribute('aspectratio') ?? '';
+  }
+
+  set aspectRatio(title: string) {
+    this.setAttribute('aspectratio', title);
+  }
+
   get videoTitle(): string {
     return this.getAttribute('videotitle') || 'Video';
   }
@@ -122,12 +130,12 @@ export class LiteYTEmbed extends HTMLElement {
           display: block;
           position: relative;
           width: 100%;
-          padding-bottom: calc(100% / (16 / 9));
+          padding-bottom: calc(100% / (${this.aspectRatio || '16 / 9'}));
         }
 
         @media (max-width: 40em) {
           :host([short]) {
-            padding-bottom: calc(100% / (9 / 16));
+            padding-bottom: calc(100% / (${this.aspectRatio || '9 / 16'}));
           }
         }