Issue#433

apps/commons/templates/header.html

@@ -44,6 +44,11 @@
           Empleo
       </a>
 
+      <a class="navbar-item {% is_active 'learn:index' %}" href="{% url 'learn:index' %}">
+          <i class="fas fa-graduation-cap"></i>
+          Aprende
+      </a>
+
       {% if request.user.is_authenticated %}
         <a class="navbar-item {% is_active 'members:homepage' %}" href="{% url 'members:profile' %}">
           <i class="fas fa-user-cog"></i>

apps/learn/admin.py

@@ -0,0 +1,19 @@
+from django.contrib import admin
+
+from . import models
+
+
+class LabelAdmin(admin.ModelAdmin):
+    prepopulated_fields = {'slug': ('name',)}
+
+
+admin.site.register(models.Label, LabelAdmin)
+
+
+class ResourceAdmin(admin.ModelAdmin):
+    prepopulated_fields = {'slug': ('name',)}
+    list_display = ('name', 'url')
+    filter_horizontal = ('labels',)
+
+
+admin.site.register(models.Resource, ResourceAdmin)

apps/learn/apps.py

@@ -0,0 +1,6 @@
+from django.apps import AppConfig
+
+
+class LearnConfig(AppConfig):
+    default_auto_field = 'django.db.models.BigAutoField'
+    name = 'apps.learn'

apps/learn/colors.py

@@ -0,0 +1,27 @@
+import random
+import string
+from typing import Tuple
+
+BLACK = '000000'
+WHITE = 'FFFFFF'
+
+
+def get_rgb_from_hex(value: str) -> Tuple[int, int, int, int]:
+    red = int(value[:2], base=16)
+    green = int(value[2:4], base=16)
+    blue = int(value[4:6], base=16)
+    alpha = int(value[6:8], base=16) if len(value) > 6 else 255
+    return red, green, blue, alpha
+
+
+def get_luminance(red, green, blue, alpha) -> int:
+    luminance = 0.2126 * red + 0.7152 * green + 0.0722 * blue
+    luminance *= alpha / 255
+    return round(luminance)
+
+
+def get_random_hex_color(include_alpha=False):
+    size = 8 if include_alpha else 6
+    return ''.join(
+        random.choice(string.hexdigits.upper()) for _ in range(size)
+    )

apps/learn/converters.py

@@ -0,0 +1,16 @@
+from django.core.exceptions import ObjectDoesNotExist
+
+from .models import Label
+
+
+class LabelConverter:
+    regex = '[-a-zA-Z0-9_]+'
+
+    def to_python(self, value: str) -> Label:
+        try:
+            return Label.objects.get(slug=value)
+        except ObjectDoesNotExist as err:
+            raise ValueError('This label does not exist!') from err
+
+    def to_url(self, value: Label) -> str:
+        return value.slug

apps/learn/migrations/0001_initial.py

@@ -0,0 +1,32 @@
+# Generated by Django 3.2.13 on 2022-06-02 18:01
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    initial = True
+
+    dependencies = [
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='Label',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('name', models.CharField(max_length=120)),
+                ('slug', models.SlugField(max_length=120, unique=True)),
+            ],
+        ),
+        migrations.CreateModel(
+            name='Resource',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('name', models.CharField(max_length=120)),
+                ('slug', models.SlugField(max_length=120, unique=True)),
+                ('url', models.URLField(max_length=240)),
+                ('labels', models.ManyToManyField(related_name='resources', to='learn.Label')),
+            ],
+        ),
+    ]

apps/learn/migrations/0002_auto_20220602_1951.py

@@ -0,0 +1,21 @@
+# Generated by Django 3.2.13 on 2022-06-02 18:51
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('learn', '0001_initial'),
+    ]
+
+    operations = [
+        migrations.AlterModelOptions(
+            name='label',
+            options={'ordering': ['name']},
+        ),
+        migrations.AlterModelOptions(
+            name='resource',
+            options={'ordering': ['name']},
+        ),
+    ]

apps/learn/migrations/0003_label_color.py

@@ -0,0 +1,18 @@
+# Generated by Django 3.2.13 on 2022-06-22 18:39
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('learn', '0002_auto_20220602_1951'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='label',
+            name='color',
+            field=models.CharField(default='FF0000', max_length=8),
+        ),
+    ]

apps/learn/migrations/0004_alter_label_color.py

@@ -0,0 +1,18 @@
+# Generated by Django 3.2.13 on 2022-06-23 08:00
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('learn', '0003_label_color'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='label',
+            name='color',
+            field=models.CharField(default='EEBDDE', max_length=8),
+        ),
+    ]

apps/learn/models.py

@@ -0,0 +1,43 @@
+import re
+
+from django.db import models
+
+from . import colors
+
+
+class Label(models.Model):
+    class Meta:
+        ordering = ['name']
+
+    name = models.CharField(max_length=120)
+    slug = models.SlugField(max_length=120, unique=True)
+    # Label color in hex mode
+    color = models.CharField(
+        max_length=8, default=colors.get_random_hex_color()
+    )
+
+    def __str__(self):
+        return self.name
+
+    @property
+    def foreground_color(self):
+        rgb_color = colors.get_rgb_from_hex(self.color)
+        luminance = colors.get_luminance(*rgb_color)
+        return colors.BLACK if luminance > 128 else colors.WHITE
+
+    def save(self, *args, **kwargs):
+        self.color = re.sub(r'^#', '', self.color)
+        super().save(*args, **kwargs)
+
+
+class Resource(models.Model):
+    class Meta:
+        ordering = ['name']
+
+    name = models.CharField(max_length=120)
+    slug = models.SlugField(max_length=120, unique=True)
+    url = models.URLField(max_length=240)
+    labels = models.ManyToManyField(to=Label, related_name='resources')
+
+    def __str__(self):
+        return self.name

apps/learn/static/learn/css/main.scss

@@ -0,0 +1,55 @@
+@import 'apps/commons/static/commons/css/base';
+
+a.label {
+  display: inline-block;
+  font-size: 13px;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  padding-left: 9px;
+  padding-right: 9px;
+  border-radius: 10px;
+
+  &:hover {
+    background-color: #154360 !important;
+    color: white !important;
+  }
+
+  span.badge {
+    background-color: rgba(255, 255, 255, 0.518);
+    margin-left: 3px;
+    border-radius: 12px;
+    padding-top: 2px;
+    padding-bottom: 2px;
+    padding-left: 4px;
+    padding-right: 4px;
+    font-size: 12px;
+  }
+}
+
+ul {
+  margin-top: 1rem;
+}
+
+.learn-index {
+  ul li i {
+    padding-right: 10px;
+  }
+
+  .label {
+    font-size: 1rem;
+    margin-bottom: 0.5rem;
+  }
+}
+
+.learn-resources_by_label {
+  a.resource {
+    margin-right: 1rem;
+  }
+
+  ul.resources {
+    li {
+      list-style: initial;
+      margin-left: 20px;
+    }
+  }
+}

apps/learn/templates/learn/base.html

@@ -0,0 +1,7 @@
+{% extends "base.html" %}
+
+{% load utils %}
+
+{% block style %}
+  <link rel="stylesheet" href="{{ assets|get_asset_key:'learn/custom.min.css' }}">
+{% endblock style %}

apps/learn/templates/learn/index.html

@@ -0,0 +1,28 @@
+{% extends "learn/base.html" %}
+
+{% load utils %}
+
+{% block title %}Aprende Python - {{ block.super }}{% endblock %}
+
+{% block body_class %}learn-index{% endblock %}
+
+{% block content %}
+
+<h1 class="title">Aprende Python</h1>
+
+<p>En esta sección podrás encontrar <strong>recursos de aprendizaje Python</strong>. Están clasificados por etiquetas:</p>
+
+<ul>
+  {% for label in labels %}
+    <li>
+        <a class="label"
+           style="background-color: #{{ label.color }}; color: #{{ label.foreground_color }}"
+           href="{% url "learn:resources_by_label" label=label %}">
+           {{ label }}
+           <span class="badge">{{ label.resources.all.count }}</span>
+        </a>
+    </li>  
+  {% endfor %}
+</ul>
+
+{% endblock content %}

apps/learn/templates/learn/resources_by_label.html

@@ -0,0 +1,35 @@
+{% extends "learn/base.html" %}
+
+{% load utils %}
+
+{% block title %}Aprende Python - {{ block.super }}{% endblock %}
+
+{% block body_class %}learn-resources_by_label{% endblock %}
+
+{% block content %}
+
+<nav class="breadcrumb" aria-label="breadcrumbs">
+  <ul>
+    <li><a href="{% url "learn:index" %}">Aprende Python</a></li>
+    <li class="is-active"><a href="#" aria-current="page">{{ label }}</a></li>
+  </ul>
+</nav>
+
+<h1 class="title"><i class="fas fa-tag"></i> {{ label }}</h1>
+
+<ul class="resources">
+  {% for resource in resources %}
+    <li>
+      <a class="resource" href="{{ resource.url }}">{{ resource }}</a>
+      {% for label in resource.labels.all %}
+        <a class="label"
+           style="background-color: #{{ label.color }}; color: #{{ label.foreground_color }}"
+           href="{% url "learn:resources_by_label" label=label %}">
+           {{ label }}
+        </a>
+      {% endfor %}
+    </li>  
+  {% endfor %}
+</ul>
+
+{% endblock content %}

apps/learn/tests.py

@@ -0,0 +1,3 @@
+from django.test import TestCase
+
+# Create your tests here.

apps/learn/urls.py

@@ -0,0 +1,17 @@
+from django.urls import path, register_converter
+
+from . import views
+from .converters import LabelConverter
+
+app_name = 'learn'
+
+register_converter(LabelConverter, 'label')
+
+urlpatterns = [
+    path('', views.index, name='index'),
+    path(
+        'labels/<label:label>/',
+        views.resources_by_label,
+        name='resources_by_label',
+    ),
+]

apps/learn/views.py

@@ -0,0 +1,17 @@
+from django.shortcuts import render
+
+from .models import Label
+
+
+def index(request):
+    labels = Label.objects.prefetch_related('resources').all()
+    return render(request, 'learn/index.html', {'labels': labels})
+
+
+def resources_by_label(request, label):
+    resources = label.resources.prefetch_related('labels').all()
+    return render(
+        request,
+        'learn/resources_by_label.html',
+        {'label': label, 'resources': resources},
+    )