CodeDevMLH/jellyfin-plugin-media-bar-enhanced
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 24 Wiki Activity

Enhance seasonal section input fields with improved layout and descriptions

Browse Source
This commit is contained in:
CodeDevMLH
2026-02-13 01:40:33 +01:00
parent f2d383ec61
commit a1df756c56
1 changed files with 25 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
Jellyfin.Plugin.MediaBarEnhanced/Configuration/configPage.html
View File

@@ -165,7 +165,7 @@
<div id="seasonalSectionsList"></div>
<button is="emby-button" type="button" id="addSeasonBtn" class="raised emby-button"
style="margin-top: 1em; display: inline-flex; align-items: center; gap: 0.4em;">
<i class="md-icon">add</i>
<i class="material-icons" style="font-size: 24px;">add</i>
<span>Add Season</span>
</button>
</div>
@@ -574,21 +574,30 @@
return h;
}
div.innerHTML = `
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5em;">
<input is="emby-input" type="text" class="emby-input section-name" value="${data.Name}" placeholder="Season Name" style="flex: 1; margin-right: 1em; font-weight: bold;">
<button type="button" class="raised emby-button remove-section" style="background: #a94442;">Remove</button>
</div>
<div style="margin-bottom: 0.5em; display: flex; align-items: center; flex-wrap: wrap; gap: 0.5em;">
<span>From:</span>
${mkSelect(data.StartDay, days, 'start-day')}
${mkSelect(data.StartMonth, months, 'start-month')}
<span style="margin-left: 1em;">To:</span>
${mkSelect(data.EndDay, days, 'end-day')}
${mkSelect(data.EndMonth, months, 'end-month')}
</div>
<textarea is="emby-textarea" class="emby-textarea section-ids" style="width: 100%; height: 80px; font-family: monospace;" placeholder="Media IDs...">${data.MediaIds || ''}</textarea>
`;
div.innerHTML = '<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5em;">' +
' <div style="flex-grow:1; margin-right:1em;">' +
' <input is="emby-input" type="text" class="emby-input section-name" value="' + (data.Name || '') + '" label="Season Name" />' +
' <div class="fieldDescription">Name of the season (e.g. Christmas).</div>' +
' </div>' +
' <button type="button" class="raised emby-button remove-section" style="background: #a94442; min-width: unset;">Remove</button>' +
'</div>' +
'<div style="margin-bottom: 1em;">' +
' <label class="inputLabel" style="margin-bottom:0.5em; display:block;">Active Period</label>' +
' <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 0.5em;">' +
' <span>From:</span>' +
mkSelect(data.StartDay, days, 'start-day') +
mkSelect(data.StartMonth, months, 'start-month') +
' <span style="margin-left: 1em;">To:</span>' +
mkSelect(data.EndDay, days, 'end-day') +
mkSelect(data.EndMonth, months, 'end-month') +
' </div>' +
' <div class="fieldDescription">Date range (inclusive) when this content is active.</div>' +
'</div>' +
'<div>' +
' <label class="inputLabel" style="margin-bottom:0.5em; display:block;">Media IDs</label>' +
' <textarea is="emby-textarea" class="emby-textarea section-ids" style="width: 100%; height: 80px; font-family: monospace;">' + (data.MediaIds || '') + '</textarea>' +
' <div class="fieldDescription">Comma-separated list of Movie/Series/Collection IDs to show during this season.</div>' +
'</div>';
div.querySelector('.remove-section').addEventListener('click', function() {
div.remove();