🎥 Streaming - API de YouTube

{
    "kind": "youtube#video",  // Tipo de recurso
    "id": "dQw4w9WgXcQ",  // ID único del video
    "snippet": {  // Información básica
        "title": "Tutorial Django REST Framework",  // Título del video
        "description": "Aprende a crear APIs con Django",  // Descripción
        "publishedAt": "2026-01-15T10:00:00Z",  // Fecha de publicación (ISO 8601)
        "channelId": "UCxxxxxxxxxxxxxx",  // ID del canal
        "channelTitle": "UTH Educación",  // Nombre del canal
        "thumbnails": {  // Miniaturas en diferentes resoluciones
            "default": {"url": "...", "width": 120, "height": 90},
            "medium": {"url": "...", "width": 320, "height": 180},
            "high": {"url": "...", "width": 480, "height": 360}
        },
        "tags": ["Django", "Python", "REST API"]  // Etiquetas
    },
    "contentDetails": {  // Detalles del contenido
        "duration": "PT15M30S",  // Duración (ISO 8601: 15 min 30 seg)
        "definition": "hd"  // Calidad: "hd" o "sd"
    },
    "statistics": {  // Estadísticas públicas
        "viewCount": "12500",  // Visualizaciones
        "likeCount": "450",  // Me gusta
        "commentCount": "89"  // Comentarios
    }
}

# Scopes más comunes
'https://www.googleapis.com/auth/youtube.readonly'  # Ver canal y cuenta
'https://www.googleapis.com/auth/youtube'  # Gestión completa (ver y editar)
'https://www.googleapis.com/auth/youtube.upload'  # Solo subir videos
'https://www.googleapis.com/auth/youtube.force-ssl'  # Gestión con SSL (recomendado)

# Activar entorno virtual
.\venv\Scripts\Activate  # Activa entorno de Python

# Instalar Google API Client (oficial de Google)
pip install google-api-python-client==2.108.0  # Biblioteca oficial para APIs de Google

# Instalar Google Auth (autenticación OAuth)
pip install google-auth==2.25.2  # Manejo de autenticación
pip install google-auth-oauthlib==1.2.0  # OAuth 2.0 para Google
pip install google-auth-httplib2==0.2.0  # HTTP transport para auth

# Actualizar requirements
pip freeze > requirements.txt  # Guarda dependencias

# YouTube API Credentials
YOUTUBE_API_KEY=tu_api_key_aqui  # Para búsquedas públicas

# OAuth 2.0 Credentials
GOOGLE_CLIENT_ID=tu_client_id.apps.googleusercontent.com  # Client ID de OAuth
GOOGLE_CLIENT_SECRET=tu_client_secret  # Client Secret (¡SECRETO!)
GOOGLE_REDIRECT_URI=http://localhost:8000/youtube/callback/  # URL de callback

from decouple import config  # Leer variables de entorno

# Configuración de YouTube API
YOUTUBE_API_KEY = config('YOUTUBE_API_KEY')  # API Key pública
YOUTUBE_API_SERVICE_NAME = 'youtube'  # Nombre del servicio
YOUTUBE_API_VERSION = 'v3'  # Versión de la API

# Configuración OAuth 2.0
GOOGLE_CLIENT_ID = config('GOOGLE_CLIENT_ID')  # Client ID
GOOGLE_CLIENT_SECRET = config('GOOGLE_CLIENT_SECRET')  # Client Secret
GOOGLE_REDIRECT_URI = config('GOOGLE_REDIRECT_URI')  # URL callback

# Scopes necesarios
YOUTUBE_SCOPES = [
    'https://www.googleapis.com/auth/youtube.upload',  # Subir videos
    'https://www.googleapis.com/auth/youtube'  # Gestión completa
]

# ============ CREDENCIALES YOUTUBE API (GRATUITAS) ============

# API Key (copiada del Paso 3)
YOUTUBE_API_KEY=AIzaSyAbc123_TU_API_KEY_AQUI

# OAuth 2.0 (del archivo client_secrets.json)
GOOGLE_CLIENT_ID=123456789-abcdefgh.apps.googleusercontent.com
GOOGLE_CLIENT_SECRET=GOCSPX-abc123_TU_SECRET_AQUI

# URL de callback (debe coincidir con lo configurado)
GOOGLE_REDIRECT_URI=http://localhost:8000/oauth/callback/

from decouple import config

# YouTube Data API v3 - Cuenta Gratuita Personal
YOUTUBE_API_KEY = config('YOUTUBE_API_KEY')
YOUTUBE_API_SERVICE_NAME = 'youtube'
YOUTUBE_API_VERSION = 'v3'

# OAuth 2.0 - Sin restricciones para cuenta personal
GOOGLE_CLIENT_ID = config('GOOGLE_CLIENT_ID')
GOOGLE_CLIENT_SECRET = config('GOOGLE_CLIENT_SECRET')
GOOGLE_REDIRECT_URI = config('GOOGLE_REDIRECT_URI')

# Scopes para cuenta personal (acceso completo)
YOUTUBE_SCOPES = [
    'https://www.googleapis.com/auth/youtube',  # Gestión completa de tu canal
    'https://www.googleapis.com/auth/youtube.upload',  # Subir videos
    'https://www.googleapis.com/auth/youtube.readonly',  # Ver tus videos
]

from googleapiclient.discovery import build

# Reemplaza con tu API Key
API_KEY = 'AIzaSyAbc123_TU_API_KEY_AQUI'

# Crear servicio YouTube
youtube = build('youtube', 'v3', developerKey=API_KEY)

# Buscar videos de "Django tutorial"
request = youtube.search().list(
    q='Django tutorial',
    part='snippet',
    type='video',
    maxResults=5
)

response = request.execute()

# Mostrar resultados
for item in response['items']:
    print(f"✅ {item['snippet']['title']}")

print("\n🎉 ¡API Key funciona correctamente!")

from django.db import models  # ORM de Django
from django.contrib.auth.models import User  # Usuario

class Video(models.Model):
    """Modelo para almacenar información de videos de YouTube"""
    
    # Información de YouTube
    youtube_id = models.CharField(max_length=20, unique=True)  # ID único de YouTube (11 chars)
    titulo = models.CharField(max_length=300)  # Título del video
    descripcion = models.TextField()  # Descripción completa
    
    # URLs
    url_video = models.URLField()  # https://youtube.com/watch?v=xxxxx
    url_thumbnail = models.URLField()  # URL de la miniatura (imagen)
    
    # Información del canal
    canal_id = models.CharField(max_length=50)  # ID del canal de YouTube
    canal_nombre = models.CharField(max_length=200)  # Nombre del canal
    
    # Detalles
    duracion = models.CharField(max_length=20, blank=True)  # Formato ISO 8601 (PT15M30S)
    fecha_publicacion = models.DateTimeField()  # Cuándo se publicó en YouTube
    
    # Estadísticas (se actualizan periódicamente)
    vistas = models.BigIntegerField(default=0)  # Visualizaciones en YouTube
    likes = models.IntegerField(default=0)  # Me gusta
    comentarios = models.IntegerField(default=0)  # Cantidad de comentarios
    
    # Categorización local
    categoria = models.CharField(max_length=50, choices=[  # Categorías personalizadas
        ('programacion', 'Programación'),
        ('bases_datos', 'Bases de Datos'),
        ('redes', 'Redes'),
        ('seguridad', 'Seguridad'),
        ('otro', 'Otro'),
    ])
    etiquetas = models.CharField(max_length=500, blank=True)  # Tags separados por comas
    
    # Relaciones
    agregado_por = models.ForeignKey(User, on_delete=models.SET_NULL, null=True)  # Usuario que agregó
    
    # Metadatos
    creado = models.DateTimeField(auto_now_add=True)  # Fecha de creación en BD local
    actualizado = models.DateTimeField(auto_now=True)  # Última actualización
    
    class Meta:
        ordering = ['-fecha_publicacion']  # Más recientes primero
        verbose_name_plural = 'Videos'
    
    def __str__(self):
        return self.titulo
    
    def get_embed_url(self):
        """Retorna URL para embed iframe"""
        return f"https://www.youtube.com/embed/{self.youtube_id}"  # Para <iframe>


class Playlist(models.Model):
    """Playlist personalizada de videos"""
    
    nombre = models.CharField(max_length=200)  # Nombre de la playlist
    descripcion = models.TextField(blank=True)  # Descripción
    videos = models.ManyToManyField(Video, related_name='playlists')  # Videos incluidos
    creador = models.ForeignKey(User, on_delete=models.CASCADE)  # Dueño de la playlist
    publica = models.BooleanField(default=False)  # Si es visible para todos
    
    creado = models.DateTimeField(auto_now_add=True)
    
    def __str__(self):
        return self.nombre

from googleapiclient.discovery import build  # Constructor de servicio Google
from django.conf import settings  # Configuración
from datetime import datetime  # Manejo de fechas
import isodate  # Para parsear duración ISO 8601

class YouTubeService:
    """Servicio para interactuar con YouTube Data API v3"""
    
    def __init__(self):
        # Crear cliente de YouTube API con API Key
        self.youtube = build(  # Construye servicio de YouTube
            settings.YOUTUBE_API_SERVICE_NAME,  # 'youtube'
            settings.YOUTUBE_API_VERSION,  # 'v3'
            developerKey=settings.YOUTUBE_API_KEY  # API Key
        )
    
    def buscar_videos(self, query, max_resultados=10, orden='relevance'):
        """
        Busca videos en YouTube
        
        Args:
            query: Texto a buscar
            max_resultados: Cantidad máxima de resultados (1-50)
            orden: relevance, date, rating, title, viewCount
        
        Returns:
            list: Lista de diccionarios con información de videos
        """
        
        # Llamar endpoint search.list
        search_response = self.youtube.search().list(  # Ejecuta búsqueda
            q=query,  # Término de búsqueda
            part='id,snippet',  # Partes a retornar
            type='video',  # Solo videos (no canales ni playlists)
            maxResults=max_resultados,  # Límite de resultados
            order=orden,  # Criterio de ordenamiento
            regionCode='HN'  # Región Honduras (opcional)
        ).execute()  # Ejecuta la petición
        
        # Extraer IDs de videos encontrados
        video_ids = [item['id']['videoId'] for item in search_response.get('items', [])]  # Lista de IDs
        
        # Obtener detalles completos de los videos
        if video_ids:
            videos_detalle = self.obtener_detalles_videos(video_ids)  # Llama método interno
            return videos_detalle
        
        return []  # Sin resultados
    
    def obtener_detalles_videos(self, video_ids):
        """
        Obtiene información detallada de videos
        
        Args:
            video_ids: Lista de IDs de videos o string único
        
        Returns:
            list: Información completa de videos
        """
        
        # Convertir a lista si es string
        if isinstance(video_ids, str):
            video_ids = [video_ids]  # Convierte a lista
        
        # Llamar endpoint videos.list
        videos_response = self.youtube.videos().list(  # Obtiene detalles
            id=','.join(video_ids),  # IDs separados por coma
            part='snippet,contentDetails,statistics'  # Incluye snippet, duración y stats
        ).execute()
        
        videos = []  # Lista para almacenar resultados
        
        for item in videos_response.get('items', []):  # Itera resultados
            snippet = item['snippet']  # Información básica
            statistics = item.get('statistics', {})  # Estadísticas (puede no existir)
            content = item['contentDetails']  # Detalles de contenido
            
            # Parsear duración ISO 8601 (PT15M30S → 15:30)
            duracion_iso = content.get('duration', 'PT0S')  # Obtiene duración
            duracion_segundos = isodate.parse_duration(duracion_iso).total_seconds()  # Convierte a segundos
            
            video_data = {  # Construye diccionario con datos
                'youtube_id': item['id'],  # ID del video
                'titulo': snippet['title'],  # Título
                'descripcion': snippet['description'],  # Descripción
                'canal_id': snippet['channelId'],  # ID del canal
                'canal_nombre': snippet['channelTitle'],  # Nombre del canal
                'fecha_publicacion': datetime.fromisoformat(  # Convierte a datetime
                    snippet['publishedAt'].replace('Z', '+00:00')
                ),
                'url_thumbnail': snippet['thumbnails']['high']['url'],  # Miniatura alta resolución
                'url_video': f"https://www.youtube.com/watch?v={item['id']}",  # URL completa
                'duracion': duracion_iso,  # Duración en formato ISO
                'duracion_segundos': int(duracion_segundos),  # Duración en segundos
                'vistas': int(statistics.get('viewCount', 0)),  # Visualizaciones
                'likes': int(statistics.get('likeCount', 0)),  # Me gusta
                'comentarios': int(statistics.get('commentCount', 0)),  # Comentarios
                'etiquetas': ','.join(snippet.get('tags', [])),  # Tags separados por coma
            }
            
            videos.append(video_data)  # Agrega a la lista
        
        return videos  # Retorna lista de videos
    
    def obtener_videos_canal(self, canal_id, max_resultados=20):
        """Obtiene videos de un canal específico"""
        
        search_response = self.youtube.search().list(
            channelId=canal_id,  # Filtrar por canal
            part='id',
            type='video',
            order='date',  # Más recientes primero
            maxResults=max_resultados
        ).execute()
        
        video_ids = [item['id']['videoId'] for item in search_response.get('items', [])]
        
        if video_ids:
            return self.obtener_detalles_videos(video_ids)
        
        return []

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),  # Panel de administración
    path('', include('videos.urls')),  # URLs de la app videos
]

from django.urls import path
from . import views

app_name = 'videos'  # Namespace para URLs

urlpatterns = [
    # ========== PÁGINAS PRINCIPALES ==========
    path('', views.inicio, name='inicio'),
    
    # ========== OAUTH YOUTUBE ==========
    path('oauth/authorize/', views.oauth_authorize, name='oauth_authorize'),
    path('oauth/callback/', views.oauth_callback, name='oauth_callback'),
    
    # ========== GESTIÓN DE VIDEOS ==========
    path('buscar/', views.buscar_videos, name='buscar_videos'),
    path('video/<str:video_id>/', views.detalle_video, name='detalle_video'),
    path('mis-videos/', views.mis_videos, name='mis_videos'),
    
    # ========== SUBIR VIDEOS ==========
    path('subir/', views.subir_video, name='subir_video'),
    path('subir/procesar/', views.procesar_subida, name='procesar_subida'),
]

from django.shortcuts import render, redirect, get_object_or_404
from django.contrib.auth.decorators import login_required
from django.http import JsonResponse
from django.contrib import messages
from django.conf import settings

# Google API Client
from google.oauth2.credentials import Credentials
from google_auth_oauthlib.flow import Flow
from googleapiclient.discovery import build
from googleapiclient.http import MediaFileUpload

import os
from datetime import datetime

from .models import Video

def inicio(request):
    """Dashboard principal con videos destacados"""
    
    videos = Video.objects.all().order_by('-fecha_publicacion')[:12]
    
    contexto = {
        'videos': videos,
        'total_videos': Video.objects.count(),
        'total_views': sum(v.vistas for v in videos),
        'total_likes': sum(v.likes for v in videos),
    }
    
    return render(request, 'videos/inicio.html', contexto)

@login_required
def oauth_authorize(request):
    """Redirige a Google OAuth para autorización"""
    
    flow = Flow.from_client_secrets_file(
        'client_secrets.json',
        scopes=settings.YOUTUBE_SCOPES,
        redirect_uri=settings.GOOGLE_REDIRECT_URI
    )
    
    authorization_url, state = flow.authorization_url(
        access_type='offline',
        include_granted_scopes='true'
    )
    
    request.session['oauth_state'] = state
    
    return redirect(authorization_url)

@login_required
def oauth_callback(request):
    """Recibe código de autorización y obtiene tokens"""
    
    state = request.session.get('oauth_state')
    
    try:
        flow = Flow.from_client_secrets_file(
            'client_secrets.json',
            scopes=settings.YOUTUBE_SCOPES,
            state=state,
            redirect_uri=settings.GOOGLE_REDIRECT_URI
        )
        
        flow.fetch_token(authorization_response=request.build_absolute_uri())
        credentials = flow.credentials
        
        # Guardar tokens en sesión (o BD)
        request.session['youtube_credentials'] = {
            'token': credentials.token,
            'refresh_token': credentials.refresh_token,
            'token_uri': credentials.token_uri,
            'client_id': credentials.client_id,
            'client_secret': credentials.client_secret,
        }
        
        messages.success(request, '✅ Conectado con YouTube')
        return redirect('videos:inicio')
        
    except Exception as e:
        messages.error(request, f'❌ Error OAuth: {e}')
        return redirect('videos:inicio')

def buscar_videos(request):
    """Busca videos en YouTube por palabra clave"""
    
    query = request.GET.get('q', '')
    resultados = []
    
    if query:
        youtube = build(
            settings.YOUTUBE_API_SERVICE_NAME,
            settings.YOUTUBE_API_VERSION,
            developerKey=settings.YOUTUBE_API_KEY
        )
        
        search_response = youtube.search().list(
            q=query,
            part='id,snippet',
            type='video',
            maxResults=20
        ).execute()
        
        resultados = search_response.get('items', [])
    
    return render(request, 'videos/buscar.html', {
        'query': query,
        'resultados': resultados
    })

@login_required
def procesar_subida(request):
    """Sube video a YouTube usando OAuth del usuario"""
    
    if request.method == 'POST':
        try:
            # Obtener credenciales de la sesión
            creds_data = request.session.get('youtube_credentials')
            credentials = Credentials(**creds_data)
            
            youtube = build('youtube', 'v3', credentials=credentials)
            
            # Obtener datos del formulario
            video_file = request.FILES['video']
            titulo = request.POST.get('titulo')
            descripcion = request.POST.get('descripcion')
            
            # Guardar temporalmente
            temp_path = f'/tmp/{video_file.name}'
            with open(temp_path, 'wb') as f:
                for chunk in video_file.chunks():
                    f.write(chunk)
            
            # Metadata del video
            body = {
                'snippet': {
                    'title': titulo,
                    'description': descripcion,
                    'categoryId': '27'  # Education
                },
                'status': {'privacyStatus': 'private'}
            }
            
            media = MediaFileUpload(temp_path, resumable=True)
            
            request_upload = youtube.videos().insert(
                part='snippet,status',
                body=body,
                media_body=media
            )
            
            response = request_upload.execute()
            
            os.remove(temp_path)
            
            messages.success(request, f'✅ Video subido: {response["id"]}')
            return redirect('videos:mis_videos')
            
        except Exception as e:
            messages.error(request, f'❌ Error: {e}')
    
    return render(request, 'videos/subir_video.html')

from decouple import config

# ============ YOUTUBE DATA API V3 (2026) ============
YOUTUBE_API_SERVICE_NAME = 'youtube'
YOUTUBE_API_VERSION = 'v3'
YOUTUBE_API_KEY = config('YOUTUBE_API_KEY')

# OAuth 2.1 (2026 Standard)
GOOGLE_CLIENT_ID = config('GOOGLE_CLIENT_ID')
GOOGLE_CLIENT_SECRET = config('GOOGLE_CLIENT_SECRET')
GOOGLE_REDIRECT_URI = 'http://localhost:8000/oauth/callback/'

# Scopes actualizados 2026
YOUTUBE_SCOPES = [
    'https://www.googleapis.com/auth/youtube',  # Gestión completa
    'https://www.googleapis.com/auth/youtube.upload',  # Subir videos
    'https://www.googleapis.com/auth/youtube.readonly',  # Solo lectura
    'https://www.googleapis.com/auth/yt-analytics.readonly',  # 🆕 Analytics API
]

# Configuración de cuotas (2026)
YOUTUBE_QUOTA_CONFIG = {
    'daily_limit': 15000,  # Aumentado de 10,000
    'warning_threshold': 12000,  # 80% de la cuota
    'enable_cache': True,  # Cachear búsquedas repetidas
    'cache_ttl': 3600,  # 1 hora
}

# Categorías de YouTube actualizadas 2026
YOUTUBE_CATEGORIES = {
    '1': 'Film & Animation',
    '2': 'Autos & Vehicles',
    '10': 'Music',
    '15': 'Pets & Animals',
    '17': 'Sports',
    '19': 'Travel & Events',
    '20': 'Gaming',
    '22': 'People & Blogs',
    '23': 'Comedy',
    '24': 'Entertainment',
    '25': 'News & Politics',
    '26': 'Howto & Style',
    '27': 'Education',
    '28': 'Science & Technology',
    '29': 'Nonprofits & Activism',
    '44': 'Shorts',  # 🆕 YouTube Shorts 2026
}

from googleapiclient.discovery import build
from django.conf import settings
from django.core.cache import cache
import hashlib
import logging

logger = logging.getLogger(__name__)

class YouTubeService2026:
    """Servicio YouTube Data API v3 - Optimizado 2026"""
    
    def __init__(self, api_key=None):
        self.api_key = api_key or settings.YOUTUBE_API_KEY
        self.youtube = build(
            settings.YOUTUBE_API_SERVICE_NAME,
            settings.YOUTUBE_API_VERSION,
            developerKey=self.api_key
        )
    
    def buscar_videos_con_cache(self, query, max_results=10):
        """Busca videos con caché automático (2026 feature)"""
        
        # Generar clave de caché única
        cache_key = f"youtube_search_{hashlib.md5(query.encode()).hexdigest()}"
        
        # Intentar obtener de caché
        cached_result = cache.get(cache_key)
        if cached_result:
            logger.info(f"✅ Cache HIT: {query}")
            return cached_result
        
        # Si no existe en caché, llamar a API
        logger.info(f"🔍 API CALL: {query}")
        
        search_response = self.youtube.search().list(
            q=query,
            part='id,snippet',
            type='video',
            maxResults=max_results,
            order='relevance',
            regionCode='MX'  # México
        ).execute()
        
        resultados = search_response.get('items', [])
        
        # Guardar en caché por 1 hora
        cache.set(cache_key, resultados, timeout=3600)
        
        return resultados
    
    def obtener_estadisticas_mejoradas(self, video_id):
        """Obtiene estadísticas con métricas 2026"""
        
        response = self.youtube.videos().list(
            part='snippet,contentDetails,statistics,topicDetails',
            id=video_id
        ).execute()
        
        if not response['items']:
            return None
        
        video = response['items'][0]
        stats = video.get('statistics', {})
        
        return {
            'views': int(stats.get('viewCount', 0)),
            'likes': int(stats.get('likeCount', 0)),
            'comments': int(stats.get('commentCount', 0)),
            'engagement_rate': self._calcular_engagement(stats),  # 🆕 2026
        }
    
    def _calcular_engagement(self, stats):
        """Calcula tasa de engagement (2026 metric)"""
        views = int(stats.get('viewCount', 0))
        if views == 0:
            return 0.0
        
        likes = int(stats.get('likeCount', 0))
        comments = int(stats.get('commentCount', 0))
        
        engagement = ((likes + comments) / views) * 100
        return round(engagement, 2)

# ============ YOUTUBE DATA API V3 (2026) ============
YOUTUBE_API_KEY=AIzaSy...  # Tu API Key de Google Cloud Console

# OAuth 2.1 Credentials
GOOGLE_CLIENT_ID=123456789-abc.apps.googleusercontent.com
GOOGLE_CLIENT_SECRET=GOCSPX-abc123...

# URLs de redirección
OAUTH_REDIRECT_URI=http://localhost:8000/oauth/callback/

# Configuración de caché (Redis recomendado para 2026)
CACHE_BACKEND=redis
REDIS_URL=redis://localhost:6379/1

# Configuración de cuotas
YOUTUBE_DAILY_QUOTA=15000  # Aumentado en 2026
ENABLE_QUOTA_MONITORING=True

from google_auth_oauthlib.flow import Flow  # Flujo OAuth
from googleapiclient.discovery import build  # Constructor servicio
from googleapiclient.http import MediaFileUpload  # Para subir archivos
from django.conf import settings  # Settings

class YouTubeUploadService:
    """Servicio para subir videos a YouTube con OAuth"""
    
    def obtener_url_autorizacion(self):
        """Genera URL para que usuario autorice la app"""
        
        flow = Flow.from_client_config(  # Crea flujo OAuth
            {
                "web": {
                    "client_id": settings.GOOGLE_CLIENT_ID,
                    "client_secret": settings.GOOGLE_CLIENT_SECRET,
                    "redirect_uris": [settings.GOOGLE_REDIRECT_URI],
                    "auth_uri": "https://accounts.google.com/o/oauth2/auth",
                    "token_uri": "https://oauth2.googleapis.com/token"
                }
            },
            scopes=settings.YOUTUBE_SCOPES  # Permisos requeridos
        )
        
        flow.redirect_uri = settings.GOOGLE_REDIRECT_URI  # URL de callback
        
        authorization_url, state = flow.authorization_url(  # Genera URL
            access_type='offline',  # Obtener refresh_token
            include_granted_scopes='true'  # Incluir scopes ya autorizados
        )
        
        return authorization_url, state  # Retorna URL y state (para validación)
    
    def subir_video(self, credentials, archivo_path, titulo, descripcion, categoria='22', privacidad='private'):
        """
        Sube un video a YouTube
        
        Args:
            credentials: Credenciales OAuth del usuario
            archivo_path: Ruta al archivo de video
            titulo: Título del video
            descripcion: Descripción del video
            categoria: ID de categoría (22=People & Blogs, 27=Education)
            privacidad: public, private, unlisted
        
        Returns:
            dict: Información del video subido
        """
        
        # Crear servicio YouTube con credenciales del usuario
        youtube = build(  # Construye servicio autenticado
            'youtube', 
            'v3', 
            credentials=credentials  # Usa credentials del usuario
        )
        
        # Metadata del video
        body = {
            'snippet': {
                'title': titulo,  # Título
                'description': descripcion,  # Descripción
                'categoryId': categoria  # Categoría
            },
            'status': {
                'privacyStatus': privacidad  # Nivel de privacidad
            }
        }
        
        # Preparar archivo para upload
        media = MediaFileUpload(  # Crea objeto de media
            archivo_path,  # Ruta del archivo
            chunksize=-1,  # Subir todo de una vez
            resumable=True  # Permite reanudar si falla
        )
        
        # Ejecutar upload
        request = youtube.videos().insert(  # Crea request de insert
            part='snippet,status',  # Partes a enviar
            body=body,  # Metadata
            media_body=media  # Archivo de video
        )
        
        response = request.execute()  # Ejecuta upload (puede tomar tiempo)
        
        return response  # Retorna respuesta con ID del video subido

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}YouTube Manager{% endblock %}</title>
    
    <!-- Bootstrap 5 -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    
    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
    
    <style>
        :root {
            --youtube-red: #FF0000;
            --youtube-dark: #CC0000;
            --youtube-black: #282828;
            --youtube-gray: #F9F9F9;
        }
        
        body {
            font-family: 'Roboto', 'Segoe UI', sans-serif;
            background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
            min-height: 100vh;
            padding: 20px;
        }
        
        .main-container {
            max-width: 1400px;
            margin: 0 auto;
            background: white;
            border-radius: 20px;
            box-shadow: 0 25px 50px rgba(255, 0, 0, 0.3);
            overflow: hidden;
        }
        
        /* Navbar estilo YouTube */
        .navbar-youtube {
            background: linear-gradient(135deg, var(--youtube-red) 0%, var(--youtube-dark) 100%);
            padding: 20px 40px;
            box-shadow: 0 4px 12px rgba(255, 0, 0, 0.4);
        }
        
        .navbar-brand {
            font-size: 1.8rem;
            font-weight: 700;
            color: white !important;
            display: flex;
            align-items: center;
            gap: 15px;
        }
        
        .navbar-brand i {
            font-size: 2.5rem;
            animation: playPulse 2s infinite;
        }
        
        @keyframes playPulse {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.15); }
        }
        
        .nav-link-youtube {
            color: white !important;
            padding: 10px 20px;
            margin: 0 5px;
            border-radius: 12px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            font-weight: 500;
        }
        
        .nav-link-youtube:hover {
            background: rgba(255,255,255,0.2);
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(255,255,255,0.3);
        }
        
        .nav-link-youtube.active {
            background: white;
            color: var(--youtube-red) !important;
        }
        
        .content-wrapper {
            padding: 50px;
        }
        
        /* Cards estilo YouTube */
        .card-youtube {
            background: white;
            border: none;
            border-radius: 20px;
            box-shadow: 0 8px 32px rgba(0,0,0,0.1);
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            overflow: hidden;
            position: relative;
        }
        
        .card-youtube::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 5px;
            background: linear-gradient(90deg, var(--youtube-red), var(--youtube-dark));
        }
        
        .card-youtube:hover {
            transform: translateY(-10px) scale(1.02);
            box-shadow: 0 20px 60px rgba(255, 0, 0, 0.3);
        }
        
        .card-body {
            padding: 30px;
        }
        
        /* Video Thumbnail Card */
        .video-card {
            background: #282828;
            border-radius: 15px;
            overflow: hidden;
            transition: all 0.3s;
            cursor: pointer;
        }
        
        .video-card:hover {
            transform: scale(1.05);
            box-shadow: 0 10px 30px rgba(255, 0, 0, 0.5);
        }
        
        .video-thumbnail {
            width: 100%;
            aspect-ratio: 16/9;
            object-fit: cover;
            position: relative;
        }
        
        .video-info {
            padding: 15px;
            color: white;
        }
        
        .video-title {
            font-weight: 600;
            margin-bottom: 8px;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        
        .video-stats {
            font-size: 0.85rem;
            color: #aaa;
        }
        
        /* Botones estilo YouTube */
        .btn-youtube {
            background: linear-gradient(135deg, var(--youtube-red) 0%, var(--youtube-dark) 100%);
            color: white;
            border: none;
            padding: 12px 30px;
            border-radius: 12px;
            font-weight: 600;
            transition: all 0.3s;
            box-shadow: 0 4px 15px rgba(255, 0, 0, 0.4);
        }
        
        .btn-youtube:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 25px rgba(255, 0, 0, 0.6);
            color: white;
        }
        
        .btn-youtube i {
            margin-right: 8px;
        }
        
        /* Stats cards con efecto play */
        .stat-card {
            background: linear-gradient(135deg, var(--youtube-red) 0%, var(--youtube-dark) 100%);
            color: white;
            border-radius: 20px;
            padding: 30px;
            text-align: center;
            position: relative;
            overflow: hidden;
        }
        
        .stat-card::before {
            content: '';
            position: absolute;
            width: 100px;
            height: 100px;
            border-radius: 50%;
            background: rgba(255,255,255,0.1);
            top: -50px;
            right: -50px;
            animation: ripple 3s infinite;
        }
        
        @keyframes ripple {
            0% { transform: scale(1); opacity: 1; }
            100% { transform: scale(3); opacity: 0; }
        }
        
        .stat-card h2 {
            font-size: 3rem;
            font-weight: 700;
            margin: 15px 0;
            position: relative;
            z-index: 1;
        }
        
        .stat-card i {
            font-size: 3rem;
            opacity: 0.9;
            position: relative;
            z-index: 1;
        }
        
        /* Footer moderno */
        footer {
            background: linear-gradient(135deg, #1a1a1a 0%, #2c3e50 100%);
            color: white;
            padding: 50px;
            text-align: center;
            margin-top: 50px;
        }
        
        footer a {
            color: var(--youtube-red);
            text-decoration: none;
            transition: all 0.3s;
        }
        
        footer a:hover {
            color: white;
            text-shadow: 0 0 10px var(--youtube-red);
        }
        
        /* Mensajes animados */
        .alert {
            border: none;
            border-radius: 15px;
            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
            animation: slideInDown 0.5s;
        }
        
        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
        
        /* Play Button Effect */
        .play-overlay {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 80px;
            height: 80px;
            background: rgba(255, 0, 0, 0.9);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 2rem;
            color: white;
            opacity: 0;
            transition: all 0.3s;
        }
        
        .video-card:hover .play-overlay {
            opacity: 1;
        }
    </style>
    
    {% block extra_css %}{% endblock %}
</head>
<body>
    <div class="main-container">
        <!-- Navbar YouTube-Style -->
        <nav class="navbar navbar-youtube navbar-expand-lg">
            <div class="container-fluid">
                <a class="navbar-brand" href="{% url 'inicio' %}">
                    <i class="fab fa-youtube"></i>
                    YouTube Manager
                </a>
                
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
                    <span class="navbar-toggler-icon"></span>
                </button>
                
                <div class="collapse navbar-collapse" id="navbarNav">
                    <ul class="navbar-nav ms-auto">
                        <li class="nav-item">
                            <a class="nav-link-youtube" href="{% url 'inicio' %}">
                                <i class="fas fa-home"></i> Inicio
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link-youtube" href="{% url 'mis_videos' %}">
                                <i class="fas fa-video"></i> Mis Videos
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link-youtube active" href="{% url 'subir_video' %}">
                                <i class="fas fa-upload"></i> Subir Video
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </nav>
        
        <!-- Mensajes Django -->
        {% if messages %}
            <div class="container mt-4">
                {% for message in messages %}
                    <div class="alert alert-{{ message.tags }} alert-dismissible fade show">
                        {{ message }}
                        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                    </div>
                {% endfor %}
            </div>
        {% endif %}
        
        <!-- Contenido Principal -->
        <div class="content-wrapper">
            {% block content %}{% endblock %}
        </div>
        
        <!-- Footer -->
        <footer>
            <p><i class="fab fa-youtube"></i> YouTube Video Manager - UTH 2026</p>
            <p><small>Desarrollado con Django + YouTube Data API v3</small></p>
            <p style="margin-top: 20px;">
                <a href="https://developers.google.com/youtube/v3" target="_blank">YouTube API Docs</a> |
                <a href="https://console.cloud.google.com/" target="_blank">Cloud Console</a>
            </p>
        </footer>
    </div>
    
    <!-- Bootstrap JS -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    {% block extra_js %}{% endblock %}
</body>
</html>

{% extends 'videos/base.html' %}

{% block title %}Inicio - YouTube Manager{% endblock %}

{% block content %}
<div class="text-center mb-5">
    <h1 class="display-3" style="color: #FF0000; font-weight: 700;">
        <i class="fab fa-youtube"></i> Mi Canal de YouTube
    </h1>
    <p class="lead">Gestiona tus videos desde Django</p>
</div>

<!-- Stats Cards -->
<div class="row mb-5">
    <div class="col-md-4 mb-4">
        <div class="stat-card">
            <i class="fas fa-video"></i>
            <h2>{{ total_videos }}</h2>
            <p>Videos Subidos</p>
        </div>
    </div>
    
    <div class="col-md-4 mb-4">
        <div class="stat-card" style="background: linear-gradient(135deg, #282828 0%, #1a1a1a 100%);">
            <i class="fas fa-eye"></i>
            <h2>{{ total_views }}</h2>
            <p>Visualizaciones Totales</p>
        </div>
    </div>
    
    <div class="col-md-4 mb-4">
        <div class="stat-card" style="background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);">
            <i class="fas fa-thumbs-up"></i>
            <h2>{{ total_likes }}</h2>
            <p>Me Gusta</p>
        </div>
    </div>
</div>

<!-- Grid de Videos -->
<div class="row">
    {% for video in videos %}
    <div class="col-md-4 mb-4">
        <div class="video-card">
            <div style="position: relative;">
                <img src="{{ video.thumbnail }}" class="video-thumbnail" alt="{{ video.titulo }}">
                <div class="play-overlay">
                    <i class="fas fa-play"></i>
                </div>
            </div>
            <div class="video-info">
                <div class="video-title">{{ video.titulo }}</div>
                <div class="video-stats">
                    <i class="fas fa-eye"></i> {{ video.views }} vistas
                    <span style="margin-left: 15px;">
                        <i class="fas fa-thumbs-up"></i> {{ video.likes }}
                    </span>
                </div>
            </div>
        </div>
    </div>
    {% endfor %}
</div>

<!-- Action Button -->
<div class="text-center mt-5">
    <a href="{% url 'subir_video' %}" class="btn btn-youtube btn-lg">
        <i class="fas fa-upload"></i> Subir Nuevo Video
    </a>
</div>
{% endblock %}

<!-- TEMPLATE: Subir Video a YouTube -->
{% extends 'videos/base.html' %}

{% block title %}Subir Video | YouTube Manager{% endblock %}

{% block content %}
<div class="container mt-5">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <!-- Header con ícono YouTube -->
            <div class="text-center mb-5">
                <i class="fab fa-youtube fa-4x text-danger mb-3"></i>
                <h1 class="display-4">📤 Subir Video a YouTube</h1>
                <p class="lead text-muted">Sube tu contenido directamente desde Django</p>
            </div>

            <!-- Card de formulario -->
            <div class="card shadow-lg border-0">
                <div class="card-header bg-gradient text-white">
                    <h4 class="mb-0"><i class="fas fa-upload"></i> Información del Video</h4>
                </div>
                <div class="card-body p-4">
                    <form method="post" enctype="multipart/form-data" id="uploadForm">
                        {% csrf_token %}
                        
                        <!-- Título -->
                        <div class="mb-4">
                            <label class="form-label fw-bold">
                                <i class="fas fa-heading text-danger"></i> Título del Video
                            </label>
                            <input type="text" name="titulo" class="form-control form-control-lg" 
                                   placeholder="Ej: Tutorial Django REST Framework 2026" required>
                            <small class="text-muted">Máximo 100 caracteres</small>
                        </div>

                        <!-- Descripción -->
                        <div class="mb-4">
                            <label class="form-label fw-bold">
                                <i class="fas fa-align-left text-danger"></i> Descripción
                            </label>
                            <textarea name="descripcion" class="form-control" rows="5" 
                                      placeholder="Describe de qué trata tu video..." required></textarea>
                            <small class="text-muted">Máximo 5000 caracteres</small>
                        </div>

                        <!-- Categoría -->
                        <div class="mb-4">
                            <label class="form-label fw-bold">
                                <i class="fas fa-folder text-danger"></i> Categoría
                            </label>
                            <select name="categoria" class="form-select form-select-lg">
                                <option value="22">People & Blogs</option>
                                <option value="27" selected>Education</option>
                                <option value="28">Science & Technology</option>
                                <option value="10">Music</option>
                                <option value="17">Sports</option>
                            </select>
                        </div>

                        <!-- Privacidad -->
                        <div class="mb-4">
                            <label class="form-label fw-bold">
                                <i class="fas fa-eye text-danger"></i> Privacidad
                            </label>
                            <div class="btn-group w-100" role="group">
                                <input type="radio" name="privacidad" value="private" class="btn-check" id="private" checked>
                                <label class="btn btn-outline-secondary" for="private">
                                    <i class="fas fa-lock"></i> Privado
                                </label>
                                
                                <input type="radio" name="privacidad" value="unlisted" class="btn-check" id="unlisted">
                                <label class="btn btn-outline-secondary" for="unlisted">
                                    <i class="fas fa-link"></i> No listado
                                </label>
                                
                                <input type="radio" name="privacidad" value="public" class="btn-check" id="public">
                                <label class="btn btn-outline-danger" for="public">
                                    <i class="fas fa-globe"></i> Público
                                </label>
                            </div>
                        </div>

                        <!-- Archivo de Video -->
                        <div class="mb-4">
                            <label class="form-label fw-bold">
                                <i class="fas fa-video text-danger"></i> Archivo de Video
                            </label>
                            <input type="file" name="video" class="form-control form-control-lg" 
                                   accept="video/*" required id="videoFile">
                            <small class="text-muted">Formatos: MP4, AVI, MOV, WMV. Máximo: 256 GB</small>
                            
                            <!-- Preview -->
                            <div id="videoPreview" class="mt-3 d-none">
                                <video class="w-100 rounded shadow-sm" controls></video>
                            </div>
                        </div>

                        <!-- Botones -->
                        <div class="d-grid gap-2 mt-5">
                            <button type="submit" class="btn btn-danger btn-lg shadow-lg">
                                <i class="fas fa-upload"></i> Subir a YouTube
                            </button>
                            <a href="{% url 'videos:mis_videos' %}" class="btn btn-outline-secondary btn-lg">
                                <i class="fas fa-arrow-left"></i> Cancelar
                            </a>
                        </div>
                    </form>
                </div>
            </div>

            <!-- Info de Cuota -->
            <div class="alert alert-info mt-4">
                <h6><i class="fas fa-info-circle"></i> Información de Cuota</h6>
                <p><strong>Subir un video consume 1,600 unidades de tu cuota diaria.</strong></p>
                <p class="mb-0">Límite diario: 10,000 unidades = Aproximadamente 6 videos/día</p>
            </div>
        </div>
    </div>
</div>

<script>
    // Preview de video antes de subir
    document.getElementById('videoFile').addEventListener('change', function(e) {
        const file = e.target.files[0];
        if (file) {
            const preview = document.getElementById('videoPreview');
            const video = preview.querySelector('video');
            const url = URL.createObjectURL(file);
            
            video.src = url;
            preview.classList.remove('d-none');
            
            // Mostrar info del archivo
            const sizeMB = (file.size / (1024 * 1024)).toFixed(2);
            console.log(`Archivo: ${file.name}, Tamaño: ${sizeMB} MB`);
        }
    });

    // Validar antes de enviar
    document.getElementById('uploadForm').addEventListener('submit', function(e) {
        const file = document.getElementById('videoFile').files[0];
        if (!file) {
            e.preventDefault();
            alert('Por favor selecciona un archivo de video');
            return;
        }
        
        // Confirmar subida
        if (!confirm('¿Estás seguro de subir este video a YouTube?')) {
            e.preventDefault();
        }
    });
</script>

<style>
    .bg-gradient {
        background: linear-gradient(135deg, #FF0000 0%, #CC0000 100%);
    }
</style>
{% endblock %}

<!-- TEMPLATE: Lista de Mis Videos -->
{% extends 'videos/base.html' %}

{% block title %}Mis Videos | YouTube Manager{% endblock %}

{% block content %}
<div class="container mt-5">
    <!-- Header -->
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h1><i class="fab fa-youtube text-danger"></i> Mis Videos</h1>
            <p class="text-muted">Gestiona tu biblioteca de videos de YouTube</p>
        </div>
        <a href="{% url 'videos:subir_video' %}" class="btn btn-danger btn-lg shadow-lg">
            <i class="fas fa-plus-circle"></i> Subir Nuevo Video
        </a>
    </div>

    <!-- Filtros -->
    <div class="card shadow-sm mb-4">
        <div class="card-body">
            <form method="get" class="row g-3">
                <div class="col-md-6">
                    <input type="text" name="buscar" class="form-control" 
                           placeholder="Buscar por título..." value="{{ request.GET.buscar }}">
                </div>
                <div class="col-md-3">
                    <select name="categoria" class="form-select">
                        <option value="">Todas las categorías</option>
                        <option value="programacion">Programación</option>
                        <option value="bases_datos">Bases de Datos</option>
                        <option value="redes">Redes</option>
                    </select>
                </div>
                <div class="col-md-3">
                    <button type="submit" class="btn btn-primary w-100">
                        <i class="fas fa-search"></i> Buscar
                    </button>
                </div>
            </form>
        </div>
    </div>

    <!-- Estadísticas Generales -->
    <div class="row mb-4">
        <div class="col-md-3">
            <div class="card text-center shadow-sm border-danger">
                <div class="card-body">
                    <h6 class="text-muted">Total Videos</h6>
                    <h2 class="text-danger">{{ videos.count }}</h2>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card text-center shadow-sm">
                <div class="card-body">
                    <h6 class="text-muted">Total Vistas</h6>
                    <h2 class="text-primary">{{ total_views|default:0 }}</h2>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card text-center shadow-sm">
                <div class="card-body">
                    <h6 class="text-muted">Total Likes</h6>
                    <h2 class="text-success">{{ total_likes|default:0 }}</h2>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card text-center shadow-sm">
                <div class="card-body">
                    <h6 class="text-muted">Comentarios</h6>
                    <h2 class="text-info">{{ total_comments|default:0 }}</h2>
                </div>
            </div>
        </div>
    </div>

    <!-- Tabla de Videos -->
    <div class="card shadow-lg border-0">
        <div class="card-header bg-dark text-white">
            <h5 class="mb-0"><i class="fas fa-list"></i> Lista de Videos</h5>
        </div>
        <div class="card-body p-0">
            {% if videos %}
            <div class="table-responsive">
                <table class="table table-hover mb-0">
                    <thead class="table-light">
                        <tr>
                            <th width="120">Thumbnail</th>
                            <th>Título</th>
                            <th width="100">Vistas</th>
                            <th width="100">Likes</th>
                            <th width="150">Publicado</th>
                            <th width="150">Acciones</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for video in videos %}
                        <tr>
                            <td>
                                <img src="{{ video.url_thumbnail }}" class="img-fluid rounded shadow-sm" 
                                     alt="{{ video.titulo }}" style="max-width: 100px;">
                            </td>
                            <td>
                                <strong>{{ video.titulo }}</strong>
                                <br>
                                <small class="text-muted">
                                    <i class="fas fa-user"></i> {{ video.canal_nombre }}
                                </small>
                            </td>
                            <td>
                                <span class="badge bg-primary">
                                    <i class="fas fa-eye"></i> {{ video.vistas }}
                                </span>
                            </td>
                            <td>
                                <span class="badge bg-success">
                                    <i class="fas fa-thumbs-up"></i> {{ video.likes }}
                                </span>
                            </td>
                            <td>{{ video.fecha_publicacion|date:"d/m/Y" }}</td>
                            <td>
                                <a href="{% url 'videos:detalle_video' video.id %}" 
                                   class="btn btn-sm btn-info">
                                    <i class="fas fa-eye"></i> Ver
                                </a>
                                <a href="https://www.youtube.com/watch?v={{ video.youtube_id }}" 
                                   target="_blank" class="btn btn-sm btn-danger">
                                    <i class="fab fa-youtube"></i> YouTube
                                </a>
                            </td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
            {% else %}
            <div class="text-center py-5">
                <i class="fas fa-video fa-4x text-muted mb-3"></i>
                <h4 class="text-muted">No hay videos aún</h4>
                <p>Sube tu primer video para comenzar</p>
                <a href="{% url 'videos:subir_video' %}" class="btn btn-danger">
                    <i class="fas fa-upload"></i> Subir Video
                </a>
            </div>
            {% endif %}
        </div>
    </div>

    <!-- Paginación -->
    {% if videos.has_other_pages %}
    <nav class="mt-4">
        <ul class="pagination justify-content-center">
            {% if videos.has_previous %}
            <li class="page-item">
                <a class="page-link" href="?page={{ videos.previous_page_number }}">Anterior</a>
            </li>
            {% endif %}
            
            {% for num in videos.paginator.page_range %}
            <li class="page-item {% if videos.number == num %}active{% endif %}">
                <a class="page-link" href="?page={{ num }}">{{ num }}</a>
            </li>
            {% endfor %}
            
            {% if videos.has_next %}
            <li class="page-item">
                <a class="page-link" href="?page={{ videos.next_page_number }}">Siguiente</a>
            </li>
            {% endif %}
        </ul>
    </nav>
    {% endif %}
</div>
{% endblock %}

<!-- TEMPLATE: Detalle de Video con Player Embebido -->
{% extends 'videos/base.html' %}

{% block title %}{{ video.titulo }} | YouTube Manager{% endblock %}

{% block content %}
<div class="container mt-5">
    <div class="row">
        <!-- Video Player -->
        <div class="col-lg-8">
            <!-- Player de YouTube embebido -->
            <div class="card shadow-lg border-0 mb-4">
                <div class="card-body p-0">
                    <div class="ratio ratio-16x9">
                        <iframe src="{{ video.get_embed_url }}" 
                                title="{{ video.titulo }}" 
                                allowfullscreen></iframe>
                    </div>
                </div>
            </div>

            <!-- Información del Video -->
            <div class="card shadow-sm mb-4">
                <div class="card-body">
                    <h2 class="mb-3">{{ video.titulo }}</h2>
                    
                    <!-- Stats en badges -->
                    <div class="mb-3">
                        <span class="badge bg-primary me-2">
                            <i class="fas fa-eye"></i> {{ video.vistas|default:0 }} vistas
                        </span>
                        <span class="badge bg-success me-2">
                            <i class="fas fa-thumbs-up"></i> {{ video.likes|default:0 }} likes
                        </span>
                        <span class="badge bg-info me-2">
                            <i class="fas fa-comments"></i> {{ video.comentarios|default:0 }} comentarios
                        </span>
                        <span class="badge bg-secondary">
                            <i class="fas fa-clock"></i> {{ video.duracion|default:"N/A" }}
                        </span>
                    </div>

                    <!-- Información del Canal -->
                    <div class="d-flex align-items-center mb-3 pb-3 border-bottom">
                        <i class="fab fa-youtube fa-3x text-danger me-3"></i>
                        <div>
                            <h5 class="mb-0">{{ video.canal_nombre }}</h5>
                            <small class="text-muted">{{ video.fecha_publicacion|date:"d M Y" }}</small>
                        </div>
                        <div class="ms-auto">
                            <a href="https://www.youtube.com/channel/{{ video.canal_id }}" 
                               target="_blank" class="btn btn-danger">
                                <i class="fab fa-youtube"></i> Ver Canal
                            </a>
                        </div>
                    </div>

                    <!-- Descripción -->
                    <div>
                        <h6 class="fw-bold">Descripción:</h6>
                        <p class="text-muted">{{ video.descripcion|linebreaks }}</p>
                    </div>

                    <!-- Etiquetas -->
                    {% if video.etiquetas %}
                    <div class="mt-3">
                        <h6 class="fw-bold">Etiquetas:</h6>
                        {% for tag in video.etiquetas.split ',' %}
                        <span class="badge bg-light text-dark me-1">#{{ tag|trim }}</span>
                        {% endfor %}
                    </div>
                    {% endif %}
                </div>
            </div>

            <!-- Botones de Acción -->
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="row g-2">
                        <div class="col-md-4">
                            <a href="https://www.youtube.com/watch?v={{ video.youtube_id }}" 
                               target="_blank" class="btn btn-danger w-100">
                                <i class="fab fa-youtube"></i> Ver en YouTube
                            </a>
                        </div>
                        <div class="col-md-4">
                            <button class="btn btn-primary w-100" onclick="compartir()">
                                <i class="fas fa-share-alt"></i> Compartir
                            </button>
                        </div>
                        <div class="col-md-4">
                            <a href="{% url 'videos:mis_videos' %}" class="btn btn-secondary w-100">
                                <i class="fas fa-arrow-left"></i> Volver
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Sidebar -->
        <div class="col-lg-4">
            <!-- Estadísticas Detalladas -->
            <div class="card shadow-sm mb-4">
                <div class="card-header bg-dark text-white">
                    <h6 class="mb-0"><i class="fas fa-chart-bar"></i> Estadísticas</h6>
                </div>
                <div class="card-body">
                    <div class="mb-3">
                        <label class="text-muted small">Visualizaciones</label>
                        <h4 class="text-primary">{{ video.vistas|default:0 }}</h4>
                        <div class="progress" style="height: 5px;">
                            <div class="progress-bar bg-primary" style="width: 100%"></div>
                        </div>
                    </div>
                    <div class="mb-3">
                        <label class="text-muted small">Me Gusta</label>
                        <h4 class="text-success">{{ video.likes|default:0 }}</h4>
                        <div class="progress" style="height: 5px;">
                            <div class="progress-bar bg-success" style="width: 85%"></div>
                        </div>
                    </div>
                    <div class="mb-3">
                        <label class="text-muted small">Comentarios</label>
                        <h4 class="text-info">{{ video.comentarios|default:0 }}</h4>
                        <div class="progress" style="height: 5px;">
                            <div class="progress-bar bg-info" style="width: 60%"></div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Información Técnica -->
            <div class="card shadow-sm mb-4">
                <div class="card-header bg-secondary text-white">
                    <h6 class="mb-0"><i class="fas fa-info-circle"></i> Información</h6>
                </div>
                <div class="card-body">
                    <dl class="row mb-0">
                        <dt class="col-sm-6">Video ID:</dt>
                        <dd class="col-sm-6"><code>{{ video.youtube_id }}</code></dd>
                        
                        <dt class="col-sm-6">Duración:</dt>
                        <dd class="col-sm-6">{{ video.duracion|default:"N/A" }}</dd>
                        
                        <dt class="col-sm-6">Categoría:</dt>
                        <dd class="col-sm-6">
                            <span class="badge bg-primary">{{ video.categoria }}</span>
                        </dd>
                        
                        <dt class="col-sm-6">Agregado por:</dt>
                        <dd class="col-sm-6">{{ video.agregado_por|default:"Sistema" }}</dd>
                        
                        <dt class="col-sm-6">Actualizado:</dt>
                        <dd class="col-sm-6">{{ video.actualizado|date:"d/m/Y H:i" }}</dd>
                    </dl>
                </div>
            </div>

            <!-- QR Code -->
            <div class="card shadow-sm">
                <div class="card-header bg-info text-white">
                    <h6 class="mb-0"><i class="fas fa-qrcode"></i> Código QR</h6>
                </div>
                <div class="card-body text-center">
                    <img src="https://api.qrserver.com/v1/create-qr-code/?size=200x200&data={{ video.url_video }}" 
                         alt="QR Code" class="img-fluid rounded shadow-sm">
                    <p class="text-muted small mt-2">Escanea para ver el video</p>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    function compartir() {
        const url = "{{ video.url_video }}";
        const titulo = "{{ video.titulo }}";
        
        if (navigator.share) {
            navigator.share({
                title: titulo,
                url: url
            }).then(() => {
                console.log('Compartido exitosamente');
            }).catch((error) => {
                console.error('Error al compartir:', error);
                copiarAlPortapapeles(url);
            });
        } else {
            copiarAlPortapapeles(url);
        }
    }

    function copiarAlPortapapeles(texto) {
        navigator.clipboard.writeText(texto).then(() => {
            alert('✅ URL copiada al portapapeles: ' + texto);
        }).catch((error) => {
            console.error('Error al copiar:', error);
        });
    }
</script>
{% endblock %}

{
    "error": {
        "code": 403,
        "message": "YouTube Data API v3 has not been used in project XXXXX"
    }
}

{
    "error": {
        "code": 401,
        "message": "Request had invalid authentication credentials"
    }
}

"error": "redirect_uri_mismatch"
"error_description": "The redirect URI in the request, http://localhost:8080/, does not match..."

"error": "invalid_grant"
"error_description": "Token has been expired or revoked."

{
    "error": {
        "code": 403,
        "message": "The request cannot be completed because you have exceeded your quota."
    }
}

ConnectionError: Connection reset by peer
or
TimeoutError: The read operation timed out

# 🎥 YouTube Video Manager - Django + YouTube Data API v3

## 📋 Descripción del Proyecto
Sistema de gestión de videos de YouTube integrado con Django que permite:
- Listar videos del canal automáticamente
- Subir videos directamente desde Django
- Ver estadísticas (vistas, likes, comentarios)
- Gestionar playlist
- Obtener metadatos de videos
- Panel de administración completo

## 👨‍🎓 Información del Alumno
- **Nombre Completo:** [TU NOMBRE]
- **Matrícula:** [TU MATRÍCULA]
- **Carrera:** [TU CARRERA]
- **Semestre:** [TU SEMESTRE]
- **Materia:** Servicios Web RESTful
- **Profesor:** [NOMBRE DEL PROFESOR]
- **Ciclo:** 2026-1

## 🚀 Tecnologías Utilizadas
- Python 3.x
- Django 4.2.x
- YouTube Data API v3
- Google OAuth 2.0
- google-api-python-client
- google-auth-oauthlib
- MySQL
- Bootstrap 5.3.0

## ⚙️ Instalación y Configuración

### 1. Clonar el repositorio
```bash
git clone [URL_DE_TU_REPO]
cd youtube_project
```

### 2. Crear entorno virtual
```bash
python -m venv venv
.\venv\Scripts\Activate  # Windows
source venv/bin/activate # Linux/Mac
```

### 3. Instalar dependencias
```bash
pip install -r requirements.txt
```

### 4. Configurar Google Cloud Console
1. Ve a https://console.cloud.google.com/
2. Crea un nuevo proyecto
3. Habilita "YouTube Data API v3"
4. Crea credenciales OAuth 2.0
5. Descarga client_secrets.json
6. Coloca el archivo en la raíz del proyecto

### 5. Configurar URIs de redirección
```
http://localhost:8000/oauth2callback
http://127.0.0.1:8000/oauth2callback
```

### 6. Aplicar migraciones
```bash
python manage.py makemigrations
python manage.py migrate
```

### 7. Crear superusuario
```bash
python manage.py createsuperuser
```

### 8. Ejecutar servidor
```bash
python manage.py runserver
```

### 9. Autenticarse con YouTube
- Visita http://127.0.0.1:8000/
- Clic en "Conectar con YouTube"
- Autoriza la aplicación con tu cuenta de Google
- Se generará token.pickle automáticamente

## 📸 Capturas de Pantalla
(Ver carpeta `screenshots/`)
1. Dashboard principal con videos
2. Formulario subir video
3. Lista de mis videos
4. Vista detallada con estadísticas
5. Google Cloud Console - API habilitada
6. OAuth consent screen

## 🧪 Pruebas Realizadas
- ✅ Autenticación OAuth 2.0 funcional
- ✅ Listar videos del canal
- ✅ Subir video a YouTube
- ✅ Obtener estadísticas en tiempo real
- ✅ Templates renderizando correctamente
- ✅ Refresh token automático

## 🔐 Seguridad
- ⚠️ `client_secrets.json` está en `.gitignore`
- ⚠️ `token.pickle` está en `.gitignore`
- ⚠️ Credenciales NO incluidas en el código
- ⚠️ OAuth 2.0 con scopes mínimos necesarios

## 📝 Notas Adicionales
- Cuota diaria: 10,000 unidades
- Subir video cuesta 1,600 unidades
- Verificar disponibilidad de cuota en Cloud Console

## 📚 Referencias
- YouTube Data API: https://developers.google.com/youtube/v3
- Google Cloud Console: https://console.cloud.google.com/
- Django Docs: https://docs.djangoproject.com/

## 📄 Licencia
Este proyecto es para fines educativos - UTH 2026-1

Django==4.2.9
google-api-python-client==2.110.0
google-auth==2.25.2
google-auth-oauthlib==1.2.0
google-auth-httplib2==0.2.0
mysqlclient==2.2.1

# NOTA: Genera el tuyo con:
# pip freeze > requirements.txt

# Python
__pycache__/
*.py[cod]
*.so
venv/
ENV/

# Django
*.log
db.sqlite3
/media
/staticfiles

# YouTube Credentials (CRÍTICO)
client_secrets.json
token.pickle
*.json
!client_secrets_TEMPLATE.json

# IDE
.vscode/
.idea/

# OS
.DS_Store
Thumbs.db

{
    "installed": {
        "client_id": "TU_CLIENT_ID_AQUI.apps.googleusercontent.com",
        "client_secret": "TU_CLIENT_SECRET_AQUI",
        "redirect_uris": [
            "http://localhost:8000/oauth2callback",
            "http://127.0.0.1:8000/oauth2callback"
        ],
        "auth_uri": "https://accounts.google.com/o/oauth2/auth",
        "token_uri": "https://oauth2.googleapis.com/token"
    }
}

from django.urls import path
from . import views

app_name = 'videos'

urlpatterns = [
    # Página principal (NO requiere autenticación)
    path('', views.inicio, name='inicio'),
    
    # OAuth 2.0 (NO requiere autenticación de Django)
    path('oauth/authorize/', views.oauth_authorize, name='oauth_authorize'),
    path('oauth/callback/', views.oauth_callback, name='oauth_callback'),
    path('oauth/logout/', views.oauth_logout, name='oauth_logout'),
    
    # Funcionalidades públicas
    path('buscar/', views.buscar_videos, name='buscar_videos'),
    path('video/<str:video_id>/', views.detalle_video, name='detalle_video'),
    
    # Funcionalidades que requieren OAuth
    path('mis-videos/', views.mis_videos, name='mis_videos'),
    path('subir/', views.subir_video, name='subir_video'),
    path('subir/procesar/', views.procesar_subida, name='procesar_subida'),
]

from functools import wraps
from django.shortcuts import redirect
from django.contrib import messages

def require_youtube_auth(view_func):
    """Decorador que verifica autenticación con YouTube OAuth (no Django auth)"""
    @wraps(view_func)
    def wrapper(request, *args, **kwargs):
        if 'youtube_credentials' not in request.session:
            messages.warning(request, 'Debes autorizar el acceso a YouTube primero.')
            return redirect('videos:oauth_authorize')
        return view_func(request, *args, **kwargs)
    return wrapper


# ========== USO CORRECTO ==========

# ❌ INCORRECTO (NO HACER ESTO):
from django.contrib.auth.decorators import login_required

@login_required  # ← ERROR: Requiere Django User
def subir_video(request):
    pass


# ✅ CORRECTO (HACER ESTO):
@require_youtube_auth  # ← BIEN: Solo verifica OAuth
def subir_video(request):
    context = {
        'youtube_conectado': True,
        'user_info': request.session.get('youtube_user_info', {}),
    }
    return render(request, 'videos/subir.html', context)

def inicio(request):
    """
    Dashboard principal - Accesible sin autenticación
    Muestra si el usuario está autenticado con YouTube OAuth
    """
    context = {
        'youtube_conectado': 'youtube_credentials' in request.session,
        'user_info': request.session.get('youtube_user_info', {}),
    }
    return render(request, 'videos/inicio.html', context)

from google_auth_oauthlib.flow import Flow
from django.conf import settings

def oauth_authorize(request):
    """
    Inicia el flujo OAuth 2.0 - NO requiere autenticación de Django
    Redirige a Google para autorización
    """
    try:
        # Configurar el flujo OAuth
        flow = Flow.from_client_secrets_file(
            settings.GOOGLE_CLIENT_SECRETS_FILE,
            scopes=settings.YOUTUBE_SCOPES,
            redirect_uri=settings.GOOGLE_REDIRECT_URI
        )
        
        # Generar URL de autorización
        authorization_url, state = flow.authorization_url(
            access_type='offline',
            include_granted_scopes='true',
            prompt='consent'
        )
        
        # Guardar state en sesión para verificación
        request.session['oauth_state'] = state
        
        return redirect(authorization_url)
        
    except Exception as e:
        messages.error(request, f'Error al iniciar OAuth: {str(e)}')
        return redirect('videos:inicio')

from google.oauth2.credentials import Credentials
from googleapiclient.discovery import build

def oauth_callback(request):
    """
    Callback de OAuth - Recibe el código de autorización
    NO requiere autenticación de Django
    """
    try:
        # Verificar state para prevenir CSRF
        state = request.session.get('oauth_state')
        if not state:
            raise ValueError('Estado OAuth no encontrado en sesión')
        
        # Configurar el flujo OAuth
        flow = Flow.from_client_secrets_file(
            settings.GOOGLE_CLIENT_SECRETS_FILE,
            scopes=settings.YOUTUBE_SCOPES,
            state=state,
            redirect_uri=settings.GOOGLE_REDIRECT_URI
        )
        
        # Obtener código de autorización
        authorization_response = request.build_absolute_uri()
        flow.fetch_token(authorization_response=authorization_response)
        
        # Guardar credenciales en sesión
        credentials = flow.credentials
        request.session['youtube_credentials'] = {
            'token': credentials.token,
            'refresh_token': credentials.refresh_token,
            'token_uri': credentials.token_uri,
            'client_id': credentials.client_id,
            'client_secret': credentials.client_secret,
            'scopes': credentials.scopes
        }
        
        # Obtener información del canal del usuario
        youtube = build('youtube', 'v3', credentials=credentials)
        channels_response = youtube.channels().list(
            mine=True,
            part='snippet,statistics'
        ).execute()
        
        if channels_response.get('items'):
            channel = channels_response['items'][0]
            request.session['youtube_user_info'] = {
                'channel_title': channel['snippet']['title'],
                'channel_id': channel['id'],
                'thumbnail': channel['snippet']['thumbnails']['default']['url'],
                'subscribers': channel['statistics'].get('subscriberCount', 'N/A')
            }
        
        messages.success(request, '¡Autenticación exitosa con YouTube!')
        return redirect('videos:inicio')
        
    except Exception as e:
        messages.error(request, f'Error en callback OAuth: {str(e)}')
        return redirect('videos:inicio')

import os

# ========== YOUTUBE API 2026 ==========
YOUTUBE_API_KEY = 'AIzaSyXXXXXXXXXXXXXXXXXXXXXXXXX'  # Reemplazar con tu API Key

# OAuth 2.0 Client Secrets
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
GOOGLE_CLIENT_SECRETS_FILE = os.path.join(BASE_DIR, 'client_secrets.json')

# Redirect URI (DEBE coincidir con Google Cloud Console)
GOOGLE_REDIRECT_URI = 'http://localhost:8000/oauth/callback/'

# Scopes de YouTube
YOUTUBE_SCOPES = [
    'https://www.googleapis.com/auth/youtube',
    'https://www.googleapis.com/auth/youtube.upload',
    'https://www.googleapis.com/auth/youtube.readonly',
    'https://www.googleapis.com/auth/yt-analytics.readonly',
]

# Media files para uploads
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'

# Sessions (REQUERIDO para OAuth)
SESSION_ENGINE = 'django.contrib.sessions.backends.db'
SESSION_COOKIE_AGE = 86400  # 24 horas

# ⚠️ IMPORTANTE: NO agregar LOGIN_URL (causa error 404)
# Esta app NO usa django.contrib.auth
# Solo usa OAuth de Google

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <title>YouTube API - UTH 2026</title>
</head>
<body>
    <h1>🎥 YouTube Video Manager</h1>
    
    <!-- Estado de Conexión -->
    {% if youtube_conectado %}
        <div style="background:#d4edda; padding:15px; border-radius:5px;">
            <h2>✅ Conectado a YouTube</h2>
            {% if user_info %}
                <p><strong>Canal:</strong> {{ user_info.channel_title }}</p>
                <p><strong>Suscriptores:</strong> {{ user_info.subscribers }}</p>
            {% endif %}
            
            <a href="{% url 'videos:mis_videos' %}">📹 Mis Videos</a> |
            <a href="{% url 'videos:subir_video' %}">⬆️ Subir Video</a> |
            <a href="{% url 'videos:oauth_logout' %}">🚪 Cerrar Sesión</a>
        </div>
    {% else %}
        <div style="background:#fff3cd; padding:15px; border-radius:5px;">
            <h2>⚠️ No conectado</h2>
            <p>Necesitas autorizar el acceso a tu cuenta de YouTube</p>
            <a href="{% url 'videos:oauth_authorize' %}" 
               style="padding:10px 20px; background:#ff0000; color:white; text-decoration:none; border-radius:5px;">
                🔐 Conectar con YouTube
            </a>
        </div>
    {% endif %}
    
    <hr style="margin:30px 0;">
    
    <!-- Búsqueda (PÚBLICA - sin autenticación) -->
    <h3>🔍 Buscar Videos</h3>
    <form action="{% url 'videos:buscar_videos' %}" method="get">
        <input type="text" name="q" placeholder="Buscar videos en YouTube..." style="padding:10px; width:300px;">
        <button type="submit" style="padding:10px 20px;">Buscar</button>
    </form>
</body>
</html>