Compare commits
6 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
e102db9f38 | ||
|
|
15c5f5293a | ||
|
|
f11f9a0d97 | ||
|
|
c80ef7441d | ||
|
|
a2e7a92280 | ||
|
|
b4ef050e1f |
@@ -1,8 +1,6 @@
|
|||||||
variables:
|
variables:
|
||||||
CI_PROJECT_DIR: "."
|
CI_PROJECT_DIR: "."
|
||||||
CI_REGISTRY_IMAGE: hub.ducoterra.net/ducoterra/mysite
|
CI_REGISTRY_IMAGE: hub.ducoterra.net/ducoterra/mysite
|
||||||
DEPLOY_TEST: test
|
|
||||||
DEPLOY_PROD: prod
|
|
||||||
|
|
||||||
stages:
|
stages:
|
||||||
- build
|
- build
|
||||||
@@ -18,6 +16,7 @@ build:
|
|||||||
name: gcr.io/kaniko-project/executor:debug
|
name: gcr.io/kaniko-project/executor:debug
|
||||||
entrypoint: [""]
|
entrypoint: [""]
|
||||||
script:
|
script:
|
||||||
|
- echo $DEPLOY
|
||||||
- /kaniko/executor --context $CI_PROJECT_DIR --dockerfile $CI_PROJECT_DIR/Dockerfile --destination $CI_REGISTRY_IMAGE:$CI_COMMIT_TAG
|
- /kaniko/executor --context $CI_PROJECT_DIR --dockerfile $CI_PROJECT_DIR/Dockerfile --destination $CI_REGISTRY_IMAGE:$CI_COMMIT_TAG
|
||||||
|
|
||||||
test:
|
test:
|
||||||
@@ -32,6 +31,8 @@ test:
|
|||||||
- python manage.py test
|
- python manage.py test
|
||||||
|
|
||||||
deploy_to_test:
|
deploy_to_test:
|
||||||
|
variables:
|
||||||
|
DEPLOY: test
|
||||||
stage: deploy
|
stage: deploy
|
||||||
only:
|
only:
|
||||||
variables:
|
variables:
|
||||||
@@ -52,6 +53,8 @@ deploy_to_test:
|
|||||||
- ./kubectl exec $POD -- python manage.py migrate
|
- ./kubectl exec $POD -- python manage.py migrate
|
||||||
|
|
||||||
deploy_to_prod:
|
deploy_to_prod:
|
||||||
|
variables:
|
||||||
|
DEPLOY: prod
|
||||||
stage: deploy
|
stage: deploy
|
||||||
only:
|
only:
|
||||||
variables:
|
variables:
|
||||||
|
|||||||
29
ui/static/ui/achievement.css
Normal file
29
ui/static/ui/achievement.css
Normal file
@@ -0,0 +1,29 @@
|
|||||||
|
.achievement {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
text-align: center;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.achievement-animate {
|
||||||
|
animation-name: moveup;
|
||||||
|
animation-duration: 2s;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
.achievement-text {
|
||||||
|
font-size: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes moveup {
|
||||||
|
from {bottom: 0px;}
|
||||||
|
to {bottom: 200px; color: white;}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeout {
|
||||||
|
from {}
|
||||||
|
to {color: transparent;}
|
||||||
|
}
|
||||||
@@ -1,7 +1,8 @@
|
|||||||
html, body {
|
html, body {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
touch-action: manipulation;
|
position: fixed;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.section, .container {
|
.section, .container {
|
||||||
|
|||||||
@@ -1,6 +1,47 @@
|
|||||||
const csrftoken = getCookie('csrftoken');
|
const csrftoken = getCookie('csrftoken');
|
||||||
const button = document.getElementById("BUTTON");
|
const button = document.getElementById("BUTTON");
|
||||||
const count = document.getElementById("COUNT");
|
const count = document.getElementById("COUNT");
|
||||||
|
const button_container = document.getElementById("button-container");
|
||||||
|
const achievement = document.getElementById("achievement");
|
||||||
|
|
||||||
|
const achievements = {
|
||||||
|
1: "Clicked!",
|
||||||
|
2: "Clicked Twice!",
|
||||||
|
4: "2^2",
|
||||||
|
8: "2^3",
|
||||||
|
16: "2^4",
|
||||||
|
32: "2^5",
|
||||||
|
64: "2^6",
|
||||||
|
69: "Sixty-Nine",
|
||||||
|
100: "one hundred",
|
||||||
|
128: "2^7",
|
||||||
|
200: "two hundred",
|
||||||
|
250: "quarter thousand",
|
||||||
|
256: "2^8",
|
||||||
|
420: "Blaze it",
|
||||||
|
500: "half thousand",
|
||||||
|
512: "2^9",
|
||||||
|
1000: "one thousand",
|
||||||
|
1024: "2^10",
|
||||||
|
2048: "2048!",
|
||||||
|
2500: "Keep going!",
|
||||||
|
4096: "2^11",
|
||||||
|
5000: "halfway to ten thousand"
|
||||||
|
}
|
||||||
|
|
||||||
|
function add_achievement(text) {
|
||||||
|
achievement.querySelector(".achievement-text").innerText = text;
|
||||||
|
achievement.classList.remove("achievement-animate");
|
||||||
|
void achievement.offsetWidth;
|
||||||
|
achievement.classList.add("achievement-animate");
|
||||||
|
}
|
||||||
|
|
||||||
|
function check_achievement(count) {
|
||||||
|
current_achievement = achievements[Number(count)]
|
||||||
|
if (current_achievement != undefined) {
|
||||||
|
add_achievement(current_achievement)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// when button is clicked submit an empty post request
|
// when button is clicked submit an empty post request
|
||||||
button.addEventListener("click", event => {
|
button.addEventListener("click", event => {
|
||||||
@@ -18,6 +59,7 @@ button.addEventListener("click", event => {
|
|||||||
})
|
})
|
||||||
.then((data) => {
|
.then((data) => {
|
||||||
count.innerText = data.pressed;
|
count.innerText = data.pressed;
|
||||||
|
check_achievement(data.pressed);
|
||||||
}).finally(() => {
|
}).finally(() => {
|
||||||
button.disabled = false;
|
button.disabled = false;
|
||||||
button.classList.remove("is-loading");
|
button.classList.remove("is-loading");
|
||||||
|
|||||||
@@ -5,7 +5,7 @@
|
|||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<title>The Button</title>
|
<title>The Button</title>
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.8.2/css/bulma.min.css">
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.8.2/css/bulma.min.css">
|
||||||
<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
|
<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
|
||||||
|
|||||||
@@ -4,6 +4,7 @@
|
|||||||
|
|
||||||
{% block css %}
|
{% block css %}
|
||||||
<link rel="stylesheet" href="{% static 'ui/button.css' %}">
|
<link rel="stylesheet" href="{% static 'ui/button.css' %}">
|
||||||
|
<link rel="stylesheet" href="{% static 'ui/achievement.css' %}">
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block js %}
|
{% block js %}
|
||||||
@@ -13,7 +14,12 @@
|
|||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<section class="section">
|
<section class="section">
|
||||||
<div class="container">
|
<div id = "button-container" class="container">
|
||||||
|
<div id = "achievement" class="achievement">
|
||||||
|
<div>
|
||||||
|
<div class="achievement-text"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h1 class="title">
|
<h1 class="title">
|
||||||
The Button
|
The Button
|
||||||
|
|||||||
Reference in New Issue
Block a user