azcomputerguru
3726cb5775
- Accept YouTube URLs in any format (@handle, /c/, /user/, /channel/) - Auto-extract channel ID from URLs using yt-dlp - Auto-detect channel name from URL (optional field) - Support direct channel ID input (backwards compatible) - Prevent duplicate channels - Updated UI with better instructions and examples - Improved user experience - just paste channel URL
94 lines
3.8 KiB
HTML
94 lines
3.8 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Channels{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="page-header">
|
|
<h2>Channel Management</h2>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h3>Add New Channel</h3>
|
|
<form method="POST" action="{{ url_for('add_channel') }}" class="form">
|
|
<div class="form-group">
|
|
<label for="channel_id">Channel URL or ID <span class="required">*</span></label>
|
|
<input type="text" id="channel_id" name="channel_id" required
|
|
placeholder="https://www.youtube.com/@AltonBrown or UCfDNi1aEljAQ17mUrfUjkvg" class="form-control">
|
|
<small class="form-help">
|
|
Paste any YouTube channel URL or enter the channel ID directly<br>
|
|
<strong>Supported formats:</strong> youtube.com/@handle, youtube.com/channel/ID, youtube.com/c/name, youtube.com/user/name
|
|
</small>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="channel_name">Channel Name</label>
|
|
<input type="text" id="channel_name" name="channel_name"
|
|
placeholder="Alton Brown (optional - auto-detected from URL)" class="form-control">
|
|
<small class="form-help">Display name for the channel folder. Leave blank to auto-detect from URL.</small>
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-primary">Add Channel</button>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h3>Configured Channels</h3>
|
|
{% if channels %}
|
|
<div class="table-responsive">
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>Channel Name</th>
|
|
<th>Channel ID</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for channel in channels %}
|
|
<tr>
|
|
<td><strong>{{ channel.name }}</strong></td>
|
|
<td><code>{{ channel.id }}</code></td>
|
|
<td>
|
|
<a href="https://www.youtube.com/channel/{{ channel.id }}"
|
|
target="_blank" class="btn btn-sm btn-secondary">View on YouTube</a>
|
|
<a href="{{ url_for('delete_channel', index=loop.index0) }}"
|
|
class="btn btn-sm btn-danger"
|
|
onclick="return confirm('Delete {{ channel.name }}? Downloaded videos will not be deleted.')">Delete</a>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% else %}
|
|
<div class="empty-state">
|
|
<p>No channels configured yet. Add your first channel above to get started!</p>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="card info-card">
|
|
<h3>How to Add Channels</h3>
|
|
|
|
<h4>Option 1: Paste the Channel URL (Easiest)</h4>
|
|
<ol>
|
|
<li>Go to the YouTube channel you want to sync</li>
|
|
<li>Copy the URL from your browser address bar</li>
|
|
<li>Paste it into the "Channel URL or ID" field above</li>
|
|
<li>Click "Add Channel" - the name will be detected automatically!</li>
|
|
</ol>
|
|
|
|
<h4>Option 2: Enter Channel ID Directly</h4>
|
|
<p>If you have the channel ID (starts with "UC" and is 24 characters long), just paste it directly.</p>
|
|
<p><strong>Example:</strong> <code>UCfDNi1aEljAQ17mUrfUjkvg</code></p>
|
|
|
|
<h4>Supported URL Formats</h4>
|
|
<ul>
|
|
<li><code>https://www.youtube.com/@AltonBrown</code> - Modern @ handle format</li>
|
|
<li><code>https://www.youtube.com/channel/UCfDNi1aEljAQ17mUrfUjkvg</code> - Channel ID format</li>
|
|
<li><code>https://www.youtube.com/c/AltonBrown</code> - Custom URL format</li>
|
|
<li><code>https://www.youtube.com/user/altonbrown</code> - Legacy user format</li>
|
|
</ul>
|
|
</div>
|
|
{% endblock %}
|