Add custom overlay positioning and scaling options in configuration

This commit is contained in:
CodeDevMLH
2026-03-10 23:43:20 +01:00
parent bca2d577b9
commit b3b6296798
4 changed files with 40 additions and 8 deletions

View File

@@ -56,5 +56,9 @@ namespace Jellyfin.Plugin.MediaBarEnhanced.Configuration
public string CustomOverlayStyle { get; set; } = "Shadowed";
public string CustomOverlayImageStyle { get; set; } = "None";
public string CustomOverlayPriority { get; set; } = "Image";
public int CustomOverlayPositionX { get; set; } = 0;
public int CustomOverlayPositionY { get; set; } = 0;
public int CustomOverlayScale { get; set; } = 100;
}
}

View File

@@ -316,7 +316,24 @@
<div class="fieldDescription">Choose a visual effect to apply to your overlay image.</div>
</div>
<h3 class="sectionTitle" style="margin-top:2em; border-bottom: 1px solid rgba(255,255,255,0.1); padding-bottom: 0.5em;">Layout Tweaks</h3>
<div style="display: flex; gap: 1em; flex-wrap: wrap;">
<div class="inputContainer" style="flex: 1; min-width: 150px;">
<label class="inputLabel inputLabelUnfocused" for="CustomOverlayPositionX">X Offset (% vw)</label>
<input is="emby-input" type="number" id="CustomOverlayPositionX" name="CustomOverlayPositionX" min="-50" max="50" step="1" />
<div class="fieldDescription">Horizontal nudge (negative = left, positive = right). Default is 0.</div>
</div>
<div class="inputContainer" style="flex: 1; min-width: 150px;">
<label class="inputLabel inputLabelUnfocused" for="CustomOverlayPositionY">Y Offset (% vh)</label>
<input is="emby-input" type="number" id="CustomOverlayPositionY" name="CustomOverlayPositionY" min="-50" max="50" step="1" />
<div class="fieldDescription">Vertical nudge (negative = up, positive = down). Default is 0.</div>
</div>
<div class="inputContainer" style="flex: 1; min-width: 150px;">
<label class="inputLabel inputLabelUnfocused" for="CustomOverlayScale">Scale (%)</label>
<input is="emby-input" type="number" id="CustomOverlayScale" name="CustomOverlayScale" min="50" max="200" step="1" />
<div class="fieldDescription">Overlay zoom level. Default is 100%.</div>
</div>
</div>
</div>
<!-- ADVANCED TAB -->
@@ -645,7 +662,8 @@
'IncludeWatchedContent', 'ShowPaginationDots', 'MaxParentalRating',
'MaxDaysRecent', 'ExcludeSeasonalContent', 'HideArrowsOnMobile',
'EnableCustomOverlay', 'CustomOverlayText', 'CustomOverlayImageUrl',
'CustomOverlayStyle', 'CustomOverlayImageStyle', 'CustomOverlayPriority'
'CustomOverlayStyle', 'CustomOverlayImageStyle', 'CustomOverlayPriority',
'CustomOverlayPositionX', 'CustomOverlayPositionY', 'CustomOverlayScale'
];
// Manual mapping for MediaBarIsEnabled -> IsEnabled, to avoid conflicts with other plugins
@@ -889,7 +907,8 @@
'IncludeWatchedContent', 'ShowPaginationDots', 'MaxParentalRating',
'MaxDaysRecent', 'ExcludeSeasonalContent', 'HideArrowsOnMobile',
'EnableCustomOverlay', 'CustomOverlayText', 'CustomOverlayImageUrl',
'CustomOverlayStyle', 'CustomOverlayImageStyle', 'CustomOverlayPriority'
'CustomOverlayStyle', 'CustomOverlayImageStyle', 'CustomOverlayPriority',
'CustomOverlayPositionX', 'CustomOverlayPositionY', 'CustomOverlayScale'
];
keys.forEach(function (key) {