Merge pull request #4727 from MBR-0001/subtitle-improvements-1

Add support for more remote subtitle info

src/components/subtitleeditor/subtitleeditor.js

@@ -194,7 +194,8 @@ function renderSearchResults(context, results) {
 
         html += '<span class="listItemIcon material-icons closed_caption" aria-hidden="true"></span>';
 
-        const bodyClass = result.Comment || result.IsHashMatch ? 'three-line' : 'two-line';
+        const hasAnyFlags = result.IsHashMatch || result.AiTranslated || result.MachineTranslated || result.Forced || result.HearingImpaired;
+        const bodyClass = result.Comment || hasAnyFlags ? 'three-line' : 'two-line';
 
         html += '<div class="listItemBody ' + bodyClass + '">';
 
@@ -206,16 +207,45 @@ function renderSearchResults(context, results) {
         }
 
         if (result.DownloadCount != null) {
-            html += '<span>' + globalize.translate('DownloadsValue', result.DownloadCount) + '</span>';
+            html += '<span style="margin-right:1em;">' + globalize.translate('DownloadsValue', result.DownloadCount) + '</span>';
         }
+
+        if (result.FrameRate) {
+            html += '<span>' + globalize.translate('Framerate') + ': ' + result.FrameRate + '</span>';
+        }
+
         html += '</div>';
 
         if (result.Comment) {
-            html += '<div class="secondary listItemBodyText">' + escapeHtml(result.Comment) + '</div>';
+            html += '<div class="secondary listItemBodyText" style="white-space:pre-line;">' + escapeHtml(result.Comment) + '</div>';
         }
 
-        if (result.IsHashMatch) {
+        if (hasAnyFlags) {
-            html += '<div class="secondary listItemBodyText"><div class="inline-flex align-items-center justify-content-center" style="background:#3388cc;color:#fff;padding: .3em 1em;border-radius:1000em;">' + globalize.translate('PerfectMatch') + '</div></div>';
+            html += '<div class="secondary listItemBodyText">';
+
+            const spanOpen = '<span class="inline-flex align-items-center justify-content-center subtitleFeaturePillow">';
+
+            if (result.IsHashMatch) {
+                html += spanOpen + globalize.translate('PerfectMatch') + '</span>';
+            }
+
+            if (result.AiTranslated) {
+                html += spanOpen + globalize.translate('AiTranslated') + '</span>';
+            }
+
+            if (result.MachineTranslated) {
+                html += spanOpen + globalize.translate('MachineTranslated') + '</span>';
+            }
+
+            if (result.Forced) {
+                html += spanOpen + globalize.translate('ForeignPartsOnly') + '</span>';
+            }
+
+            if (result.HearingImpaired) {
+                html += spanOpen + globalize.translate('HearingImpairedShort') + '</span>';
+            }
+
+            html += '</div>';
         }
 
         html += '</div>';

src/components/subtitleeditor/subtitleeditor.scss

@@ -1,3 +1,11 @@
 .originalSubtitleFileLabel {
     margin-right: 1em;
 }
+
+.subtitleFeaturePillow {
+    background: #00a4dc;
+    color: #000;
+    padding: 0.3em 1em;
+    border-radius: 1000em;
+    margin-right: 0.25em;
+}

src/strings/en-us.json

@@ -1718,5 +1718,9 @@
     "LabelTonemappingMode": "Tone mapping mode",
     "TonemappingModeHelp": "Select the tone mapping mode. If you experience blown out highlights try switching to the RGB mode.",
     "Unknown": "Unknown",
-    "AllowAv1Encoding": "Allow encoding in AV1 format"
+    "AllowAv1Encoding": "Allow encoding in AV1 format",
+    "AiTranslated": "AI Translated",
+    "MachineTranslated": "Machine Translated",
+    "ForeignPartsOnly": "Forced/Foreign parts only",
+    "HearingImpairedShort": "HI/SDH"
 }