Adding new feature of friend request

PrivatePing/settings/development.py

@@ -42,4 +42,4 @@
 
 DOMAIN = "http://localhost:8000"
 
-CSRF_TRUSTED_ORIGINS = ["http://localhost:8000", "http://127.0.0.1:8000"]
+CSRF_TRUSTED_ORIGINS = ["http://localhost:8000"]

README.md

@@ -4,6 +4,7 @@
 </div>
 
 [![Website Status](https://img.shields.io/website?url=https%3A%2F%2Fprivateping.plutoweb.live)](https://privateping.plutoweb.live)
+[![first-timers](https://img.shields.io/badge/first--timers--friendly-blue.svg?style=flat-square)](https://www.firsttimersonly.com/)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
 PrivatePing is a secure messaging application built on Python's Django framework, providing end-to-end encryption for messages exchanged between users. It leverages HTML, CSS, JavaScript, SubtleCrypto API, channels, and Redis to ensure secure communication channels.

assets/css/chat/FriendRequest.css

@@ -0,0 +1,14 @@
+#request-text {
+    margin-top: 15rem;
+    font-size: 2rem;
+    color: #050d55;
+    font-weight: bold;
+    font-family: 'Nunito', sans-serif;
+    text-align: center;
+}
+
+.request-button{
+    /* increase size of button */
+    padding: 20px 25px;
+    border-radius: 12px;
+}

assets/css/registration/Login.css

@@ -144,3 +144,9 @@ html {
 #password-button.active {
   display: block;
 }
+
+.back-btn{
+  margin-top:5rem; 
+  border-radius: 50%;
+  opacity: 0.8;
+}

assets/css/registration/Signup.css

@@ -182,3 +182,9 @@ html {
 #password-field-2 {
   display: none;
 }
+
+.back-btn{
+  margin-top:3rem; 
+  border-radius: 50%;
+  opacity: 0.8;
+}

assets/css/registration/registration_home.css

@@ -103,7 +103,6 @@ html {
   flex-direction: column;
   background-color: #f0f0f0;
   font-family: "Nunito", sans-serif;
-  overflow: hidden;
 }
 
 .container {

assets/js/chat/Base.js

@@ -149,4 +149,15 @@ $(document).ready(function() {
     })
 });
 
+//limit note length
+$(document).ready(function() {
+    $('#note').on('keyup', function(){
+        var note = $('#note').val();
+        if(note.length > 100){
+            $('#note').val(note.substring(0, 100));
+        }
+    })
+});
+
+
 parent.document.title = "PrivatePing - A Secure Chat Room";

assets/js/registration/Login.js

@@ -56,4 +56,10 @@ window.addEventListener("load", function () {
   $("#Maincontent").delay(500).fadeIn();
 });
 
+//goback
+function goback(){
+  window.history.back();
+
+}
+
 parent.document.title = "PrivatePing - Login";

assets/js/registration/Signup.js

@@ -164,4 +164,10 @@ window.addEventListener("load", function () {
   $("#Maincontent").delay(500).fadeIn();
 });
 
+//goback
+function goback(){
+  window.history.back();
+
+}
+
 parent.document.title = "PrivatePing - Signup";

assets/js/registration/registration_home.js

@@ -3,8 +3,9 @@ document.getElementById("credits").style.display = "none";
 
 // Hide the loader when the page is fully loaded
 window.addEventListener("load", function () {
-  $("#pageloader").fadeOut();
-  $("#Maincontent").delay(500).fadeIn();
-  $("#credits").delay(500).fadeIn();
+    $("#pageloader").fadeOut();
+    $("#Maincontent").delay(500).fadeIn();
+    $("#credits").delay(500).fadeIn();
+
 });
 parent.document.title = "PrivatePing: A secure messaging Application";

chat/migrations/0003_remove_userprofile_email_userprofile_user.py

@@ -0,0 +1,25 @@
+# Generated by Django 5.0.2 on 2024-03-24 19:02
+
+import django.db.models.deletion
+from django.conf import settings
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('chat', '0002_alter_friends_friend_delete_messages'),
+        migrations.swappable_dependency(settings.AUTH_USER_MODEL),
+    ]
+
+    operations = [
+        migrations.RemoveField(
+            model_name='userprofile',
+            name='email',
+        ),
+        migrations.AddField(
+            model_name='userprofile',
+            name='user',
+            field=models.OneToOneField(blank=True, default=None, null=True, on_delete=django.db.models.deletion.CASCADE, to=settings.AUTH_USER_MODEL),
+        ),
+    ]

chat/migrations/0004_alter_userprofile_user.py

@@ -0,0 +1,21 @@
+# Generated by Django 5.0.2 on 2024-03-24 19:02
+
+import django.db.models.deletion
+from django.conf import settings
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('chat', '0003_remove_userprofile_email_userprofile_user'),
+        migrations.swappable_dependency(settings.AUTH_USER_MODEL),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='userprofile',
+            name='user',
+            field=models.OneToOneField(blank=True, default=None, null=True, on_delete=django.db.models.deletion.CASCADE, to=settings.AUTH_USER_MODEL),
+        ),
+    ]

chat/migrations/0005_friends_accepted.py

@@ -0,0 +1,18 @@
+# Generated by Django 5.0.2 on 2024-03-25 06:43
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('chat', '0004_alter_userprofile_user'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='friends',
+            name='accepted',
+            field=models.BooleanField(default=False),
+        ),
+    ]

chat/migrations/0006_friends_note.py

@@ -0,0 +1,18 @@
+# Generated by Django 5.0.2 on 2024-03-26 10:43
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('chat', '0005_friends_accepted'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='friends',
+            name='note',
+            field=models.CharField(blank=True, default='', max_length=100),
+        ),
+    ]

chat/models.py

@@ -1,12 +1,11 @@
 from django.db import models
-from django.utils import timezone
-
+from django.contrib.auth.models import User
 
 class UserProfile(models.Model):
 
     id = models.AutoField(primary_key=True, unique=True, editable=False, blank=True)
+    user = models.OneToOneField(User, on_delete=models.CASCADE, default=None, null=True, blank=True)
     name = models.CharField(max_length=25)
-    email = models.EmailField(unique=True)
     username = models.CharField(max_length=20, unique=True)
     online = models.IntegerField(default=0)
     online_for = models.ForeignKey('self', on_delete=models.CASCADE, null=True, blank=True)
@@ -20,6 +19,8 @@ class Friends(models.Model):
     id = models.AutoField(primary_key=True, unique=True, editable=False, blank=True)
     user = models.ForeignKey(UserProfile, on_delete=models.CASCADE)
     friend = models.ForeignKey(UserProfile, on_delete=models.CASCADE, related_name="friend")
+    note = models.CharField(max_length=100, blank=True, default="")
+    accepted = models.BooleanField(default=False)
 
     def __str__(self):
         return f"{self.user} - {self.friend}"

chat/templates/chat/Base.html

@@ -92,7 +92,10 @@ <h5 class="modal-title" id="Add friend">Connect to a User</h5>
                             <small>Please enter exact username (Case-sensitive)</small>
                             <br />
                             <input class="add-user-input" type="text" placeholder="Enter username" name="friend" id="finduser"
-                                 autocomplete="off" /><br /><br />
+                                 autocomplete="off" /><br /><br /><br>
+                            <small><b>Note:</b></small><br>
+                            <textarea type="text" name="note" id="note" placeholder="Optional" autocomplete="off" ></textarea><br /><br />
+                            <small>A note will be sent along with the friend request.</small><br>
                             <button type="submit" id="adduserbutton" class="btn btn-outline-primary">
                                 <i class="fa fa-plus"></i> Add
                             </button>
@@ -126,17 +129,21 @@ <h3 class="top-nav-header">
         <div class="friends" style="overflow-y: auto">
             <ul class="list-group">
                 {% for friend in friends %}
-                <a href="http://{{ request.get_host }}/waiting-room?user={{friend.username}}">
-                    <li class="list-group-item list-group-item-action">
+                <a href="http://{{ request.get_host }}/waiting-room?user={{friend.friend.username}}">
+                    {% if friend.accepted == True %}
+                        <li class="list-group-item list-group-item-action">
+                    {% else %}
+                        <li style="opacity: 0.5;" class="list-group-item list-group-item-action">
+                    {% endif %}
                         <div class="row">
                             <div class="col">
                                 <img style="border-radius: 50%"
-                                    src="https://ui-avatars.com/api/?background=random&color=fff&name={{friend.name}}"
+                                    src="https://ui-avatars.com/api/?background=random&color=fff&name={{friend.friend.name}}"
                                     style="width: 50px; height: 50px" />
                             </div>
                             <div class="col">
                                 <div class="row">
-                                    <p>{{friend.name}}</p>
+                                    <p>{{friend.friend.name}}</p>
                                 </div>
                             </div>
                         </div>
@@ -210,7 +217,7 @@ <h2>Privacy is a <u>Fundamental</u> Right!</h2>
             event.preventDefault();
             var username = $("#finduser").val();
 
-            window.location.href = "/addfriend/" + escapeHtml(username);
+            window.location.href = "/addfriend/" + escapeHtml(username) + "?note="+escapeHtml($("#note").val());
         });
     </script>
 
@@ -363,6 +370,7 @@ <h2>Privacy is a <u>Fundamental</u> Right!</h2>
 
             //get the public key from cookie
             var public_key = getCookie("public_key");
+            console.log(public_key);
 
             //base64 utf-8 decode
             public_key = decodeURIComponent(escape(window.atob(public_key)));

chat/templates/chat/FriendRequest.html

@@ -0,0 +1,66 @@
+{% extends "chat/Base.html" %}
+{% load static %}
+
+{% block content %}
+<style>
+    i.size {
+       font-size: 100px;
+    }
+ </style>
+<link rel="stylesheet" href="{% static 'css/chat/FriendRequest.css' %}">
+<div class="text-center">
+    <h1 id="request-text">You have received friend request from: <u>{{RequestFrom}}</u></h1>
+    {% if note %}
+    <h5>Request Note: <b>{{note}}</b></h5>
+    {% endif %}
+    <br>
+    <button class="btn btn-outline-success request-button" id="accept-button"><i class="fa-solid fa-check"></i> </button>
+    Accept
+
+    &nbsp;&nbsp;&nbsp;
+
+    <button class="btn btn-outline-danger request-button" id="reject-button"><i class="fa-solid fa-xmark"></i></button>
+    Reject
+</div>
+
+<script>
+    //Ajax request to accept or reject friend request
+    document.getElementById("accept-button").addEventListener("click", function () {
+        $.ajax({
+            type: "POST",
+            url: "{% url 'chat:FriendRequest' %}",
+            data: {
+                'csrfmiddlewaretoken': "{{ csrf_token }}",
+                'request_from': "{{RequestFrom}}",
+                'action': "accept"
+
+            },
+            success: function (data) {
+                alert("Friend request accepted");
+                window.location.href = "{% url 'chat:dashboard' %}";
+            }
+        });
+    });
+
+    document.getElementById("reject-button").addEventListener("click", function () {
+        $.ajax({
+            type: "POST",
+            url: "{% url 'chat:FriendRequest' %}",
+            data: {
+                'csrfmiddlewaretoken': "{{ csrf_token }}",
+                'request_from': "{{RequestFrom}}",
+                'action': "reject"
+
+            },
+            success: function (data) {
+                alert("Friend request rejected");
+                window.location.href = "{% url 'chat:dashboard' %}";
+            }
+        });
+    });
+
+</script>
+
+<script type="text/javascript" src="{% static 'js/chat/waiting_room.js' %}"></script>
+
+{% endblock %}

chat/tools.py

@@ -7,7 +7,7 @@ def getFriendsList(id):
         friends = Friends.objects.filter(user=user)
         friend_list = []
         for i in friends:
-            friend_list.append(i.friend)
+            friend_list.append(i)
         return friend_list
     except:
         return []

chat/urls.py

@@ -8,6 +8,7 @@
     path("dashboard", views.index, name="dashboard"),
     path("addfriend/<str:name>", views.addFriend, name="addFriend"),
     path("chat/<str:username>", views.chat, name="chat"),
+    path("request", views.FriendRequest, name="FriendRequest"),
     path('waiting-room', views.waiting_room, name="waiting-room"),
     path('api/room', views.room, name='room'),