Implement translation support for qualityName and qualityBadge

src/js/controls.js

@@ -664,27 +664,7 @@ const controls = {
 
         // Get the badge HTML for HD, 4K etc
         const getBadge = quality => {
-            let label = '';
-
-            switch (quality) {
-                case 2160:
-                    label = '4K';
-                    break;
-
-                case 1440:
-                case 1080:
-                case 720:
-                    label = 'HD';
-                    break;
-
-                case 576:
-                case 480:
-                    label = 'SD';
-                    break;
-
-                default:
-                    break;
-            }
+            const label = i18n.get(`qualityBadge.${quality}`, this.config);
 
             if (!label.length) {
                 return null;
@@ -708,7 +688,6 @@ const controls = {
     },
 
     // Translate a value into a nice label
-    // TODO: Localisation
     getLabel(setting, value) {
         switch (setting) {
             case 'speed':
@@ -716,9 +695,15 @@ const controls = {
 
             case 'quality':
                 if (utils.is.number(value)) {
+                    const qualityName = i18n.get(`qualityName.${value}`, this.config);
+
+                    if (!qualityName.length) {
                         return `${value}p`;
                     }
 
+                    return qualityName;
+                }
+
                 return utils.toTitleCase(value);
 
             case 'captions':

src/js/defaults.js

@@ -190,6 +190,14 @@ const defaults = {
         disabled: 'Disabled',
         enabled: 'Enabled',
         advertisement: 'Ad',
+        qualityBadge: {
+            2160: '4K',
+            1440: 'HD',
+            1080: 'HD',
+            720: 'HD',
+            576: 'SD',
+            480: 'SD',
+        },
     },
 
     // URLs