Dev

.github/workflows/quality-pipeline.yml

@@ -645,7 +645,7 @@ jobs:
           FAIL=0
 
           if find . \( -name "*.js" -o -name "*.ts" -o -name "*.vue" -o -name "*.py" -o -name "*.java" \) \
-            -not -path "*/node_modules/*" -not -path "*/dist/*" 2>/dev/null | grep -q .; then
+            -not -path "*/node_modules/*" -not -path "*/dist/*" -not -path "*/tests/*" -not -path "*/.venv/*" 2>/dev/null | grep -q .; then
             DETECTED=1
           else
             DETECTED=0
@@ -654,22 +654,22 @@ jobs:
           # Unconditional frontend router guard bypass
           if grep -rEn "next\(true\)|beforeEach.*return true|navigate\(.*\{.*replace.*\}\)" \
             --include="*.js" --include="*.ts" --include="*.vue" . 2>/dev/null \
-            | grep -v node_modules | grep -v "//"; then
+            | grep -vE "node_modules|tests/|\.venv|dist/" | grep -v "//"; then
             echo "::warning::Possible unconditional navigation guard bypass detected"
           fi
 
           # Hardcoded passwords / tokens
           if grep -rEn "password\s*[=:]\s*['\"][^'\"]{4,}['\"]" \
             --include="*.js" --include="*.ts" --include="*.vue" --include="*.py" --include="*.java" \
             . 2>/dev/null \
-            | grep -v node_modules \
+            | grep -vE "node_modules|tests/|\.venv|dist/" \
             | grep -v "//" \
             | grep -vE "[[:space:]]:[a-zA-Z][a-zA-Z0-9_-]*=" \
             | grep -q .; then
             grep -rEn "password\s*[=:]\s*['\"][^'\"]{4,}['\"]" \
               --include="*.js" --include="*.ts" --include="*.vue" --include="*.py" --include="*.java" \
               . 2>/dev/null \
-              | grep -v node_modules | grep -v "//" \
+              | grep -vE "node_modules|tests/|\.venv|dist/" | grep -v "//" \
               | grep -vE "[[:space:]]:[a-zA-Z][a-zA-Z0-9_-]*="
             echo "::error::Hardcoded password value detected in source code"
             FAIL=1
@@ -678,22 +678,22 @@ jobs:
           # eval() / exec() usage
           if grep -rEn "\beval\(|\bexec\(" \
             --include="*.js" --include="*.ts" --include="*.vue" --include="*.py" \
-            . 2>/dev/null | grep -v node_modules | grep -v "//"; then
+            . 2>/dev/null | grep -vE "node_modules|tests/|\.venv|dist/" | grep -v "//"; then
             echo "::warning::eval()/exec() usage detected — review for potential code injection risk"
           fi
 
           # Disabled SSL/TLS certificate verification
           if grep -rEn "rejectUnauthorized\s*:\s*false|verify\s*=\s*False|ssl_verify\s*=\s*false" \
             --include="*.js" --include="*.ts" --include="*.py" --include="*.java" \
-            . 2>/dev/null | grep -v node_modules | grep -v "//"; then
+            . 2>/dev/null | grep -vE "node_modules|tests/|\.venv|dist/" | grep -v "//"; then
             echo "::error::SSL/TLS certificate verification disabled — man-in-the-middle attack risk"
             FAIL=1
           fi
 
           # Sensitive tokens in URL query strings
           if grep -rEn "[?&](token|api_key|apikey|access_token|secret)=" \
             --include="*.js" --include="*.ts" --include="*.vue" --include="*.py" \
-            . 2>/dev/null | grep -v node_modules | grep -v "//"; then
+            . 2>/dev/null | grep -vE "node_modules|tests/|\.venv|dist/" | grep -v "//"; then
             echo "::warning::Sensitive token/key passed in URL query string — use Authorization header instead."
           fi
 

Dockerfile

@@ -12,4 +12,4 @@ EXPOSE 8000
 
 RUN python manage.py collectstatic --noinput
 
-CMD python3 manage.py migrate --fake-initial && gunicorn web.wsgi:application --bind 0.0.0.0:${PORT:-8000} --timeout 90
+CMD python3 manage.py migrate --fake-initial && python3 manage.py load_municipalities && gunicorn web.wsgi:application --bind 0.0.0.0:${PORT:-8000} --timeout 90

Templates/Details/details_base.html

@@ -48,7 +48,6 @@ <h1 class="main-title">{{ content.title }}</h1>
                                 data-contingut-id="{{ content.contingut.id }}"
                                 data-api-id="{{ api.id }}">
                             {{ api.name|default:api.port }}
-                            <span class="api-stats"></span>
                         </button>
                     {% empty %}
                         <span style="font-size: 12px; color: var(--tm);">{% trans "No hay información de API disponible." %}</span>
@@ -137,15 +136,35 @@ <h4>{% trans "Deja tu opinión" %}</h4>
 <div id="history-toast" class="toast-notification">✅ {% trans "Añadido a tu historial" %}</div>
 
 <script>
+function getCookie(name) {
+    let cookieValue = null;
+    if (document.cookie && document.cookie !== '') {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            if (cookie.substring(0, name.length + 1) === (name + '=')) {
+                cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
+                break;
+            }
+        }
+    }
+    return cookieValue;
+}
+
 document.addEventListener('DOMContentLoaded', () => {
-    // 1. Lógica del botón de favoritos (Seguir / Dejar de seguir)
     const favoriteBtn = document.getElementById('btn-save');
     if (favoriteBtn) {
         favoriteBtn.addEventListener('click', function() {
             const targetUrl = this.getAttribute('data-url');
+            const csrftoken = getCookie('csrftoken');
+
             fetch(targetUrl, {
                 method: 'POST',
-                headers: { 'X-CSRFToken': '{{ csrf_token }}', 'Content-Type': 'application/json' }
+                headers: {
+                    'X-CSRFToken': csrftoken,
+                    'Content-Type': 'application/json',
+                    'X-Requested-With': 'XMLHttpRequest'
+                }
             })
             .then(response => response.json())
             .then(data => {
@@ -155,44 +174,50 @@ <h4>{% trans "Deja tu opinión" %}</h4>
         });
     }
 
-    // 2. Lógica de tracking asíncrono de clics en plataformas (Issue #24)
-    const platformButtons = document.querySelectorAll('.track-platform-btn');
-    const toast = document.getElementById('history-toast');
-
-    platformButtons.forEach(btn => {
-        btn.addEventListener('click', function() {
-            const contingutId = this.getAttribute('data-contingut-id');
-            const apiId = this.getAttribute('data-api-id');
-            const statsSpan = this.querySelector('.api-stats');
-
-            fetch("{% url 'register_platform_click' %}", {
-                method: 'POST',
-                headers: {
-                    'X-CSRFToken': '{{ csrf_token }}',
-                    'Content-Type': 'application/json'
-                },
-                body: JSON.stringify({ contingut_id: contingutId, api_id: apiId })
-            })
-            .then(response => {
-                if (!response.ok) throw new Error('Error en el registro del clic');
-                return response.json();
-            })
-            .then(data => {
-                if (data.status === 'success') {
-                    // Feedback visual inmediato en el botón e inyección de la métrica
-                    this.classList.add('clicked');
-                    statsSpan.innerText = `(${data.total_clicks} views)`;
-
-                    // Disparar el banner flotante (Toast)
-                    toast.classList.add('show');
-                    setTimeout(() => {
-                        toast.classList.remove('show');
-                    }, 3000);
-                }
-            })
-            .catch(error => console.error('Error tracking click:', error));
+    // 2. Lógica de plataformas según si el usuario está logueado o no
+    {% if user.is_authenticated %}
+        // Si ESTÁ logueado: Rastreamos el clic y mostramos el Toast
+        const platformButtons = document.querySelectorAll('.track-platform-btn');
+        const toast = document.getElementById('history-toast');
+
+        platformButtons.forEach(btn => {
+            btn.addEventListener('click', function() {
+                const contingutId = this.getAttribute('data-contingut-id');
+                const apiId = this.getAttribute('data-api-id');
+                const csrftoken = getCookie('csrftoken');
+
+                fetch("{% url 'register_platform_click' %}", {
+                    method: 'POST',
+                    headers: {
+                        'X-CSRFToken': csrftoken,
+                        'Content-Type': 'application/json',
+                        'X-Requested-With': 'XMLHttpRequest'
+                    },
+                    body: JSON.stringify({ contingut_id: contingutId, api_id: apiId })
+                })
+                .then(response => {
+                    if (!response.ok) throw new Error('Error en el registro del clic');
+                    return response.json();
+                })
+                .then(data => {
+                    if (data.status === 'success') {
+                        toast.classList.add('show');
+                        setTimeout(() => {
+                            toast.classList.remove('show');
+                        }, 3000);
+                    }
+                })
+                .catch(error => console.error('Error tracking click:', error));
+            });
+        });
+    {% else %}
+        const platformButtons = document.querySelectorAll('.track-platform-btn');
+        platformButtons.forEach(btn => {
+            btn.addEventListener('click', function() {
+                window.location.href = "{% url 'login' %}";
+            });
         });
-    });
+    {% endif %}
 });
 </script>
 {% endblock %}

Templates/Details/details_serie.html

@@ -17,4 +17,27 @@
 {% endif %}
 {% endblock %}
 
-{% block favorite_url %}{% url 'toggle_series_favorite' content.id %}{% endblock %}
+{% block favorite_url %}{% url 'toggle_series_favorite' content.id %}{% endblock %}
+
+{% block extra_main_content %}
+<div class="recommendations-section" style="margin: 30px 0;">
+    <h3 class="section-title">{% trans "También te puede gustar..." %}</h3>
+    <div class="recommendations-grid" style="display: flex; gap: 15px; overflow-x: auto; padding-bottom: 10px;">
+        {% for rec in recommendations %}
+            <a href="{% url 'series_detail' rec.id %}" style="text-decoration: none; color: white; min-width: 140px;">
+                {% if rec.poster_path %}
+                    <img src="{{ rec.poster_path }}" alt="{{ rec.title }}" style="width: 140px; height: 210px; object-fit: cover; border-radius: 8px;">
+                {% else %}
+                    <div style="width: 140px; height: 210px; background: rgba(255,255,255,0.05); border-radius: 8px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 10px;">
+                        {{ rec.title }}
+                    </div>
+                {% endif %}
+                <p style="font-size: 0.9rem; margin-top: 8px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">{{ rec.title }}</p>
+            </a>
+        {% empty %}
+            <!-- Mensaje de Fallback -->
+            <p style="color: rgba(255,255,255,0.5);">{% trans "No hay recomendaciones disponibles." %}</p>
+        {% endfor %}
+    </div>
+</div>
+{% endblock %}

Templates/base.html

@@ -125,7 +125,7 @@
             </a>
         </div>
         {% endif %}
-
+        <!-- 
         <div class="menu-search">
             <div class="search-input-container">
                 <svg class="search-icon" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"
@@ -136,6 +136,7 @@
                 <input type="text" class="search-input" placeholder="{% trans 'Search...' %}">
             </div>
         </div>
+        -->
     </nav>
 
     <!-- Overlay -->
@@ -174,7 +175,11 @@ <h5>{% trans "Legal" %}</h5>
                 </div>
                 <div class="col-md-3 mb-4">
                     <h5>{% trans "Contact" %}</h5>
-                    <p>info@StreamSync.com</p>
+                    <p> 
+                        <a href="mailto:info@StreamSync.com">
+                            info@StreamSync.com
+                        </a>
+                    </p>
                     <p>+34 600 000 000</p>
                 </div>
             </div>

Templates/identify/register.html

@@ -101,6 +101,51 @@ <h1>{% trans "Create Account" %}</h1>
             {% endfor %}
         </div>
 
+                <div class="form-group">
+            <select name="gender" id="id_gender" required>
+                <option value="">{% trans "Select gender" %}</option>
+                {% for value, label in form.gender.field.choices %}
+                    <option value="{{ value }}">{{ label }}</option>
+                {% endfor %}
+            </select>
+            {% for error in form.gender.errors %}
+            <small style="color: #e50914; font-size: 12px;">{{ error }}</small>
+            {% endfor %}
+        </div>
+
+        <div class="form-group">
+            <select name="age_range" id="id_age_range" required>
+                <option value="">{% trans "Select age range" %}</option>
+                {% for value, label in form.age_range.field.choices %}
+                    <option value="{{ value }}">{{ label }}</option>
+                {% endfor %}
+            </select>
+            {% for error in form.age_range.errors %}
+            <small style="color: #e50914; font-size: 12px;">{{ error }}</small>
+            {% endfor %}
+        </div>
+
+        <div class="form-group">
+            <select name="province" id="id_province" required>
+                <option value="">{% trans "Select province" %}</option>
+                {% for province in provinces %}
+                    <option value="{{ province.id }}">{{ province.name }}</option>
+                {% endfor %}
+            </select>
+            {% for error in form.province.errors %}
+            <small style="color: #e50914; font-size: 12px;">{{ error }}</small>
+            {% endfor %}
+        </div>
+
+        <div class="form-group">
+            <select name="municipality" id="id_municipality" required disabled>
+                <option value="">{% trans "First select a province" %}</option>
+            </select>
+            {% for error in form.municipality.errors %}
+            <small style="color: #e50914; font-size: 12px;">{{ error }}</small>
+            {% endfor %}
+        </div>
+
         <div class="checkbox-group">
             <input type="checkbox" name="terms_accepted" id="id_terms_accepted" required>
             <label for="id_terms_accepted">
@@ -203,6 +248,31 @@ <h1>{% trans "Create Account" %}</h1>
         });
     });
 
+    document.getElementById('id_province').addEventListener('change', function() {
+        const provinceId = this.value;
+        const municipalitySelect = document.getElementById('id_municipality');
+        municipalitySelect.innerHTML = '<option value="">{% filter escapejs %}{% trans "Loading..." %}{% endfilter %}</option>';
+        municipalitySelect.disabled = true;
+
+        if (!provinceId) {
+            municipalitySelect.innerHTML = '<option value="">{% filter escapejs %}{% trans "First select a province" %}{% endfilter %}</option>';
+            return;
+        }
+
+        fetch('/api/municipalities/' + provinceId + '/')
+            .then(response => response.json())
+            .then(municipalities => {
+                municipalitySelect.innerHTML = '<option value="">{% filter escapejs %}{% trans "Select municipality" %}{% endfilter %}</option>';
+                municipalities.forEach(m => {
+                    municipalitySelect.innerHTML += '<option value="' + m.id + '">' + m.name + '</option>';
+                });
+                municipalitySelect.disabled = false;
+            })
+            .catch(() => {
+                municipalitySelect.innerHTML = '<option value="">{% filter escapejs %}{% trans "Error loading municipalities" %}{% endfilter %}</option>';
+            });
+    });
+
     /* document.getElementById('registerForm').addEventListener('submit', function (e) {
         e.preventDefault();
 

Templates/paginator.html

@@ -0,0 +1,44 @@
+{% load i18n %}
+
+<nav aria-label="Page navigation">
+    <ul class="pagination justify-content-center mb-0 custom-pagination">
+        {% if items.has_previous %}
+            <li class="page-item">
+                <a class="page-link text-white-50 bg-transparent border-secondary" href="?page=1{% if request.GET.platform %}&platform={{ request.GET.platform }}{% endif %}{% if request.GET.date %}&date={{ request.GET.date }}{% endif %}" aria-label="{% trans 'Primera' %}">
+                    <span aria-hidden="true">&laquo;&laquo;</span>
+                </a>
+            </li>
+            <li class="page-item">
+                <a class="page-link text-white-50 bg-transparent border-secondary" href="?page={{ items.previous_page_number }}{% if request.GET.platform %}&platform={{ request.GET.platform }}{% endif %}{% if request.GET.date %}&date={{ request.GET.date }}{% endif %}" aria-label="{% trans 'Anterior' %}">
+                    <span aria-hidden="true">&laquo;</span>
+                </a>
+            </li>
+        {% endif %}
+
+        <li class="page-item active" aria-current="page">
+            <span class="page-link text-neon bg-dark border-secondary" style="border-color: var(--neon-cyan) !important;">
+                {% trans "Pàgina" %} {{ items.number }} {% trans "de" %} {{ items.paginator.num_pages }}
+            </span>
+        </li>
+
+        {% if items.has_next %}
+            <li class="page-item">
+                <a class="page-link text-white-50 bg-transparent border-secondary" href="?page={{ items.next_page_number }}{% if request.GET.platform %}&platform={{ request.GET.platform }}{% endif %}{% if request.GET.date %}&date={{ request.GET.date }}{% endif %}" aria-label="{% trans 'Següent' %}">
+                    <span aria-hidden="true">&raquo;</span>
+                </a>
+            </li>
+            <li class="page-item">
+                <a class="page-link text-white-50 bg-transparent border-secondary" href="?page={{ items.paginator.num_pages }}{% if request.GET.platform %}&platform={{ request.GET.platform }}{% endif %}{% if request.GET.date %}&date={{ request.GET.date }}{% endif %}" aria-label="{% trans 'Última' %}">
+                    <span aria-hidden="true">&raquo;&raquo;</span>
+                </a>
+            </li>
+        {% endif %}
+    </ul>
+</nav>
+
+<style>
+    .custom-pagination .page-link:hover {
+        background-color: rgba(102, 252, 241, 0.1) !important;
+        color: var(--neon-cyan) !important;
+    }
+</style>