Compare commits
89 Commits
vass-page-
...
specto-fix
Author | SHA1 | Date | |
---|---|---|---|
431f902a7f | |||
fe7d2101e2 | |||
d36405c0a8 | |||
8d928873a6 | |||
0ed9c2daed | |||
39700082e1 | |||
53c35377c6 | |||
2e4f3efe7d | |||
a6241563c7 | |||
88d8de76ec | |||
a1e8c902e2 | |||
4a279e0161 | |||
31f5eaa66b | |||
bfbf4fe5f7 | |||
bb221f7ee0 | |||
46256d328e | |||
9c4b37d775 | |||
5cf410c03e | |||
6170cf9d05 | |||
4a1ab4bed5 | |||
2687233eda | |||
cbe88e2ec6 | |||
ce7bfa15a4 | |||
31479d2fc5 | |||
54635a9f53 | |||
c6cdff7e74 | |||
e48ebb4a31 | |||
a3587a27b8 | |||
7dbab97c06 | |||
5eab487307 | |||
d43a2d4cf2 | |||
0e40040729 | |||
838a5d58d6 | |||
7e87b12812 | |||
696747d0e9 | |||
d13c9bd178 | |||
2239a03c76 | |||
c9734edd87 | |||
7fe675b3bd | |||
009e6ba203 | |||
8e34d55972 | |||
786a4e4902 | |||
d007ab0997 | |||
1913e45328 | |||
9de29a0ab4 | |||
2a8fe5c3f5 | |||
b74f05ba6a | |||
a33a7898a3 | |||
2ebe58c511 | |||
ef87f0ec24 | |||
b9d91ad7dc | |||
d5a3d4b3c8 | |||
dd32fcb04b | |||
aedbb6be6e | |||
c2afe6c93e | |||
2d467f1a12 | |||
c1d7b01e4e | |||
4ccf93f447 | |||
94ea7ecce9 | |||
ac61698d51 | |||
06f6f0d473 | |||
00748020be | |||
4bea179ad4 | |||
c851efa366 | |||
3e37c1ca20 | |||
83fecc9d6f | |||
ab35c01e17 | |||
ddfd4d0d5c | |||
a0437cfba1 | |||
51ce05ce71 | |||
8e3ee3c6c5 | |||
f81dfd6b45 | |||
cad4180301 | |||
4590e715b1 | |||
01d0767a31 | |||
bac4803fb4 | |||
9524a239d8 | |||
a25538a5fe | |||
7139c12617 | |||
3d92673b9f | |||
8dc53754f5 | |||
49a317af92 | |||
6cc32e3b12 | |||
303cd13b3c | |||
8a7242e374 | |||
00514ee175 | |||
bd42bf4215 | |||
7f890dceba | |||
db511a8f7d |
5
.editorconfig
Normal file
@ -0,0 +1,5 @@
|
||||
root = true
|
||||
|
||||
[*.{js,css}]
|
||||
indent_style = space
|
||||
indent_size = 2
|
5
.gitignore
vendored
@ -1 +1,6 @@
|
||||
__django
|
||||
reValuate/db.sqlite3
|
||||
*.sqlite3
|
||||
*/media/*
|
||||
*.pyc
|
||||
*.sqlite3
|
||||
|
24
README.md
@ -1,2 +1,24 @@
|
||||
# CurrencySite
|
||||
# reValuate
|
||||
|
||||
[](#contributors-) [](https://revaluate.eduteh.eu) [](https://discord.gg/eX5wmJuMVp)
|
||||
|
||||
|
||||
School project for helping people consider throwing their trash out in the right bins, in order to help out with recycling.
|
||||
Check out my blog post over [here](https://yamozha.xyz/revaluate/)
|
||||
## Contributors ✨
|
||||
|
||||
Thanks goes to these wonderful people :
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
✨
|
||||
<td align="center"><a href="http://yamozha.github.io"><img src="https://avatars.githubusercontent.com/u/36108495?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Yamozha</b></sub></a><br /><a href="https://github.com/yamozha/reValuate/commits?author=yamozha" title="Code">💻</a> <a href="https://github.com/yamozha/reValuate/commits?author=yamozha" title="Tests">⚠️</a></td>
|
||||
✨
|
||||
<td align="center"><a href="https://github.com/vassdeniss"><img src="https://avatars.githubusercontent.com/u/72888249?v=4?s=100" width="100px;" alt=""/><br /><sub><b>vassdeniss</b></sub></a><br /><a href="#design-vassdeniss" title="Design">🎨</a> <a href="https://github.com/yamozha/reValuate/commits?author=vassdeniss" title="Code">💻</a></td>
|
||||
<td align="center"><a href="https://github.com/pepelen21"><img src="https://avatars.githubusercontent.com/u/61829825?v=4?s=100" width="100px;" alt=""/><br /><sub><b>pepelen21</b></sub></a><br /><a href="#ideas-pepelen21" title="Ideas, Planning, & Feedback">🤔</a></td>
|
||||
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
||||
|
||||
|
170
logo-test.html
Normal file
@ -0,0 +1,170 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>logo test</title>
|
||||
<style style="text/css">
|
||||
html, body {margin: 0; padding: 0;}
|
||||
body { background-color: #93C900; }
|
||||
#revaluate_logo {
|
||||
transform: rotate3d(1, 1, 0.3, 20deg) translateZ(100px) translateY(22px);
|
||||
max-width: 10vw;
|
||||
filter: drop-shadow(3px -3px 0 rgba(0, 0, 0, .3));
|
||||
}
|
||||
#revaluate_logo path {
|
||||
fill: white;
|
||||
}
|
||||
#revaluate_logo .arrows {
|
||||
transform-origin: center;
|
||||
}
|
||||
body > header {
|
||||
padding-top: 1vw;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
background-color: rgb(203, 125, 255);
|
||||
}
|
||||
</style>
|
||||
|
||||
<script type="text/javascript">
|
||||
function rotateLogo(elem) {
|
||||
elem.style.transform = "rotate(" + window.scrollY/20 + "deg)";
|
||||
}
|
||||
window.addEventListener('load', function main() {
|
||||
window.addEventListener("scroll", rotateLogo.bind(null,
|
||||
document.querySelector('#revaluate_logo .arrows')));
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<svg version="1.1" id="revaluate_logo" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||
y="0px" viewBox="0 0 1100 1100" style="enable-background:new 0 0 1100 1100;" xml:space="preserve">
|
||||
<path class="arrows" d="M452.35,911.88l-19.16,84.87c-96.46-21.78-182.42-71.91-248.57-144.97c-31.84-35.17-58.24-74.78-78.46-117.73
|
||||
c-16.77-35.63-29.01-73.01-36.54-111.44l-65.61-0.89L115,435.4l105.9,189.27l-61.96-0.84c15.38,62.9,46.13,120.91,90.17,169.56
|
||||
C303.17,853.1,373.46,894.07,452.35,911.88z M999.22,406.1l-83.97,22.75c21.15,78.06,17.79,159.35-9.7,235.06
|
||||
c-22.4,61.68-59.3,115.99-107.71,159l-28.23-55.16L651.83,949.88l216.6,10.97l-29.89-58.41c30.45-24.62,57.76-52.93,81.41-84.41
|
||||
c28.51-37.95,51.18-79.81,67.37-124.4C1020.97,600.97,1025.08,501.55,999.22,406.1z M833.45,212.74L727.97,23.24l-33.69,56.3
|
||||
c-37.02-12.77-75.5-20.94-114.73-24.31c-47.29-4.07-94.8-1.11-141.2,8.79c-96.4,20.56-182.89,69.76-250.13,142.27l63.79,59.16
|
||||
c54.99-59.3,125.71-99.53,204.49-116.34c64.18-13.69,129.79-11.17,191.91,7.09l-31.82,53.18L833.45,212.74z"/>
|
||||
<path d="M747.7,705.9H620.8L590,636.4c-11.3-25.4-21.5-44-30.5-55.8c-9-11.8-17.9-19.3-26.4-22.6c-8.6-3.3-19.6-5-33.2-5h-13.3
|
||||
v152.9H368.3V314.1h201c32.4,0,59,6.6,79.7,19.8s35.7,29.2,44.8,48.1c9.1,18.9,13.7,36.8,13.7,53.7c0,19.8-3.8,36.5-11.5,50.2
|
||||
c-7.6,13.7-15.7,23.6-24.2,29.8s-18,12.2-28.5,17.8c12.6,7.3,23,16.1,31.2,26.2s19.4,30.5,33.5,61.2L747.7,705.9z M587.1,437.9
|
||||
c0-18.1-5.9-30.7-17.8-37.9s-31.2-10.7-57.9-10.7h-24.9v94.4h25.4c28.8,0,48.6-3.1,59.2-9.5C581.8,467.9,587.1,455.8,587.1,437.9z"
|
||||
/>
|
||||
</svg>
|
||||
</header>
|
||||
|
||||
<pre style="width: 20vw; white-space: pre-wrap;">
|
||||
the new code
|
||||
|
||||
I’m Dudley Storey, author of Using SVG with CSS3 and HTML5, Smashing Magazine contributing editor, teacher and speaker. I write about all aspects of web development, including:
|
||||
|
||||
HTML
|
||||
CSS
|
||||
JavaScript
|
||||
SVG
|
||||
Responsive Design
|
||||
Galleries
|
||||
PHP
|
||||
MySQL
|
||||
SEO
|
||||
Accessibility
|
||||
Servers & Hosting
|
||||
Business
|
||||
Exercises & Quizzes
|
||||
To receive more information, including news, updates, and tips, follow me on Twitter or add me on Google+.
|
||||
|
||||
Become a Patron
|
||||
|
||||
This site helps millions of visitors while remaining ad-free. For less than the price of a cup of coffee, you can help pay for bandwidth and server costs while encouraging further articles.
|
||||
|
||||
projects
|
||||
The New DefaultsA Sass color keyword system for designers. Replaces CSS defaults with improved hues and more memorable, relevant color names.
|
||||
|
||||
CSSslidyAn auto-generated #RWD image slider. 3.8K of JS, no JQuery. Drop in images, add a line of CSS. Done.
|
||||
|
||||
Massive Head CanonMassive Head Canon. Intelligent discussion of movies, books, games, and technology.
|
||||
|
||||
books
|
||||
Pro CSS Animation (Apress, 2013)
|
||||
|
||||
Animation Fundamentals: Understanding Particles Mesh Animation with HTML5 Canvas Scrolling SVG Sunset
|
||||
|
||||
|
||||
Part of the Scrolling Effects Reading List
|
||||
|
||||
Rotate Elements on Scroll with JavaScript
|
||||
|
||||
Updated 5 years ago
|
||||
Share onTwitterFacebookGoogle+
|
||||
|
||||
When I recoded and rebranded this site four months ago, I decided to make it completely free of frameworks: while the text and visible code samples for JQuery articles often remained unchanged, under the hood everything had to run vanilla JavaScript.
|
||||
|
||||
One of those articles explored how to rotate elements on the page with scroll. This article presents an updated version using the code that actually runs underneath that demo, written in vanilla JavaScript… in many respects, an approach that is simpler and more efficient.
|
||||
|
||||
Setting The Gears
|
||||
|
||||
As with the previous example, the gears are placed on the page using separate id values. Since they are vector shapes, it makes sense to build and reference the gears as SVG images:
|
||||
|
||||
|
||||
There are many possibilities for positioning the gears: very often they will have a fixed position on the page; it’s also possible to use the new CSS “scroll-to-top-then-fixed” positioning (aka position: sticky). In this example, I’ve used flexbox to separate the elements, and vw units to size them; otherwise, the gears use standard static positioning, and therefore completely scroll with the page.
|
||||
|
||||
#gearbox {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
#leftgear, #rightgear {
|
||||
width: 20vw;
|
||||
max-width: 20%;
|
||||
height: auto;
|
||||
}
|
||||
Rotating the Gears
|
||||
|
||||
Rotating the elements themselves is quite straightforward: at the bottom of the page, add the following script.
|
||||
|
||||
var leftgear = document.getElementById("leftgear"),
|
||||
rightgear = document.getElementById("rightgear");
|
||||
|
||||
window.addEventListener("scroll", function() {
|
||||
leftgear.style.transform = "rotate("+window.pageYOffset+"deg)";
|
||||
rightgear.style.transform = "rotate(-"+window.pageYOffset+"deg)";
|
||||
});
|
||||
Each gear rotates by the amount the window is scrolled in pixels, converted into degrees, the left gear rotating clockwise, and the right counter-clockwise. To speed up or slow down the rotation relative to the amount of scrolling, you could make window.pageYOffset part of a simple mathematical expression: multiplying or dividing it by 2, for example.
|
||||
|
||||
Avoid Grinding Your Gears
|
||||
|
||||
A common issue with any technique that manipulates scroll behaviour is “janking”: elements stuttering as they try to match user input with the browser’s repaint cycle. The easiest way to deal with this is to only move the elements when the browser is prepared to do so, via requestAnimationFrame. To do so, the addEventListener changes to listen for a custom event:
|
||||
|
||||
window.addEventListener("optimizedScroll", function() {
|
||||
…
|
||||
})
|
||||
Above the event handler, add an anonymous function:
|
||||
|
||||
;(function() {
|
||||
var throttle = function(type, name, obj) {
|
||||
var obj = obj || window;
|
||||
var running = false;
|
||||
var func = function() {
|
||||
if (running) { return; }
|
||||
running = true;
|
||||
requestAnimationFrame(function() {
|
||||
obj.dispatchEvent(new CustomEvent(name));
|
||||
running = false;
|
||||
});
|
||||
};
|
||||
obj.addEventListener(type, func);
|
||||
};
|
||||
throttle ("scroll", "optimizedScroll");
|
||||
})();
|
||||
I’ll have much more to say about requestAnimationFrame in coming articles.
|
||||
|
||||
Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.
|
||||
Check out the CodePen demo for this article at https://codepen.io/dudleystorey/pen/pgzeor
|
||||
|
||||
|
||||
Scroll-to-Focus Effect For Hero Images
|
||||
Background Reveal Scroll In Pure CSS
|
||||
|
||||
</pre>
|
||||
</body>
|
||||
</html>
|
16
logo.svg
Normal file
@ -0,0 +1,16 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 25.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="revaluate_logo" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||
y="0px" viewBox="0 0 1100 1100" style="enable-background:new 0 0 1100 1100;" xml:space="preserve">
|
||||
<path d="M452.4,911.9l-19.2,84.9c-96.5-21.8-182.4-71.9-248.6-145c-31.8-35.2-58.2-74.8-78.5-117.7c-16.8-35.6-29-73-36.5-111.4
|
||||
L4,621.7l111-186.3l105.9,189.3l-62-0.8c15.4,62.9,46.1,120.9,90.2,169.6C303.2,853.1,373.5,894.1,452.4,911.9z M999.2,406.1
|
||||
l-84,22.8c21.2,78.1,17.8,159.4-9.7,235.1c-22.4,61.7-59.3,116-107.7,159l-28.2-55.2L651.8,949.9l216.6,11l-29.9-58.4
|
||||
c30.5-24.6,57.8-52.9,81.4-84.4c28.5-38,51.2-79.8,67.4-124.4C1021,601,1025.1,501.5,999.2,406.1z M833.5,212.7L728,23.2l-33.7,56.3
|
||||
c-37-12.8-75.5-20.9-114.7-24.3c-47.3-4.1-94.8-1.1-141.2,8.8c-96.4,20.6-182.9,69.8-250.1,142.3l63.8,59.2
|
||||
c55-59.3,125.7-99.5,204.5-116.3c64.2-13.7,129.8-11.2,191.9,7.1l-31.8,53.2L833.5,212.7z"/>
|
||||
<path d="M747.7,705.9H620.8L590,636.4c-11.3-25.4-21.5-44-30.5-55.8c-9-11.8-17.9-19.3-26.4-22.6c-8.6-3.3-19.6-5-33.2-5h-13.3
|
||||
v152.9H368.3V314.1h201c32.4,0,59,6.6,79.7,19.8s35.7,29.2,44.8,48.1c9.1,18.9,13.7,36.8,13.7,53.7c0,19.8-3.8,36.5-11.5,50.2
|
||||
c-7.6,13.7-15.7,23.6-24.2,29.8s-18,12.2-28.5,17.8c12.6,7.3,23,16.1,31.2,26.2s19.4,30.5,33.5,61.2L747.7,705.9z M587.1,437.9
|
||||
c0-18.1-5.9-30.7-17.8-37.9s-31.2-10.7-57.9-10.7h-24.9v94.4h25.4c28.8,0,48.6-3.1,59.2-9.5C581.8,467.9,587.1,455.8,587.1,437.9z"
|
||||
/>
|
||||
</svg>
|
After Width: | Height: | Size: 1.5 KiB |
5
reValuate/api/apps.py
Normal file
@ -0,0 +1,5 @@
|
||||
from django.apps import AppConfig
|
||||
|
||||
|
||||
class ApiConfig(AppConfig):
|
||||
name = 'api'
|
15
reValuate/api/serializers.py
Normal file
@ -0,0 +1,15 @@
|
||||
from rest_framework import serializers
|
||||
from users.models import Balance
|
||||
from upload.models import Media
|
||||
|
||||
|
||||
class BalanceSerializer(serializers.ModelSerializer):
|
||||
class Meta:
|
||||
model = Balance
|
||||
fields = ("user", "balanceValue")
|
||||
|
||||
class ImageSerializer(serializers.ModelSerializer):
|
||||
class Meta:
|
||||
model = Media
|
||||
fields = ("user", "image", "tokenized", "reason", "date", "managed_by")
|
||||
|
31
reValuate/api/views.py
Normal file
@ -0,0 +1,31 @@
|
||||
from rest_framework import status, viewsets, authentication, permissions
|
||||
from rest_framework.decorators import api_view, action
|
||||
from rest_framework.response import Response
|
||||
|
||||
from users.models import Balance
|
||||
from upload.models import Media
|
||||
from .serializers import BalanceSerializer, ImageSerializer
|
||||
|
||||
class AllBalance(viewsets.ModelViewSet):
|
||||
serializer_class = BalanceSerializer
|
||||
http_method_names = ['get']
|
||||
|
||||
def get_queryset(self):
|
||||
return Balance.objects.all()
|
||||
|
||||
|
||||
class BalanceView(viewsets.ModelViewSet):
|
||||
serializer_class = BalanceSerializer
|
||||
http_method_names = ['get']
|
||||
|
||||
def get_queryset(self):
|
||||
return Balance.objects.filter(user=self.request.user)
|
||||
|
||||
|
||||
class ImageView(viewsets.ModelViewSet):
|
||||
serializer_class = ImageSerializer
|
||||
http_method_names = ['get','post']
|
||||
|
||||
def get_queryset(self):
|
||||
return Media.objects.filter(user=self.request.user)
|
||||
|
127
reValuate/home/static/home/css/gallery.css
Normal file
@ -0,0 +1,127 @@
|
||||
.popup {
|
||||
width: 900px;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.popup img {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.show {
|
||||
z-index: 999;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.show .overlay {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0,0,0,.66);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.show .img-show {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
background: #FFF;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.img-show span {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.img-show img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: Raleway;
|
||||
background-color: #202125;
|
||||
}
|
||||
|
||||
.heading {
|
||||
text-align: center;
|
||||
font-size: 2.0em;
|
||||
letter-spacing: 1px;
|
||||
padding: 40px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.gallery-image {
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.gallery-image img {
|
||||
height: 250px;
|
||||
width: 350px;
|
||||
transform: scale(1.0);
|
||||
transition: transform 0.4s ease;
|
||||
}
|
||||
|
||||
.img-box {
|
||||
box-sizing: content-box;
|
||||
margin: 10px;
|
||||
height: 250px;
|
||||
width: 350px;
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
color: white;
|
||||
position: relative;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.caption {
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
left: 20px;
|
||||
opacity: 0.0;
|
||||
transition: transform 0.3s ease, opacity 0.3s ease;
|
||||
}
|
||||
|
||||
.transparent-box {
|
||||
height: 250px;
|
||||
width: 350px;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
transition: background-color 0.3s ease;
|
||||
}
|
||||
|
||||
.img-box:hover img { transform: scale(1.1); }
|
||||
.img-box:hover .transparent-box { background-color: rgba(0, 0, 0, 0.5); }
|
||||
|
||||
.img-box:hover .caption {
|
||||
transform: translateY(-20px);
|
||||
opacity: 1.0;
|
||||
}
|
||||
|
||||
.img-box:hover { cursor: pointer; }
|
||||
.caption > p:nth-child(2) { font-size: 0.8em; }
|
||||
.opacity-low { opacity: 0.5; }
|
323
reValuate/home/static/home/css/style.css
Normal file
@ -0,0 +1,323 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
#page-wrap {
|
||||
max-width: 1200px;
|
||||
margin: 50px auto;
|
||||
padding: 20px;
|
||||
background: white;
|
||||
-moz-box-shadow: 0 0 20px #469330;
|
||||
-webkit-box-shadow: 0 0 20px #469330;
|
||||
box-shadow: 0 0 20px #469330;
|
||||
text-align: center;
|
||||
border-radius: 25px;
|
||||
}
|
||||
header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30px 10%;
|
||||
background-color: #469330;
|
||||
position: sticky;
|
||||
}
|
||||
|
||||
.logo {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.nav__links a,
|
||||
.cta,
|
||||
.overlay__content a {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-weight: 500;
|
||||
font-size:30px;
|
||||
color: #edf0f1;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.nav__links {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.nav__links li {
|
||||
padding: 0px 20px;
|
||||
}
|
||||
|
||||
.nav__links li a {
|
||||
transition: color 0.3s ease 0s;
|
||||
}
|
||||
|
||||
.nav__links li a:hover {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.cta {
|
||||
padding: 9px 25px;
|
||||
color: #469330;
|
||||
background-color: white;
|
||||
border: none;
|
||||
border-radius: 50px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease 0s;
|
||||
}
|
||||
|
||||
.cta:hover {
|
||||
color: white;
|
||||
background-color: darkgreen;
|
||||
}
|
||||
|
||||
/* Mobile Nav */
|
||||
|
||||
.menu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.overlay {
|
||||
height: 100%;
|
||||
width: 0;
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-color: #469330;
|
||||
overflow-x: hidden;
|
||||
transition: width 0.5s ease 0s;
|
||||
}
|
||||
|
||||
.overlay--active {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.overlay__content {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.overlay a {
|
||||
padding: 15px;
|
||||
font-size: 36px;
|
||||
display: block;
|
||||
transition: color 0.3s ease 0s;
|
||||
}
|
||||
|
||||
.overlay a:hover,
|
||||
.overlay a:focus {
|
||||
color: darkgreen;
|
||||
}
|
||||
.overlay .close {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 45px;
|
||||
font-size: 60px;
|
||||
color: #edf0f1;
|
||||
}
|
||||
|
||||
@media screen and (max-height: 450px) {
|
||||
.overlay a {
|
||||
font-size: 20px;
|
||||
}
|
||||
.overlay .close {
|
||||
font-size: 40px;
|
||||
top: 15px;
|
||||
right: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1024px) {
|
||||
.nav__links,
|
||||
.cta {
|
||||
display: none;
|
||||
}
|
||||
.menu {
|
||||
display: initial;
|
||||
}
|
||||
}
|
||||
|
||||
html{
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
|
||||
margin: 0 0 30px 0;
|
||||
}
|
||||
|
||||
h1.heading{
|
||||
color: white;
|
||||
font-size: 50px;
|
||||
text-shadow: -1px 0 black, 0 2px black, 2px 0 black, 0 -1px black;
|
||||
}
|
||||
|
||||
ul.emoji{
|
||||
list-style-type: "♻️";
|
||||
}
|
||||
|
||||
.question{
|
||||
color: gray;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
ul.nothing{
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
a.footer{
|
||||
/* background:radial-gradient(circle, rgba(0,159,12,1) 0%, rgba(8,96,0,1) 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent; */
|
||||
color: lightgreen;
|
||||
}
|
||||
footer{
|
||||
font-size: small;
|
||||
text-align: center;
|
||||
left:50%;
|
||||
}
|
||||
|
||||
.centered{
|
||||
display:flex;
|
||||
}
|
||||
|
||||
@-webkit-keyframes text-shadow-pop-right {
|
||||
0% {
|
||||
text-shadow: 0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555;
|
||||
-webkit-transform: translateX(0);
|
||||
transform: translateX(0)
|
||||
}
|
||||
|
||||
100% {
|
||||
text-shadow: 1px 0 #555,2px 0 #555,3px 0 #555,4px 0 #555,5px 0 #555,6px 0 #555,7px 0 #555,8px 0 #555;
|
||||
-webkit-transform: translateX(-8px);
|
||||
transform: translateX(-8px)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes text-shadow-pop-right {
|
||||
0% {
|
||||
text-shadow: 0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555;
|
||||
-webkit-transform: translateX(0);
|
||||
transform: translateX(0)
|
||||
}
|
||||
|
||||
100% {
|
||||
text-shadow: 1px 0 #555,2px 0 #555,3px 0 #555,4px 0 #555,5px 0 #555,6px 0 #555,7px 0 #555,8px 0 #555;
|
||||
-webkit-transform: translateX(-8px);
|
||||
transform: translateX(-8px)
|
||||
}
|
||||
}
|
||||
|
||||
.text-shadow-pop-right{-webkit-animation:text-shadow-pop-right .6s both;animation:text-shadow-pop-right .6s both}
|
||||
|
||||
@-webkit-keyframes scale-in-center {
|
||||
0% {
|
||||
-webkit-transform: scale(0);
|
||||
transform: scale(0);
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes scale-in-center {
|
||||
0% {
|
||||
-webkit-transform: scale(0);
|
||||
transform: scale(0);
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.scale-in-center {
|
||||
-webkit-animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
|
||||
animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
|
||||
}
|
||||
|
||||
.buttons{
|
||||
background-color: #469330;
|
||||
border: none;
|
||||
color: white;
|
||||
padding: 15px 32px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
margin: 4px 2px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@-webkit-keyframes tracking-in-expand {
|
||||
0% {
|
||||
letter-spacing: -0.5em;
|
||||
opacity: 0;
|
||||
}
|
||||
40% {
|
||||
opacity: 0.6;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes tracking-in-expand {
|
||||
0% {
|
||||
letter-spacing: -0.5em;
|
||||
opacity: 0;
|
||||
}
|
||||
40% {
|
||||
opacity: 0.6;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.tracking-in-expand {
|
||||
-webkit-animation: tracking-in-expand 0.7s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
|
||||
animation: tracking-in-expand 0.7s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
|
||||
animation-delay: .3s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes fade-in-bck {
|
||||
0% {
|
||||
-webkit-transform: translateZ(80px);
|
||||
transform: translateZ(80px);
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fade-in-bck {
|
||||
0% {
|
||||
-webkit-transform: translateZ(80px);
|
||||
transform: translateZ(80px);
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.fade-in-bck {
|
||||
-webkit-animation: fade-in-bck 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
|
||||
animation: fade-in-bck 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
|
||||
}
|
BIN
reValuate/home/static/home/img/Discord-Logo.png
Normal file
After Width: | Height: | Size: 50 KiB |
BIN
reValuate/home/static/home/img/approved.png
Normal file
After Width: | Height: | Size: 14 KiB |
BIN
reValuate/home/static/home/img/cross.png
Normal file
After Width: | Height: | Size: 15 KiB |
BIN
reValuate/home/static/home/img/loading.png
Normal file
After Width: | Height: | Size: 14 KiB |
BIN
reValuate/home/static/home/img/logo.png
Normal file
After Width: | Height: | Size: 145 KiB |
BIN
reValuate/home/static/home/img/mail.png
Normal file
After Width: | Height: | Size: 83 KiB |
BIN
reValuate/home/static/home/img/question.png
Normal file
After Width: | Height: | Size: 9.6 KiB |
BIN
reValuate/home/static/home/img/youtube.png
Normal file
After Width: | Height: | Size: 71 KiB |
12
reValuate/home/static/home/js/mobile.js
Normal file
@ -0,0 +1,12 @@
|
||||
const doc = document;
|
||||
const menuOpen = doc.querySelector(".menu");
|
||||
const menuClose = doc.querySelector(".close");
|
||||
const overlay = doc.querySelector(".overlay");
|
||||
|
||||
menuOpen.addEventListener("click", () => {
|
||||
overlay.classList.add("overlay--active");
|
||||
});
|
||||
|
||||
menuClose.addEventListener("click", () => {
|
||||
overlay.classList.remove("overlay--active");
|
||||
});
|
127
reValuate/home/views.py
Normal file
@ -0,0 +1,127 @@
|
||||
from django.shortcuts import render
|
||||
import os.path
|
||||
from users.models import Balance
|
||||
from django.conf import settings
|
||||
from users.models import User
|
||||
import operator
|
||||
from upload.models import Media
|
||||
import requests
|
||||
from django.db.models import Sum
|
||||
|
||||
|
||||
def homePage(request):
|
||||
iter_var = 0
|
||||
all_balance = 0
|
||||
Cashier = False
|
||||
Processor = False
|
||||
|
||||
|
||||
balObject = Balance.objects.filter(user=request.user.id)
|
||||
userBalance = balObject.values("balanceValue")
|
||||
try:
|
||||
userBalance = userBalance[0]['balanceValue']
|
||||
except IndexError:
|
||||
userBalance = None
|
||||
if request.user.groups.filter(name='Cashier').exists():
|
||||
Cashier = True
|
||||
elif request.user.groups.filter(name='Processor').exists():
|
||||
Processor = True
|
||||
else:
|
||||
pass
|
||||
if request.user.is_authenticated:
|
||||
userQR = f"Name = {request.user.username}, Date Joined = {request.user.date_joined.date()}, ID = {request.user.id}, isCashier={Cashier}, isProcessor={Processor}, Balance = {userBalance}"
|
||||
else:
|
||||
userQR=None
|
||||
|
||||
# Use aggregation that can be calculated in database (fast)
|
||||
all_balance = Balance.objects.all().aggregate(s=Sum("balanceValue"))['s']
|
||||
# print(f"{all_balance}")
|
||||
try:
|
||||
limited_coins = settings.ALL_COINS - all_balance
|
||||
except TypeError:
|
||||
limited_coins = settings.ALL_COINS
|
||||
|
||||
github = requests.get("https://api.github.com/user/36108495").json()
|
||||
|
||||
context = {
|
||||
"isCashier": Cashier,
|
||||
"isProcessor": Processor,
|
||||
"userQR":userQR,
|
||||
"fullbalance": limited_coins,
|
||||
"currencyTotal": all_balance,
|
||||
"userBalance": userBalance,
|
||||
"github": f"https://github.com/podput",
|
||||
}
|
||||
|
||||
|
||||
return render(request, "home.html", context)
|
||||
|
||||
|
||||
def leaderboard(request):
|
||||
users = User.objects.all()
|
||||
leaderboard = {}
|
||||
for i in users:
|
||||
try:
|
||||
username = i.username
|
||||
balance = i.balance.balanceValue
|
||||
# add media counter and other stuff
|
||||
if f"{username}" in leaderboard.keys():
|
||||
leaderboard[username] = balance + leaderboard[username]
|
||||
else:
|
||||
leaderboard[username] = balance
|
||||
except Exception as e:
|
||||
pass
|
||||
|
||||
leaderboard = dict(sorted(leaderboard.items(), key=operator.itemgetter(0)))
|
||||
leaderboard = dict(reversed(list(leaderboard.items())))
|
||||
|
||||
while len(leaderboard) > 5:
|
||||
leaderboard.pop()
|
||||
|
||||
|
||||
media = Media.objects.all()
|
||||
user_media = {}
|
||||
for i in media:
|
||||
username = i.user.username
|
||||
if f"{username}" in user_media.keys():
|
||||
user_media[username] += 1
|
||||
else:
|
||||
user_media[username] = 1
|
||||
|
||||
user_media = dict(sorted(user_media.items(), key=operator.itemgetter(0)))
|
||||
user_media = dict(reversed(list(user_media.items())))
|
||||
users = {}
|
||||
for i in user_media.keys():
|
||||
iter_user = User.objects.get(username=i)
|
||||
iter_user_media = Media.objects.filter(user=iter_user)
|
||||
if iter_user_media.filter(is_video=True):
|
||||
user_data = {i:{"Videos":len(iter_user_media.filter(is_video=True)),
|
||||
"Images":len(iter_user_media.filter(is_video=False))}}
|
||||
else:
|
||||
user_data = {i:{"Images":len(iter_user_media.filter(is_video=False))}}
|
||||
|
||||
while len(user_media) > 5:
|
||||
user_media.pop()
|
||||
|
||||
# for i in media:
|
||||
# username = i.user.username
|
||||
# image = i.image
|
||||
|
||||
# if f"{username}" in media_count.values():
|
||||
# media_count[username] = image + media_count[username].value
|
||||
# else:
|
||||
# media_count[username] = image
|
||||
|
||||
# print(media_count)
|
||||
|
||||
context = {
|
||||
"leaderboard":leaderboard,
|
||||
"user_media":user_media
|
||||
}
|
||||
|
||||
return render(request, 'leaderboard.html', context)
|
||||
|
||||
|
||||
def about(request):
|
||||
|
||||
return render(request, "about.html")
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 331 B After Width: | Height: | Size: 331 B |
Before Width: | Height: | Size: 504 B After Width: | Height: | Size: 504 B |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 380 B After Width: | Height: | Size: 380 B |
Before Width: | Height: | Size: 677 B After Width: | Height: | Size: 677 B |
Before Width: | Height: | Size: 392 B After Width: | Height: | Size: 392 B |
Before Width: | Height: | Size: 560 B After Width: | Height: | Size: 560 B |
Before Width: | Height: | Size: 655 B After Width: | Height: | Size: 655 B |
Before Width: | Height: | Size: 655 B After Width: | Height: | Size: 655 B |
Before Width: | Height: | Size: 581 B After Width: | Height: | Size: 581 B |
Before Width: | Height: | Size: 436 B After Width: | Height: | Size: 436 B |
Before Width: | Height: | Size: 560 B After Width: | Height: | Size: 560 B |
Before Width: | Height: | Size: 458 B After Width: | Height: | Size: 458 B |
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 331 B After Width: | Height: | Size: 331 B |
Before Width: | Height: | Size: 280 B After Width: | Height: | Size: 280 B |