Added profile picture field to Widget User, added completed details page for...

Added profile picture field to Widget User, added completed details page for every user, added some basic CSS to the homepage and to the details pages

widget_tee_jays_angelos/homepage/migrations/0003_alter_department_dept_name_and_more.py

+# Generated by Django 4.0.3 on 2022-04-05 13:57
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('homepage', '0002_widgetuser_email_widgetuser_id_num_department'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='department',
+            name='dept_name',
+            field=models.CharField(max_length=50, null=True),
+        ),
+        migrations.AlterField(
+            model_name='department',
+            name='home_unit',
+            field=models.CharField(max_length=50, null=True),
+        ),
+        migrations.AlterField(
+            model_name='widgetuser',
+            name='first_name',
+            field=models.CharField(max_length=50, null=True),
+        ),
+        migrations.AlterField(
+            model_name='widgetuser',
+            name='last_name',
+            field=models.CharField(max_length=50, null=True),
+        ),
+        migrations.AlterField(
+            model_name='widgetuser',
+            name='middle_name',
+            field=models.CharField(max_length=50, null=True),
+        ),
+    ]

widget_tee_jays_angelos/homepage/migrations/0004_remove_widgetuser_email.py

+# Generated by Django 4.0.3 on 2022-05-08 04:48
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('homepage', '0003_alter_department_dept_name_and_more'),
+    ]
+
+    operations = [
+        migrations.RemoveField(
+            model_name='widgetuser',
+            name='email',
+        ),
+    ]

widget_tee_jays_angelos/homepage/migrations/0005_widgetuser_email.py

+# Generated by Django 4.0.3 on 2022-05-08 05:02
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('homepage', '0004_remove_widgetuser_email'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='widgetuser',
+            name='email',
+            field=models.CharField(max_length=50, null=True),
+        ),
+    ]

widget_tee_jays_angelos/homepage/migrations/0006_widgetuser_picture.py

+# Generated by Django 4.0.3 on 2022-05-08 08:04
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('homepage', '0005_widgetuser_email'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='widgetuser',
+            name='picture',
+            field=models.ImageField(null=True, upload_to=None),
+        ),
+    ]

widget_tee_jays_angelos/homepage/migrations/0007_alter_widgetuser_picture.py

+# Generated by Django 4.0.3 on 2022-05-08 08:16
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('homepage', '0006_widgetuser_picture'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='widgetuser',
+            name='picture',
+            field=models.ImageField(null=True, upload_to='media'),
+        ),
+    ]

widget_tee_jays_angelos/homepage/migrations/0008_alter_widgetuser_picture.py

+# Generated by Django 4.0.3 on 2022-05-10 06:41
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('homepage', '0007_alter_widgetuser_picture'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='widgetuser',
+            name='picture',
+            field=models.ImageField(blank=True, null=True, upload_to='media'),
+        ),
+    ]

widget_tee_jays_angelos/homepage/migrations/0009_alter_widgetuser_picture.py

+# Generated by Django 4.0.3 on 2022-05-10 07:07
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('homepage', '0008_alter_widgetuser_picture'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='widgetuser',
+            name='picture',
+            field=models.ImageField(blank=True, null=True, upload_to='static/media/'),
+        ),
+    ]

widget_tee_jays_angelos/homepage/migrations/0010_alter_widgetuser_picture.py

+# Generated by Django 4.0.3 on 2022-05-10 07:10
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('homepage', '0009_alter_widgetuser_picture'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='widgetuser',
+            name='picture',
+            field=models.ImageField(blank=True, null=True, upload_to='homepage/static/media/'),
+        ),
+    ]

widget_tee_jays_angelos/homepage/migrations/0011_alter_widgetuser_picture.py

+# Generated by Django 4.0.3 on 2022-05-10 14:04
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('homepage', '0010_alter_widgetuser_picture'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='widgetuser',
+            name='picture',
+            field=models.ImageField(blank=True, null=True, upload_to='media/'),
+        ),
+    ]

widget_tee_jays_angelos/homepage/models.py

@@ -3,11 +3,12 @@ from django.db import models
 
 
 class WidgetUser(models.Model):
-    first_name = models.CharField(max_length=50)
-    middle_name = models.CharField(max_length=50)
-    last_name = models.CharField(max_length=50)
+    first_name = models.CharField(max_length=50, null=True)
+    middle_name = models.CharField(max_length=50, null=True)
+    last_name = models.CharField(max_length=50, null=True)
     id_num = models.CharField(max_length=7, null=True)
     email = models.CharField(max_length=50, null=True)
+    picture = models.ImageField(upload_to="media/", height_field=None, width_field=None, max_length=100, null=True, blank=True)
 
     def __str__(self):
         return self.last_name + ", " + self.first_name
@@ -16,8 +17,8 @@ class WidgetUser(models.Model):
 class Department(models.Model):
     widget_user = models.ForeignKey(WidgetUser, on_delete=models.CASCADE,
                                     blank=True, null=True)
-    dept_name = models.CharField(max_length=50)
-    home_unit = models.CharField(max_length=50)
+    dept_name = models.CharField(max_length=50, null=True)
+    home_unit = models.CharField(max_length=50, null=True)
 
     def __str__(self):
         return self.dept_name + ", " + self.home_unit

widget_tee_jays_angelos/homepage/static/homepage/homepagestyle.css

+h1, h2 {
+    color: black;
+    font-family: 'Montserrat', sans-serif;
+}
+li {
+    color: black;
+    font-family: 'Source Sans Pro', sans-serif;
+}
+p {
+    font-family: 'Source Sans Pro', sans-serif;
+    font-size: 18px;
+}
+img {
+    position: absolute;
+    left: 400px;
+    top: 20px;
+    border-radius: 50%;
+}
+.picShadow {
+    height: 200px;
+    width: 200px;
+    border-radius: 50%;
+    background-color: grey;
+    position: absolute;
+    left: 390px;
+    top: 30px;
+}
+.detailsHeaderName {
+    color: black;
+    position: absolute;
+    left: 650px;
+    top: 70px;
+}
+.detailsHeaderDept {
+    font-family: 'Source Sans Pro', sans-serif;
+    color: black;
+    font-style: italic;
+    position: absolute;
+    left: 650px;
+    top: 120px;
+    font-weight: lighter;
+}
+.rectangleHeader {
+    position: absolute;
+    left: 0px;
+    top: 0px;
+    height: 250px;
+    width: 100%;
+    background-color: #daeaf6;
+}

widget_tee_jays_angelos/homepage/templates/homepage/base.html

+{% load static %}
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+    <head>
+        <meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <link rel="preconnect" href="https://fonts.googleapis.com">
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+        <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@700&display=swap" rel="stylesheet">
+        <link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro&display=swap" rel="stylesheet">
+        <link rel="stylesheet" type="text/css" href="{% static 'homepage/homepagestyle.css' %}">
+        <title>Homepage</title>
+    </head>
+    <body>
+        {% block content %}
+
+        {% endblock %}
+    </body>
+</html>

widget_tee_jays_angelos/homepage/templates/homepage/details.html

+{% extends "homepage/base.html "%}
+{% block content %}
+    {% if user %}
+        <div class="rectangleHeader"></div>
+        <h1 class="detailsHeaderName">{{ user.first_name }} {{ user.last_name }}</h1>
+        <h3 class="detailsHeaderDept">Department of {{ userDept.dept_name }}</h3>
+        <h2 style="position: absolute; left: 300px; top: 270px;">Personal Information</h2>
+        <p style="position:absolute; left: 300px; top: 325px;">Complete Name: {{ user.last_name }}, {{user.first_name }} {{ user.middle_name }}</p>
+        <p style="position:absolute; left: 300px; top: 370px;">ID Number: {{ user.id_num }}</p>
+        <h2 style="position: absolute; left: 300px; top: 450px;">Department Information</h2>
+        <p style="position: absolute; left: 300px; top: 500px;">Department: {{ userDept.dept_name }}</p>
+        <p style="position: absolute; left: 300px; top: 545px;">Home Unit: {{ userDept.home_unit }}</p>
+        <h2 style="position: absolute; left: 850px; top: 270px;">Contact Details</h2>
+        <p style="position: absolute; left: 850px; top: 325px;">Email: {{ user.email }}</p>
+        <div class="picShadow"></div>
+        <img src="{{ user.picture.url }}" width="200" height="200">
+    {% else %}
+        <p>User not found.</p>
+    {% endif %}
+{% endblock %}

widget_tee_jays_angelos/homepage/templates/homepage/index.html

+{% extends "homepage/base.html" %}
+{% block content %}
+    <title>Widget Users</title>
+    <h1>Widget Users: </h1>
+    {% if user_list %}
+        <ol type="1">
+            {% for user in user_list %}
+                <li><a href="/homepage/users/{{ user.id }}/details">{{ user.last_name }}, {{ user.first_name }} {{ user.middle_name }}</a></li>
+            {% endfor %}
+        </ol>
+    {% else %}
+        <p>No users found.</p>
+    {% endif %}
+{% endblock %}

widget_tee_jays_angelos/homepage/urls.py

 from django.urls import path
-
 from . import views
 
 urlpatterns = [
-    path('', views.index, name="homepage")
+    path('', views.index, name="homepage"),
+    path('users/<int:user_id>/details/', views.details, name="details"),
 ]

widget_tee_jays_angelos/homepage/views.py

-from django.http import HttpResponse
+from django.http import HttpResponse, Http404
 from homepage.models import WidgetUser, Department
+from django.shortcuts import render
+from django.template import loader
 
 # Create your views here.
 
 
 def index(request):
-    entries = WidgetUser.objects.all().count()
-    n = 1
-    users = "WIDGET USERS:<br/>"
-    while (n <= entries):
-        userLastName = WidgetUser.objects.get(pk=n).last_name
-        userFirstName = WidgetUser.objects.get(pk=n).first_name
-        userMiddleName = WidgetUser.objects.get(pk=n).middle_name
-        userIdNum = WidgetUser.objects.get(pk=n).id_num
-        userEmail = WidgetUser.objects.get(pk=n).email
-        userDept = Department.objects.get(widget_user=n).dept_name
-        userHome = Department.objects.get(widget_user=n).home_unit
-        users = users + userLastName + ", " + userFirstName + " " + userMiddleName + ": " + userIdNum + ", " + userEmail + ", " + userDept + ", " + userHome + "<br/>"
-        n += 1
+    user_list = WidgetUser.objects.order_by("last_name")
+    context = {
+        "user_list": user_list,
+    }
 
-    return HttpResponse(users)
+    return render(request, "homepage/index.html", context)
+
+
+def details(request, user_id):
+    try:
+        user = WidgetUser.objects.get(pk=user_id)
+        userDept = Department.objects.get(widget_user=user)
+    except WidgetUser.DoesNotExist:
+        raise Http404("User does not exist.")
+    context = {
+        "user": user,
+        "userDept": userDept,
+    }
+    return render(request, "homepage/details.html", context)

widget_tee_jays_angelos/widget_tee_jays_angelos/settings.py

@@ -123,7 +123,11 @@ USE_TZ = True
 # Static files (CSS, JavaScript, Images)
 # https://docs.djangoproject.com/en/4.0/howto/static-files/
 
-STATIC_URL = 'static/'
+STATIC_URL = '/static/'
+
+MEDIA_URL = '/images/'
+
+MEDIA_ROOT = os.path.join(BASE_DIR, 'static/images')
 
 # Default primary key field type
 # https://docs.djangoproject.com/en/4.0/ref/settings/#default-auto-field

widget_tee_jays_angelos/widget_tee_jays_angelos/urls.py

@@ -15,6 +15,8 @@ Including another URLconf
 """
 from django.contrib import admin
 from django.urls import include, path
+from django.conf import settings
+from django.conf.urls.static import static
 
 urlpatterns = [
     path('forum/', include("forum.urls")),
@@ -22,5 +24,6 @@ urlpatterns = [
     path('homepage/', include("homepage.urls")),
     path('announcements/', include("announcements.urls")),
     path('admin/', admin.site.urls),
-    
 ]
+
+urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)