81 lines
4.8 KiB
HTML
81 lines
4.8 KiB
HTML
<!-- Naming Format Modal -->
|
|
<div id="naming-format-modal" style="display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.7);">
|
|
<div style="background-color: #161b22; margin: 10% auto; padding: 20px; border: 1px solid #30363d; border-radius: 6px; width: 80%; max-width: 600px;">
|
|
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px;">
|
|
<h2 style="margin: 0; font-size: 18px; color: #f0f6fc;">Configure Naming Format</h2>
|
|
<span onclick="document.getElementById('naming-format-modal').style.display='none'" style="cursor: pointer; font-size: 20px; color: #7d8590;">×</span>
|
|
</div>
|
|
|
|
<form action="{{ url_for('podcasts.update_naming_format', podcast_id=podcast.id) }}" method="post">
|
|
<div class="form-group">
|
|
<label for="naming-format">Naming Format:</label>
|
|
<select id="naming-format" name="naming_format" class="form-control" style="width: 100%; padding: 8px; margin-bottom: 16px; background-color: #21262d; border: 1px solid #30363d; color: #c9d1d9; border-radius: 4px;" onchange="updateCustomFormatVisibility()">
|
|
<option value="">Use Global Settings</option>
|
|
<option value="{podcast_title}/{episode_title}">Podcast Title / Episode Title</option>
|
|
<option value="{podcast_title}/{episode_number} - {episode_title}">Podcast Title / Episode Number - Episode Title</option>
|
|
<option value="{podcast_title}/S{season}E{episode_number} - {episode_title}">Podcast Title / Season Episode - Episode Title</option>
|
|
<option value="{podcast_title}/Season {season}/{episode_number} - {episode_title}">Podcast Title / Season X / Episode Number - Episode Title</option>
|
|
<option value="custom">Custom</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div id="custom-format-group" class="form-group" style="display: none;">
|
|
<label for="custom-format">Custom Format:</label>
|
|
<input type="text" id="custom-format" name="custom_format" class="form-control" value="{{ podcast.naming_format }}" style="width: 100%; padding: 8px; margin-bottom: 8px; background-color: #21262d; border: 1px solid #30363d; color: #c9d1d9; border-radius: 4px;">
|
|
<div style="font-size: 11px; color: #7d8590; margin-bottom: 16px;">
|
|
Available variables: {podcast_title}, {episode_title}, {episode_number}, {season}, {season_episode}, {published_date}, {author}, {explicit}, {absolute_number}
|
|
</div>
|
|
</div>
|
|
|
|
<div style="text-align: right;">
|
|
<button type="button" onclick="document.getElementById('naming-format-modal').style.display='none'" class="btn" style="margin-right: 8px;">Cancel</button>
|
|
<button type="submit" class="btn btn-primary">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// Set the initial selected option based on the podcast's naming format
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const namingFormatSelect = document.getElementById('naming-format');
|
|
const customFormatGroup = document.getElementById('custom-format-group');
|
|
const customFormatInput = document.getElementById('custom-format');
|
|
const podcastNamingFormat = "{{ podcast.naming_format }}";
|
|
|
|
// Set the selected option
|
|
if (podcastNamingFormat) {
|
|
let found = false;
|
|
for (let i = 0; i < namingFormatSelect.options.length; i++) {
|
|
if (namingFormatSelect.options[i].value === podcastNamingFormat) {
|
|
namingFormatSelect.selectedIndex = i;
|
|
found = true;
|
|
break;
|
|
}
|
|
}
|
|
|
|
if (!found) {
|
|
// If the format doesn't match any predefined options, select "Custom"
|
|
for (let i = 0; i < namingFormatSelect.options.length; i++) {
|
|
if (namingFormatSelect.options[i].value === "custom") {
|
|
namingFormatSelect.selectedIndex = i;
|
|
customFormatGroup.style.display = "block";
|
|
customFormatInput.value = podcastNamingFormat;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
function updateCustomFormatVisibility() {
|
|
const namingFormatSelect = document.getElementById('naming-format');
|
|
const customFormatGroup = document.getElementById('custom-format-group');
|
|
|
|
if (namingFormatSelect.value === "custom") {
|
|
customFormatGroup.style.display = "block";
|
|
} else {
|
|
customFormatGroup.style.display = "none";
|
|
}
|
|
}
|
|
</script>
|