Habit Streak Update++

This commit is contained in:
Yapollon 2024-03-01 07:53:47 +01:00
parent fc570208bf
commit a8a3382f15
3 changed files with 10 additions and 4 deletions

1
app.py
View File

@ -428,6 +428,7 @@ def check_habit():
"habitId": habit_id, "habitId": habit_id,
"unchecked": not delete_tracking, "unchecked": not delete_tracking,
"percentage": habit.percentage, "percentage": habit.percentage,
"streak": habit.streak
} }

View File

@ -121,7 +121,7 @@
</div> </div>
<!-- Streak --> <!-- Streak -->
<div class="col-2" style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis"> <div class="col-2" id="streak-{{ habit.id }}" style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis">
{% if not habit.streak == 0 %} {% if not habit.streak == 0 %}
{{ habit.streak }} 🔥 {{ habit.streak }} 🔥
{% endif %} {% endif %}

View File

@ -4,7 +4,7 @@
var progressBar = document.getElementById("progress-bar-" + habitId); var progressBar = document.getElementById("progress-bar-" + habitId);
var habitBlock = document.getElementById("habit-" + habitId); var habitBlock = document.getElementById("habit-" + habitId);
if (percentage == 100) { if (percentage === 100) {
progressBar.style.backgroundColor = "green"; progressBar.style.backgroundColor = "green";
habitBlock.classList.add("animate-bounce"); habitBlock.classList.add("animate-bounce");
setTimeout(function () { setTimeout(function () {
@ -33,11 +33,16 @@
// Handle the success response if needed // Handle the success response if needed
console.log(response.data); console.log(response.data);
// Set the percentage of the habit. percentage received as integer // Set the percentage of the habit. percentage received as integer
var percentage = response.data.percentage; const percentage = response.data.percentage;
var progressBar = document.getElementById("progress-bar-" + habitId); const progressBar = document.getElementById("progress-bar-" + habitId);
progressBar.style.width = percentage + "%"; progressBar.style.width = percentage + "%";
checkCompletionAndAnimate(habitId, percentage); checkCompletionAndAnimate(habitId, percentage);
const streak = response.data.streak;
const streakSymbol = document.getElementById("streak-" + habitId);
streakSymbol.innerText = streak > 0 ? streak.toString() + " 🔥" : "";
}).catch(function (error) { }).catch(function (error) {
// Handle the error if needed // Handle the error if needed
console.error('Error:', error); console.error('Error:', error);