Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/main'
Browse files Browse the repository at this point in the history
  • Loading branch information
4darsh-Dev committed Jan 31, 2024
2 parents f5a4cb2 + 6881912 commit 2567531
Show file tree
Hide file tree
Showing 14 changed files with 178 additions and 119 deletions.
6 changes: 2 additions & 4 deletions api/home/urls.py
Original file line number Diff line number Diff line change
@@ -1,13 +1,11 @@
from django.contrib import admin
from django.urls import path,include
from django.urls import path, include
from home import views

urlpatterns = [
path("", views.index, name="home"),
path("faqs/", views.faqs, name="faqs"),

path("popup_detect/", views.popup_detect, name="popup_detect"),
path("report-dp/", views.reportDp, name="report-dp"),

path("about/", views.about, name="about"),
]

26 changes: 15 additions & 11 deletions api/home/views.py
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
from django.shortcuts import render,redirect
from django.shortcuts import render, redirect
from .popup_detect_ml import predict
from django.http import JsonResponse
from json import dump
Expand All @@ -8,27 +8,29 @@

# Create your views here.


def index(request):
return render(request, "index.html")


def faqs(request):
return render(request, "faqs.html")


def popup_detect(request):
# img = data_url_to_image(request.GET.get('img', ''))
# return JsonResponse(dump(predict(img)))

#get image data url
img = request.GET.get('img', '')

if(img == ""):
return JsonResponse({"error" : "data url empty"})
# get image data url
img = request.GET.get("img", "")

if img == "":
return JsonResponse({"error": "data url empty"})

#convert dataurl to PIL
img=data_url_to_image(img)
# convert dataurl to PIL
img = data_url_to_image(img)

#predict the result using trained ml algo
# predict the result using trained ml algo
result = predict(img)

# return the results
Expand All @@ -37,7 +39,7 @@ def popup_detect(request):

def data_url_to_image(data_url):
# Remove the header of the data URL
header, base64_str = data_url.split(',')
header, base64_str = data_url.split(",")

# Decode the base64 string to bytes
decoded_image = base64.b64decode(base64_str)
Expand All @@ -49,9 +51,11 @@ def data_url_to_image(data_url):
img = Image.open(image_data)

return img



def reportDp(request):
return render(request, "report.html")


def about(request):
return render(request, "about.html")
12 changes: 12 additions & 0 deletions api/static/css/about.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
* {
font-family: var(--font-secondary);
}
.content-section section {
display: flex;
align-items: center;
gap: 5rem;
}
.cogniguard-ss {
height: 30rem;
border: 1px solid var(--color-primary);
}
38 changes: 20 additions & 18 deletions api/static/css/faqs.css
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
.content-section {
gap: 3rem;
margin: 4rem 2rem;
}
.faqs-heading {
display: flex;
flex-direction: column;
Expand All @@ -10,6 +14,9 @@
align-items: center;
gap: 2rem;
}
.faqs-section h1 {
font-weight: lighter;
}
.faqs {
display: flex;
gap: 4rem;
Expand All @@ -29,36 +36,31 @@
padding: 0.5rem;
display: flex;
align-items: center;
/* border: 2px solid black; */
border-radius: 10px;
justify-content: space-between;
height: 3rem;
transition: 4s;
}
.faq-button {
cursor: pointer;
transform: rotate(90deg);
transition: rotate 0.3s ease-in-out;
transition: rotate 0.35s ease-in-out;
}

.faq-answer {
padding: 0.5rem;
opacity: 0;
display: none;
height: 0;
transform: translateY(-40px);
border: 2px solid black;
transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out,
height 0.3s ease-in-out;
border-radius: 10px;
z-index: -1;
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease-in-out;
}
.faq-ques-text {
text-align: center;
}
.rotate {
transform: rotate(0deg);
}
.show {
display: inline-block;
opacity: 1;
height: auto;
visibility: visible;
transform: translateY(0);
z-index: 1;
.hide.show {
display: block;
border: 2px solid black;
padding: 0.5rem;
}
1 change: 1 addition & 0 deletions api/static/css/report.css
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
}
.content-section {
gap: 3rem;
padding-left: 30rem;
}
.heading-section {
display: flex;
Expand Down
20 changes: 12 additions & 8 deletions api/static/css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@
--color-primary-light: rgba(36, 87, 197, 0.3);
--color-secondary: #469a3f;
--font-ex-small: 0.4rem;
--font-small: 0.625rem;
--font-mid-medium: 1.25rem;
--font-small: 0.75rem;
--font-mid-medium: 1.5rem;
--font-medium: 2rem;
--font-mid-large: 2.5rem;
--font-large: 3rem;
Expand Down Expand Up @@ -102,7 +102,7 @@ ul {
.main-section {
display: flex;
align-items: flex-start;

/* gap: 2rem;
padding: 0 2.87rem; */
}
Expand All @@ -113,7 +113,7 @@ ul {
align-items: center;
margin: 6rem 2rem 2rem 4rem;
gap: 8rem;
padding-left: 21rem;
padding-left: 20rem;
}
/* navbar */
.navbar {
Expand All @@ -128,9 +128,9 @@ ul {
border-radius: 1rem;
gap: 2rem;
position: fixed;
background: white;gap: 2rem;
background: white;
gap: 2rem;
height: 558px;

}
.navbar__logo img {
height: 5.75rem;
Expand Down Expand Up @@ -196,12 +196,13 @@ footer {
.footer-links {
display: flex;
gap: 2rem;
margin-bottom: 0.5rem;
}
.footer-links img {
height: 2.5rem !important;
}
.footer-design img {
height: 4rem;
.footer-design i {
font-size: 2rem;
}
.footer-text {
display: flex;
Expand Down Expand Up @@ -232,6 +233,9 @@ footer {
display: flex;
gap: 3rem;
}
.base-design {
width: 27rem;
}
/* speedometer */
/* .gauge {
position: relative;
Expand Down
Binary file added api/static/img/cogniguard-popup.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Empty file added api/static/js/about.js
Empty file.
56 changes: 24 additions & 32 deletions api/static/js/app.js
Original file line number Diff line number Diff line change
@@ -1,36 +1,28 @@
// function setSpeed(speed) {
// const needle = document.getElementById('needle')
// needle.style.transform = `rotate(${speed}deg)`
// }
// let transparencyScore = prompt('Enter transparency Score (0-100)')
// // adjusting according to transparency score
// if (transparencyScore >= 8) {
// setSpeed(270)
// } else if (transparencyScore <= 4) {
// setSpeed(90)
// } else {
// setSpeed(0)
// }
// animation
const img = document.querySelector('.animate-img')
const p = document.querySelector('.animate-p')
console.log(img.getBoundingClientRect().top, img.offsetHeight)
const animate = (element) => {
const footer = document.querySelector('footer')
const navbar = document.querySelector('.navbar')
const contentScetion = document.querySelector('.content-section')
let flag = true
document.addEventListener('scroll', () => {
console.log(
window.scrollY,
window.innerHeight,
window.scrollY + window.innerHeight,
footer.offsetTop
)
if (
window.scrollY >
element.getBoundingClientRect().top + element.offsetHeight
window.scrollY + window.innerHeight >= footer.offsetTop &&
flag === true
) {
element.classList.add('animate')
}
if (
window.scrollY <
element.getBoundingClientRect().top + element.offsetHeight + 100
navbar.style.position = 'absolute'
navbar.style.top = footer.offsetTop - navbar.scrollHeight - 50 + 'px'
flag = false
} else if (
flag === false &&
window.scrollY + window.innerHeight < footer.offsetTop
) {
element.classList.remove('animate')
navbar.style.position = 'fixed'
navbar.style.top = null
flag = true
}
}
const animateAll = () => {
animate(img)
animate(p)
}
document.addEventListener('scroll', animateAll)
})
// scrllY + innerHeight = offsetHeight
9 changes: 7 additions & 2 deletions api/static/js/faqs.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,12 @@ faqs.forEach((faq) => {
} else {
faqContent.style.maxHeight = faqContent.scrollHeight + 100 + 'px'
}

faqContent.classList.toggle('show')
if (faqContent.classList.contains('show')) {
setTimeout(() => {
faqContent.classList.remove('show')
}, 250)
} else {
faqContent.classList.add('show')
}
})
})
32 changes: 32 additions & 0 deletions api/templates/about.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
{% extends "base.html" %}
{% load static %}
{% block head %}
<link rel="stylesheet" href="{% static "css/about.css" %}">
{% endblock head %}

{% block title %}About{% endblock title %}

{% block content %}
<section class="content-section">
<section>
<img class="cogniguard-ss" src="{%static "img/cogniguard-popup.png"%}" alt="web-extension-picture">
<div>
<p class="font-medium">
<span class="blue-text font-mid-large font-secondary">Cogniguard</span> is a lightweight but powerful web extension designed to combat
deceptive tactics and promote transparency online.
</p>
</div>
</section>
<section>
<span class="font-medium">
<p>It empowers you by</p>
<span class="font-mid-medium"> Identifying dark patterns: Uncovers hidden manipulation techniques used by websites, particularly in e-commerce.
</span>
</span>
</section>
</section>
{% endblock content %}

{% block script %}
<script src="{% static "js/about.js"%}"></script>
{% endblock script %}
Loading

0 comments on commit 2567531

Please sign in to comment.