achievements tracking

.gitignore

@@ -1,3 +1,4 @@
 venv/
 __pycache__/
 db/
+staticfiles/

.vscode/launch.json

@@ -12,7 +12,8 @@
             "args": [
                 "test",
             ],
-            "django": true
+            "django": true,
+            "preLaunchTask": "Migrate"
         },
         {
             "name": "Run Server",
@@ -23,7 +24,8 @@
                 "runserver",
                 "--noreload"
             ],
-            "django": true
+            "django": true,
+            "preLaunchTask": "Migrate"
         }
     ]
 }

.vscode/tasks.json

@@ -0,0 +1,24 @@
+{
+    "version": "2.0.0",
+    "tasks": [
+        {
+            "label": "Collect Static",
+            "command": "venv/bin/python manage.py collectstatic --no-input",
+            "type": "shell",
+            "presentation": {
+                "reveal": "always"
+            },
+            "group": "build"
+        },
+        {
+            "dependsOn": "Collect Static",
+            "label": "Migrate",
+            "command": "venv/bin/python manage.py migrate",
+            "type": "shell",
+            "presentation": {
+                "reveal": "always"
+            },
+            "group": "build"
+        }
+    ]
+}

api/migrations/0002_auto_20200426_1517.py

@@ -1,25 +0,0 @@
-# Generated by Django 3.0.5 on 2020-04-26 15:17
-
-from django.db import migrations, models
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ('api', '0001_initial'),
-    ]
-
-    operations = [
-        migrations.CreateModel(
-            name='Visitor',
-            fields=[
-                ('name', models.CharField(max_length=255, primary_key=True, serialize=False)),
-                ('clicked', models.IntegerField(blank=True, default=0)),
-                ('first_pressed', models.DateTimeField(auto_now_add=True)),
-                ('last_pressed', models.DateTimeField(auto_now=True)),
-            ],
-        ),
-        migrations.DeleteModel(
-            name='Snippet',
-        ),
-    ]

api/migrations/0003_auto_20200426_1526.py

@@ -1,23 +0,0 @@
-# Generated by Django 3.0.5 on 2020-04-26 15:26
-
-from django.db import migrations, models
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ('api', '0002_auto_20200426_1517'),
-    ]
-
-    operations = [
-        migrations.AlterField(
-            model_name='visitor',
-            name='first_pressed',
-            field=models.DateTimeField(blank=True, null=True),
-        ),
-        migrations.AlterField(
-            model_name='visitor',
-            name='last_pressed',
-            field=models.DateTimeField(blank=True, null=True),
-        ),
-    ]

api/models.py

@@ -1,11 +1,19 @@
 from django.db import models
-from datetime import datetime
+from pygments.lexers import get_all_lexers
+from pygments.styles import get_all_styles
 
-class Visitor(models.Model):
-    name = models.CharField(
-        primary_key=True,
-        max_length = 255
-    )
-    clicked = models.IntegerField(default = 0, blank=True)
-    first_pressed = models.DateTimeField(blank=True, null=True)
-    last_pressed = models.DateTimeField(blank=True, null=True)
+LEXERS = [item for item in get_all_lexers() if item[1]]
+LANGUAGE_CHOICES = sorted([(item[1][0], item[0]) for item in LEXERS])
+STYLE_CHOICES = sorted([(item, item) for item in get_all_styles()])
+
+
+class Snippet(models.Model):
+    created = models.DateTimeField(auto_now_add=True)
+    title = models.CharField(max_length=100, blank=True, default='')
+    code = models.TextField()
+    linenos = models.BooleanField(default=False)
+    language = models.CharField(choices=LANGUAGE_CHOICES, default='python', max_length=100)
+    style = models.CharField(choices=STYLE_CHOICES, default='friendly', max_length=100)
+
+    class Meta:
+        ordering = ['created']

api/serializers.py

@@ -1,23 +1,29 @@
 from rest_framework import serializers
-from .models import *
+from .models import Snippet, LANGUAGE_CHOICES, STYLE_CHOICES
 
 
-class VisitorSerializer(serializers.Serializer):
-    name = serializers.CharField(required=True)
-    clicked = serializers.IntegerField(read_only=True)
-    first_pressed = serializers.DateTimeField(read_only=True)
-    last_pressed = serializers.DateTimeField(read_only=True)
+class SnippetSerializer(serializers.Serializer):
+    id = serializers.IntegerField(read_only=True)
+    title = serializers.CharField(required=False, allow_blank=True, max_length=100)
+    code = serializers.CharField(style={'base_template': 'textarea.html'})
+    linenos = serializers.BooleanField(required=False)
+    language = serializers.ChoiceField(choices=LANGUAGE_CHOICES, default='python')
+    style = serializers.ChoiceField(choices=STYLE_CHOICES, default='friendly')
 
     def create(self, validated_data):
         """
-        Create and return a new `Visitor` instance, given the validated data.
+        Create and return a new `Snippet` instance, given the validated data.
         """
-        return Visitor.objects.create(**validated_data)
+        return Snippet.objects.create(**validated_data)
 
     def update(self, instance, validated_data):
         """
         Update and return an existing `Snippet` instance, given the validated data.
         """
-        instance.name = validated_data.get('name', instance.name)
+        instance.title = validated_data.get('title', instance.title)
+        instance.code = validated_data.get('code', instance.code)
+        instance.linenos = validated_data.get('linenos', instance.linenos)
+        instance.language = validated_data.get('language', instance.language)
+        instance.style = validated_data.get('style', instance.style)
         instance.save()
         return instance

api/tests.py

@@ -1,53 +1,42 @@
 from django.contrib.auth.models import AnonymousUser, User
 from django.test import RequestFactory, TestCase
-from django.db.utils import IntegrityError
 
-from .views import *
+from .views import SnippetList, SnippetDetail
 
 class SimpleTest(TestCase):
     def setUp(self):
         # Every test needs access to the request factory.
         self.factory = RequestFactory()
-        # self.user = User.objects.create_user(
-        #     username='testuser', email='test@test.test', password='testpass')
+        self.user = User.objects.create_user(
+            username='testuser', email='test@test.test', password='testpass')
 
-    def test_list_visitors(self):
+    def test_snippets(self):
         # Create an instance of a GET request.
-        request = self.factory.get('/visitors')
+        request = self.factory.get('/snippets')
 
         # Recall that middleware are not supported. You can simulate a
         # logged-in user by setting request.user manually.
-        # request.user = self.user
+        request.user = self.user
 
         # Or you can simulate an anonymous user by setting request.user to
         # an AnonymousUser instance.
         # request.user = AnonymousUser()
 
         # Test my_view() as if it were deployed at /customer/details
-        response = VisitorList.as_view()(request)
+        response = SnippetList.as_view()(request)
         # Use this syntax for class-based views.
         # response = MyView.as_view()(request)
         self.assertEqual(response.status_code, 200)
 
 
-    def test_add_visitor(self):
-        request = self.factory.post('/visitors', data={
-            'name': 'test',
+        request = self.factory.post('/snippets', data={
+            'title': 'test1',
+            'code': '() => {console.log("hello")};',
+            'lineos': False,
+            'language': 'js',
+            'style': 'abap'
             },
             content_type='application/json'
         )
-        response = VisitorList.as_view()(request)
+        response = SnippetList.as_view()(request)
         self.assertEqual(response.status_code, 201)
-
-        vis = Visitor.objects.get(name='test')
-        self.assertEqual(vis.clicked, 0)
-        self.assertIsNone(vis.first_pressed)
-        self.assertIsNone(vis.last_pressed)
-
-        with self.assertRaises(IntegrityError):
-            request = self.factory.post('/visitors', data={
-                'name': 'test',
-                },
-                content_type='application/json'
-            )
-            response = VisitorList.as_view()(request)

api/urls.py

@@ -3,8 +3,8 @@ from rest_framework.urlpatterns import format_suffix_patterns
 from . import views
 
 urlpatterns = [
-    path('visitor/', views.VisitorList.as_view()),
-    path('visitor/<str:pk>/', views.VisitorDetail.as_view()),
+    path('snippets/', views.SnippetList.as_view()),
+    path('snippets/<int:pk>/', views.SnippetDetail.as_view()),
 ]
 
 urlpatterns = format_suffix_patterns(urlpatterns)

api/views.py

@@ -1,15 +1,15 @@
-from .models import *
-from .serializers import *
+from .models import Snippet
+from .serializers import SnippetSerializer
 from rest_framework import generics
 
 
-class VisitorList(generics.ListCreateAPIView):
+class SnippetList(generics.ListCreateAPIView):
     # Add comments here
-    queryset = Visitor.objects.all()
-    serializer_class = VisitorSerializer
+    queryset = Snippet.objects.all()
+    serializer_class = SnippetSerializer
 
 
-class VisitorDetail(generics.RetrieveUpdateDestroyAPIView):
+class SnippetDetail(generics.RetrieveUpdateDestroyAPIView):
     # Add comments here
-    queryset = Visitor.objects.all()
-    serializer_class = VisitorSerializer
+    queryset = Snippet.objects.all()
+    serializer_class = SnippetSerializer

config/urls.py

@@ -18,7 +18,7 @@ from django.urls import path, include
 from django.http import JsonResponse
 
 urlpatterns = [
-    path('api/', include('api.urls')),
+    # path('api/', include('api.urls')),
     path('', include('ui.urls')),
     # path('admin/', admin.site.urls),
 ]

ui/static/ui/achievement.css

@@ -0,0 +1,35 @@
+.achievement {
+    position: absolute;
+    height: 100%;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: -1;
+}
+
+.achievement-animate {
+    animation-name: moveup;
+    animation-duration: 2s;
+    animation-fill-mode: forwards;
+}
+
+.achievements-list {
+    height: 100%;
+    overflow: auto;
+    text-align: center;
+}
+
+.achievement-text {
+    font-size: 4rem;
+}
+
+@keyframes moveup {
+    from {bottom: 0px;}
+    to {bottom: 200px; color: white;}
+}
+
+@keyframes fadeout {
+    from {}
+    to {color: transparent;}
+}

ui/static/ui/button.css

@@ -1,18 +1,26 @@
 html, body { 
     height: 100%;
     width: 100%;
-    position: fixed;
-    overflow: hidden;
 }
 
 .section, .container {
     height: 100%;
 }
 
-.container {
+.columns {
+    width: 100%;
+    height: 100%;
+}
+
+.button-column {
     display: flex;
     justify-content: center;
     flex-direction: column;
     align-items: center;
     text-align: center;
+    height: 100%;
+}
+
+.button-container {
+    position: absolute;
 }

ui/static/ui/button.js

@@ -1,6 +1,24 @@
 const csrftoken = getCookie('csrftoken');
 const button = document.getElementById("BUTTON");
 const count = document.getElementById("COUNT");
+const button_container = document.getElementById("button-container");
+const achievement = document.getElementById("achievement");
+const achievement_list = document.getElementById("achievement-list")
+
+function add_achievement(text) {
+    if (text != undefined) {
+        achievement.querySelector(".achievement-text").innerText = text;
+        achievement.classList.remove("achievement-animate");
+        void achievement.offsetWidth;
+        achievement.classList.add("achievement-animate");
+
+        var elem = document.createElement("div");
+        elem.innerText = text;
+        achievement_list.appendChild(elem);
+
+        achievement_list.scrollTo(0, achievement_list.scrollHeight);
+    }
+}
 
 // when button is clicked submit an empty post request
 button.addEventListener("click", event => {
@@ -18,6 +36,7 @@ button.addEventListener("click", event => {
         })
         .then((data) => {
             count.innerText = data.pressed;
+            add_achievement(data.achievement);
         }).finally(() => {
             button.disabled = false;
             button.classList.remove("is-loading");

ui/templates/ui/button.html

@@ -4,6 +4,7 @@
 
 {% block css %}
 <link rel="stylesheet" href="{% static 'ui/button.css' %}">
+<link rel="stylesheet" href="{% static 'ui/achievement.css' %}">
 {% endblock %}
 
 {% block js %}
@@ -13,7 +14,10 @@
 
 {% block body %}
 <section class="section">
-    <div class="container">
+    <div class="columns">
+        <div class="column">
+        </div>
+        <div class="button-column column">
             <div>
                 <h1 class="title">
                     The Button
@@ -24,6 +28,20 @@
             <div>
                 <h1 class="title" id="COUNT">{{ pressed }}</h1>
             </div>
+            <div id="achievement" class="achievement">
+                <div>
+                    <div class="achievement-text"></div>
+                </div>
+            </div>
+        </div>
+        <div class="column achievment-column">
+            <div class="achievements-list" id="achievement-list">
+                <h1 class="title">Achievements</h1>
+                {% for key,value in achievement.items %}
+                <div>{{ value }}</div>
+                {% endfor %}
+            </div>
+        </div>
     </div>
 </section>
 {% endblock %}

ui/tests.py

@@ -1,5 +1,5 @@
 from django.contrib.auth.models import AnonymousUser, User
-from django.test import RequestFactory, TestCase
+from django.test import RequestFactory, TestCase, Client
 
 from .views import button
 
@@ -11,24 +11,31 @@ class SimpleTest(TestCase):
             username='testuser', email='test@test.test', password='testpass')
 
     def test_button(self):
-        # Test button page returns 200
-        request = self.factory.get('/button')
-        request.session = self.client.session
-        response = button(request)
+        # Test initial load
+        c = Client()
+        response = c.get('/button')
+        self.assertEqual(response.status_code, 301)
+        response = c.get('/button/')
         self.assertEqual(response.status_code, 200)
+        self.assertEqual(response.context.get("achievement"), {})
 
-        # Test button post returns 200 and increments button to 1
-        request = self.factory.post(
-            '/button',
-            data={},
-            content_type='application/json'
-        )
-        request.session = self.client.session
-        response = button(request)
+        # Test first achievement
+        response = c.post('/button/', {})
         self.assertEqual(response.status_code, 200)
-        self.assertEqual(request.session.get('pressed'), 1)
+        self.assertEqual(response.json().get("pressed"), 1)
+        self.assertEqual(response.json().get("achievement"), "Clicked!")
+        self.assertEqual(c.session.get('pressed'), 1)
 
-        # Test second click increments button to 2
-        response = button(request)
+        # Test second achievement
+        response = c.post('/button/', {})
         self.assertEqual(response.status_code, 200)
-        self.assertEqual(request.session.get('pressed'), 2)
+        self.assertEqual(response.json().get("pressed"), 2)
+        self.assertEqual(response.json().get("achievement"), "Clicked Twice!")
+        self.assertEqual(c.session.get('pressed'), 2)
+
+        # Test no achievement
+        response = c.post('/button/', {})
+        self.assertEqual(response.status_code, 200)
+        self.assertEqual(response.json().get("pressed"), 3)
+        self.assertEqual(response.json().get("achievement"), None)
+        self.assertEqual(c.session.get('pressed'), 3)

ui/views.py

@@ -1,8 +1,61 @@
 from django.shortcuts import render
 from django.http import JsonResponse
 
+achievements = {
+    1: "Clicked!",
+    2: "Clicked Twice!",
+    4: "2^2",
+    8: "2^3",
+    16: "2^4",
+    24: "I'm that old",
+    32: "2^5",
+    64: "2^6",
+    69: "Nice",
+    100: "one hundred",
+    128: "2^7",
+    200: "two hundred",
+    250: "quarter thousand",
+    256: "2^8",
+    300: "three hundred",
+    400: "four hundred",
+    420: "Blaze it",
+    500: "half thousand",
+    512: "2^9",
+    600: "six hundred",
+    700: "seven hundred",
+    800: "eight hundred",
+    900: "nine hundred",
+    1000: "full thousand",
+    1024: "2^10",
+    1776: "America",
+    1914: "Some War here",
+    1938: "Some more war here",
+    1950: "Lots of war in here",
+    2000: "Computers die",
+    2008: "Houses die",
+    2019: "People die",
+    2048: "2048!",
+    2500: "Keep going!",
+    3000: "three thousand",
+    4000: "four thousand",
+    4096: "2^11",
+    5000: "halfway to ten thousand",
+    10001: "ten thousand one",
+    100000: "one hundred thousand",
+    1000000: "one million?",
+    10000000: "ten millions???",
+    100000000: "one hundo billion",
+    1000000000: "JK this is actually a billion though",
+    10000000000: "I'm not going to create another achievement",
+    100000000000: "one hundred billion",
+    1000000000000: "It's physically impossible to click this high"
+}
+
+
 def button(request):
     PRESSED = 'pressed'
+    ACHIEVE = 'achievement'
+
     try:
         request.session[PRESSED]
     except KeyError:
@@ -10,5 +63,14 @@ def button(request):
 
     if request.method == "POST":
         request.session[PRESSED] += 1
-        return JsonResponse({PRESSED: request.session[PRESSED]})
-    return render(request, "ui/button.html", {PRESSED: request.session[PRESSED]})
+        response = {
+            PRESSED: request.session[PRESSED],
+            ACHIEVE: achievements.get(request.session[PRESSED])
+        }
+        return JsonResponse(response)
+
+    pressed = request.session[PRESSED]
+    response = {PRESSED: pressed}
+    achieved = {k:v for k,v in achievements.items() if k <= pressed}
+    response.update({ACHIEVE: achieved})
+    return render(request, "ui/button.html", response)