Merge pull request #1487 from nyanmisaka/tonemap-ui

Tonemapping function dashboard options

src/components/itemMediaInfo/itemMediaInfo.js

@@ -120,6 +120,18 @@ import 'flexStyles';
             if (stream.BitDepth) {
                 attributes.push(createAttribute(globalize.translate('MediaInfoBitDepth'), `${stream.BitDepth} bit`));
             }
+            if (stream.VideoRange) {
+                attributes.push(createAttribute(globalize.translate('MediaInfoVideoRange'), stream.VideoRange));
+            }
+            if (stream.ColorSpace) {
+                attributes.push(createAttribute(globalize.translate('MediaInfoColorSpace'), stream.ColorSpace));
+            }
+            if (stream.ColorTransfer) {
+                attributes.push(createAttribute(globalize.translate('MediaInfoColorTransfer'), stream.ColorTransfer));
+            }
+            if (stream.ColorPrimaries) {
+                attributes.push(createAttribute(globalize.translate('MediaInfoColorPrimaries'), stream.ColorPrimaries));
+            }
             if (stream.PixelFormat) {
                 attributes.push(createAttribute(globalize.translate('MediaInfoPixelFormat'), stream.PixelFormat));
             }

src/components/playerstats/playerstats.js

@@ -263,6 +263,34 @@ import 'css!./playerstats';
             });
         }
 
+        if (videoStream.VideoRange) {
+            sessionStats.push({
+                label: globalize.translate('LabelVideoRange'),
+                value: videoStream.VideoRange
+            });
+        }
+
+        if (videoStream.ColorSpace) {
+            sessionStats.push({
+                label: globalize.translate('LabelColorSpace'),
+                value: videoStream.ColorSpace
+            });
+        }
+
+        if (videoStream.ColorTransfer) {
+            sessionStats.push({
+                label: globalize.translate('LabelColorTransfer'),
+                value: videoStream.ColorTransfer
+            });
+        }
+
+        if (videoStream.ColorPrimaries) {
+            sessionStats.push({
+                label: globalize.translate('LabelColorPrimaries'),
+                value: videoStream.ColorPrimaries
+            });
+        }
+
         const audioInfos = [];
 
         if (audioCodec) {

src/controllers/dashboard/encodingsettings.html

@@ -31,6 +31,11 @@
                     <div class="fieldDescription">${LabelVaapiDeviceHelp}</div>
                 </div>
 
+                <div class="inputContainer hide fldOpenclDevice">
+                    <input is="emby-input" type="text" id="txtOpenclDevice" label="${LabelOpenclDevice}" />
+                    <div class="fieldDescription">${LabelOpenclDeviceHelp}</div>
+                </div>
+
                 <div class="hardwareAccelerationOptions hide">
                     <div class="checkboxListContainer decodingCodecsList">
                         <h3 class="checkboxListLabel">${LabelEnableHardwareDecodingFor}</h3>
@@ -89,6 +94,54 @@
                     </div>
                 </div>
 
+                <div class="tonemappingOptions hide">
+                    <div class="checkboxListContainer checkboxContainer-withDescription">
+                        <label>
+                            <input type="checkbox" is="emby-checkbox" id="chkTonemapping" />
+                            <span>${EnableTonemapping}</span>
+                        </label>
+                        <div class="fieldDescription checkboxFieldDescription">${AllowTonemappingHelp}</div>
+                    </div>
+                    <div class="selectContainer">
+                        <select is="emby-select" id="selectTonemappingAlgorithm" label="${LabelTonemappingAlgorithm}">
+                            <option value="none">None</option>
+                            <option value="clip">Clip</option>
+                            <option value="linear">Linear</option>
+                            <option value="gamma">Gamma</option>
+                            <option value="reinhard">Reinhard</option>
+                            <option value="hable">Hable</option>
+                            <option value="mobius">Mobius</option>
+                        </select>
+                        <div class="fieldDescription">
+                            <a is="emby-linkbutton" rel="noopener noreferrer" class="button-link" href="http://ffmpeg.org/ffmpeg-all.html#tonemap_005fopencl" target="_blank">${TonemappingAlgorithmHelp}</a>
+                        </div>
+                    </div>
+                    <div class="selectContainer">
+                        <select is="emby-select" id="selectTonemappingRange" label="${LabelTonemappingRange}">
+                            <option value="auto">${Auto}</option>
+                            <option value="tv">TV</option>
+                            <option value="pc">PC</option>
+                        </select>
+                        <div class="fieldDescription">${TonemappingRangeHelp}</div>
+                    </div>
+                    <div class="inputContainer">
+                        <input is="emby-input" type="number" id="txtTonemappingDesat" pattern="[0-9]*" min="0" max="1.79769e+308" step=".00001" label="${LabelTonemappingDesat}" />
+                        <div class="fieldDescription">${LabelTonemappingDesatHelp}</div>
+                    </div>
+                    <div class="inputContainer">
+                        <input is="emby-input" type="number" id="txtTonemappingThreshold" pattern="[0-9]*" min="0" max="1.79769e+308" step=".00001" label="${LabelTonemappingThreshold}" />
+                        <div class="fieldDescription">${LabelTonemappingThresholdHelp}</div>
+                    </div>
+                    <div class="inputContainer">
+                        <input is="emby-input" type="number" id="txtTonemappingPeak" pattern="[0-9]*" min="0" max="1.79769e+308" step=".00001" label="${LabelTonemappingPeak}" />
+                        <div class="fieldDescription">${LabelTonemappingPeakHelp}</div>
+                    </div>
+                    <div class="inputContainer">
+                        <input is="emby-input" type="number" id="txtTonemappingParam" pattern="[0-9]*" min="2.22507e-308" max="1.79769e+308" step=".00001" label="${LabelTonemappingParam}" />
+                        <div class="fieldDescription">${LabelTonemappingParamHelp}</div>
+                    </div>
+                </div>
+
                 <div class="selectContainer">
                     <select is="emby-select" id="selectThreadCount" label="${LabelTranscodingThreadCount}">
                         <option value="-1">${Auto}</option>

src/controllers/dashboard/encodingsettings.js

@@ -19,6 +19,14 @@ import libraryMenu from 'libraryMenu';
         page.querySelector('.txtEncoderPath').value = config.EncoderAppPathDisplay || '';
         $('#txtTranscodingTempPath', page).val(systemInfo.TranscodingTempPath || '');
         $('#txtVaapiDevice', page).val(config.VaapiDevice || '');
+        page.querySelector('#chkTonemapping').checked = config.EnableTonemapping;
+        page.querySelector('#txtOpenclDevice').value = config.OpenclDevice || '';
+        page.querySelector('#selectTonemappingAlgorithm').value = config.TonemappingAlgorithm;
+        page.querySelector('#selectTonemappingRange').value = config.TonemappingRange;
+        page.querySelector('#txtTonemappingDesat').value = config.TonemappingDesat;
+        page.querySelector('#txtTonemappingThreshold').value = config.TonemappingThreshold;
+        page.querySelector('#txtTonemappingPeak').value = config.TonemappingPeak;
+        page.querySelector('#txtTonemappingParam').value = config.TonemappingParam || '';
         page.querySelector('#selectEncoderPreset').value = config.EncoderPreset || '';
         page.querySelector('#txtH264Crf').value = config.H264Crf || '';
         page.querySelector('#selectDeinterlaceMethod').value = config.DeinterlaceMethod || '';
@@ -66,6 +74,14 @@ import libraryMenu from 'libraryMenu';
                 config.EncodingThreadCount = $('#selectThreadCount', form).val();
                 config.HardwareAccelerationType = $('#selectVideoDecoder', form).val();
                 config.VaapiDevice = $('#txtVaapiDevice', form).val();
+                config.OpenclDevice = form.querySelector('#txtOpenclDevice').value;
+                config.EnableTonemapping = form.querySelector('#chkTonemapping').checked;
+                config.TonemappingAlgorithm = form.querySelector('#selectTonemappingAlgorithm').value;
+                config.TonemappingRange = form.querySelector('#selectTonemappingRange').value;
+                config.TonemappingDesat = form.querySelector('#txtTonemappingDesat').value;
+                config.TonemappingThreshold = form.querySelector('#txtTonemappingThreshold').value;
+                config.TonemappingPeak = form.querySelector('#txtTonemappingPeak').value;
+                config.TonemappingParam = form.querySelector('#txtTonemappingParam').value || '0';
                 config.EncoderPreset = form.querySelector('#selectEncoderPreset').value;
                 config.H264Crf = parseInt(form.querySelector('#txtH264Crf').value || '0');
                 config.DeinterlaceMethod = form.querySelector('#selectDeinterlaceMethod').value;
@@ -149,6 +165,16 @@ import libraryMenu from 'libraryMenu';
                 page.querySelector('#txtVaapiDevice').removeAttribute('required');
             }
 
+            if (this.value == 'nvenc') {
+                page.querySelector('.fldOpenclDevice').classList.remove('hide');
+                page.querySelector('#txtOpenclDevice').setAttribute('required', 'required');
+                page.querySelector('.tonemappingOptions').classList.remove('hide');
+            } else {
+                page.querySelector('.fldOpenclDevice').classList.add('hide');
+                page.querySelector('#txtOpenclDevice').removeAttribute('required');
+                page.querySelector('.tonemappingOptions').classList.add('hide');
+            }
+
             if (this.value) {
                 page.querySelector('.hardwareAccelerationOptions').classList.remove('hide');
             } else {

src/strings/en-us.json

@@ -1369,6 +1369,30 @@
     "ButtonSyncPlay": "SyncPlay",
     "ButtonCast": "Cast",
     "ButtonPlayer": "Player",
+    "MediaInfoVideoRange": "Video range",
+    "MediaInfoColorSpace": "Color space",
+    "MediaInfoColorTransfer": "Color transfer",
+    "MediaInfoColorPrimaries": "Color primaries",
+    "LabelVideoRange": "Video range:",
+    "LabelColorSpace": "Color space:",
+    "LabelColorTransfer": "Color transfer:",
+    "LabelColorPrimaries": "Color primaries:",
+    "LabelOpenclDevice": "OpenCL Device:",
+    "LabelOpenclDeviceHelp": "This is the OpenCL device that is used for tonemapping. The left side of the dot is the platform number, and the right side is the device number on the platform. The default value is 0.0. The ffmpeg application file containing the OpenCL hardware acceleration method is required.",
+    "EnableTonemapping": "Enable Tone mapping",
+    "AllowTonemappingHelp": "Tone mapping can transform the dynamic range of a video from HDR to SDR while maintaining image details and colors, which are very important information for representing the original scene. Currently works only when using NVENC HEVC decoder and transcoding HDR10 or HLG videos.",
+    "LabelTonemappingAlgorithm": "Select the Tone mapping algorithm to use:",
+    "TonemappingAlgorithmHelp": "Tone mapping can be fine-tuned. If you are not familiar with these options, just keep the default.<br>The recommended value is Reinhard.",
+    "LabelTonemappingRange": "Tonemapping range:",
+    "TonemappingRangeHelp": "Select the output color range. Auto is the same as the input range.",
+    "LabelTonemappingDesat": "Tonemapping desat:",
+    "LabelTonemappingDesatHelp": "Apply desaturation for highlights that exceed this level of brightness. The higher the parameter, the more color information will be preserved. This setting helps prevent unnaturally blown-out colors for super-highlights, by (smoothly) turning into white instead. This makes images feel more natural, at the cost of reducing information about out-of-range colors. The recommended and default values are 0 and 0.5.",
+    "LabelTonemappingThreshold": "Tonemapping threshold:",
+    "LabelTonemappingThresholdHelp": "The tonemapping algorithm parameters is fine-tuned per each scene. And a threshold is used to detect whether the scene has changed or not. If the distance between the current frame average brightness and the current running average exceeds a threshold value, we would re-calculate scene average and peak brightness. The recommended and default values are 0.8 and 0.2.",
+    "LabelTonemappingPeak": "Tonemapping peak:",
+    "LabelTonemappingPeakHelp": "Override signal/nominal/reference peak with this value. Useful when the embedded peak information in display metadata is not reliable or when tone mapping from a lower range to a higher range. The recommended and default values are 0.",
+    "LabelTonemappingParam": "Tonemapping param:",
+    "LabelTonemappingParamHelp": "Tune the tone mapping algorithm. The recommended and default values are NaN. Generally leave it blank.",
     "StopPlayback": "Stop playback",
     "ClearQueue": "Clear queue",
     "LabelSubtitleVerticalPosition": "Vertical position:",

src/strings/zh-cn.json

@@ -1339,6 +1339,30 @@
     "LabelRepositoryUrl": "存储库 URL",
     "MessageNoRepositories": "暂无存储库。",
     "LabelSyncPlayAccess": "同步播放访问控制",
+    "MediaInfoVideoRange": "动态范围",
+    "MediaInfoColorSpace": "颜色空间",
+    "MediaInfoColorTransfer": "颜色转移",
+    "MediaInfoColorPrimaries": "颜色初选",
+    "LabelVideoRange": "动态范围：",
+    "LabelColorSpace": "颜色空间：",
+    "LabelColorTransfer": "颜色转移：",
+    "LabelColorPrimaries": "颜色初选：",
+    "LabelOpenclDevice": "OpenCL 设备：",
+    "LabelOpenclDeviceHelp": "此 OpenCL 设备用来色调映射。点的左侧为平台号，右侧为此平台上的设备号。默认值为 0.0。需要包含 OpenCL 硬件加速方式的 FFmpeg 应用程序。",
+    "EnableTonemapping": "启用色调映射",
+    "AllowTonemappingHelp": "色调映射可以将视频的动态范围从 HDR 变换成 SDR，同时保持图像细节与颜色等对于表现原始场景非常重要的信息。目前仅在使用 NVENC HEVC 解码器并且转码 HDR10 或 HLG 视频时有效。",
+    "LabelTonemappingAlgorithm": "选择要使用的色调映射算法：",
+    "TonemappingAlgorithmHelp": "色调映射可以微调。如果你不是很熟悉这些选项，保持默认即可。建议值为 Reinhard。",
+    "LabelTonemappingRange": "色调映射 Range：",
+    "TonemappingRangeHelp": "选择输出颜色范围。选自动则与输入范围相同。",
+    "LabelTonemappingDesat": "色调映射 Desat：",
+    "LabelTonemappingDesatHelp": "对超过此亮度级别的高光应用去饱和。此值越大，将保留更多的颜色信息。此设置可以平滑地变成白色，从而有助于防止超高亮显示出不自然的颜色。这使图像感觉更自然，但以减少有关超出范围的颜色的信息为代价。建议值和默认值分别为 0 和 0.5。",
+    "LabelTonemappingThreshold": "色调映射 Threshold：",
+    "LabelTonemappingThresholdHelp": "此参数对每个场景的色调映射算法进行微调。此阈值用于检测场景是否已更改。如果当前帧平均亮度和当前运行平均值之间的距离超过阈值，我们将重新计算场景平均和峰值亮度。建议值和默认值分别为 0.8 和 0.2。",
+    "LabelTonemappingPeak": "色调映射 Peak：",
+    "LabelTonemappingPeakHelp": "用该值覆盖信号/标称/参考峰值。当显示元数据中嵌入的峰值信息不可靠时，或从较低范围到较高范围的色调映射时，此选项很有用。建议值和默认值均为 0。",
+    "LabelTonemappingParam": "色调映射 Param：",
+    "LabelTonemappingParamHelp": "调整色调映射算法。建议值和默认值均为 NaN。通常将其留空。",
     "ButtonPlayer": "播放器",
     "ClearQueue": "清空队列",
     "StopPlayback": "停止播放",