Implemented User Display on Habitlist
This commit is contained in:
parent
b6a9bf5520
commit
2dc3cbf047
19
app.py
19
app.py
@ -543,6 +543,16 @@ def add_user():
|
|||||||
if user.id == current_user.id:
|
if user.id == current_user.id:
|
||||||
errors['email'] = 'Du kannst dich nicht selbst hinzufügen.'
|
errors['email'] = 'Du kannst dich nicht selbst hinzufügen.'
|
||||||
|
|
||||||
|
# Check if user is already in the habit list
|
||||||
|
already = False
|
||||||
|
for u in habit_list.get_users():
|
||||||
|
if u.id == user.id:
|
||||||
|
already = True
|
||||||
|
break
|
||||||
|
|
||||||
|
if already:
|
||||||
|
errors['email'] = 'Teilnehmer ist bereits in der Liste.'
|
||||||
|
|
||||||
if errors:
|
if errors:
|
||||||
return render_template(
|
return render_template(
|
||||||
'users.html',
|
'users.html',
|
||||||
@ -557,14 +567,7 @@ def add_user():
|
|||||||
habit_list = HabitList.get(int(habit_list_id))
|
habit_list = HabitList.get(int(habit_list_id))
|
||||||
habit_list.add_user(user)
|
habit_list.add_user(user)
|
||||||
|
|
||||||
return render_template(
|
return redirect(url_for('index', habit_list=habit_list.id))
|
||||||
'users.html',
|
|
||||||
title='Teilnehmer',
|
|
||||||
habit_list=habit_list,
|
|
||||||
users=habit_list.get_users(),
|
|
||||||
errors={},
|
|
||||||
email=email,
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
# Run the application
|
# Run the application
|
||||||
|
|||||||
@ -53,15 +53,14 @@ class HabitList:
|
|||||||
raw_users = get_users(self.id)
|
raw_users = get_users(self.id)
|
||||||
users = []
|
users = []
|
||||||
for user in raw_users:
|
for user in raw_users:
|
||||||
user = User(user[0], user[1], user[2], user[3])
|
user = User(user[0], user[1], user[2], user[3], user[4])
|
||||||
users.append(user)
|
users.append(user)
|
||||||
|
|
||||||
return users
|
return users
|
||||||
|
|
||||||
|
|
||||||
# Adds a User by email to the HabitList
|
# Adds a User by email to the HabitList
|
||||||
def add_user(self, email: str):
|
def add_user(self, user: User):
|
||||||
user = User.get_by_email(email)
|
|
||||||
if user:
|
if user:
|
||||||
add_user(self.id, user.id)
|
add_user(self.id, user.id)
|
||||||
else:
|
else:
|
||||||
|
|||||||
@ -66,17 +66,18 @@
|
|||||||
<div class="row mb-3 align-items-center">
|
<div class="row mb-3 align-items-center">
|
||||||
|
|
||||||
<!-- Personen die zur Liste gehören -->
|
<!-- Personen die zur Liste gehören -->
|
||||||
<div class="col-2">
|
<div class="col">
|
||||||
<div class="avatar-stack">
|
<div class="avatar-stack">
|
||||||
<img class="avatar" src="/images/avatar/1.jpg"/>
|
{% for user in habit_list.get_users() %}
|
||||||
<img class="avatar" src="/images/avatar/2.jpg"/>
|
{% if current_user.id != user.id %}
|
||||||
<img class="avatar" src="/images/avatar/4.jpg"/>
|
<img class="avatar" src="/{{user.profile_image}}" data-toggle="tooltip" data-placement="top" title="{{user.name}}"/>
|
||||||
<img class="avatar" src="/images/avatar/5.jpg"/>
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Knopf für das Hinzufügen einer Person zur gemeinsamen Liste -->
|
<!-- Knopf für das Hinzufügen einer Person zur gemeinsamen Liste -->
|
||||||
<div class="col-1">
|
<div class="col">
|
||||||
<a href="/users?habit_list={{habit_list.id}}" style="width: 40px; height: 40px; min-height: 3em;">
|
<a href="/users?habit_list={{habit_list.id}}" style="width: 40px; height: 40px; min-height: 3em;">
|
||||||
|
|
||||||
<i class="bi bi-plus-circle"></i>
|
<i class="bi bi-plus-circle"></i>
|
||||||
|
|||||||
@ -1,81 +1,80 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
function checkCompletionAndAnimate(habitId, percentage) {
|
function checkCompletionAndAnimate(habitId, percentage) {
|
||||||
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 () {
|
||||||
habitBlock.classList.remove("animate-bounce");
|
habitBlock.classList.remove("animate-bounce");
|
||||||
}, 2000);
|
}, 2000);
|
||||||
} else {
|
} else {
|
||||||
progressBar.style.backgroundColor = "";
|
progressBar.style.backgroundColor = "";
|
||||||
habitBlock.classList.remove("animate-bounce");
|
habitBlock.classList.remove("animate-bounce");
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function sendPostRequest(checkboxId) {
|
||||||
|
// Get the checkbox element using the provided ID
|
||||||
|
var checkbox = document.getElementById(checkboxId);
|
||||||
|
// console.log(checkbox);
|
||||||
|
|
||||||
|
// Get the habit id from the checkbox id attribute
|
||||||
|
var habitId = checkboxId;
|
||||||
|
|
||||||
|
// Make a POST request to /check with the habit id
|
||||||
|
axios.post('/check', {habitId: habitId}, {
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json'
|
||||||
}
|
}
|
||||||
|
}).then(function (response) {
|
||||||
function sendPostRequest(checkboxId) {
|
// Handle the success response if needed
|
||||||
// Get the checkbox element using the provided ID
|
console.log(response.data);
|
||||||
var checkbox = document.getElementById(checkboxId);
|
|
||||||
// console.log(checkbox);
|
|
||||||
|
|
||||||
// Get the habit id from the checkbox id attribute
|
|
||||||
var habitId = checkboxId;
|
|
||||||
|
|
||||||
// Make a POST request to /check with the habit id
|
|
||||||
axios.post('/check', {habitId: habitId}, {
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json'
|
|
||||||
}
|
|
||||||
}).then(function (response) {
|
|
||||||
// Handle the success response if needed
|
|
||||||
console.log(response.data);
|
|
||||||
|
|
||||||
|
|
||||||
// Set the percentage of the habit. percentage received as integer
|
// Set the percentage of the habit. percentage received as integer
|
||||||
const percentage = response.data.percentage;
|
const percentage = response.data.percentage;
|
||||||
const 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 streak = response.data.streak;
|
||||||
const streakSymbol = document.getElementById("streak-" + habitId);
|
const streakSymbol = document.getElementById("streak-" + habitId);
|
||||||
streakSymbol.innerText = streak > 0 ? streak.toString() + " 🔥" : "";
|
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);
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function sendHabitId(Id) {
|
||||||
|
|
||||||
|
var habitId = document.getElementById(Id);
|
||||||
|
|
||||||
|
// Make a POST request to /check with the habit id
|
||||||
|
// axios.post('/edit-habit', {editHabitId: habitId})
|
||||||
|
}
|
||||||
|
|
||||||
|
function deleteHabit(habitId) {
|
||||||
|
// Make a POST request to /delete with the habit id
|
||||||
|
|
||||||
|
axios.post('/delete', {habitId: habitId}, {
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json'
|
||||||
}
|
}
|
||||||
|
}).then(function (response) {
|
||||||
|
// Handle the success response if needed
|
||||||
|
console.log(response.data);
|
||||||
|
|
||||||
function sendHabitId(Id) {
|
// Remove the habit from the DOM
|
||||||
|
var habitElement = document.getElementById("habit-" + habitId);
|
||||||
var habitId = document.getElementById(Id);
|
habitElement.remove();
|
||||||
|
}).catch(function (error) {
|
||||||
// Make a POST request to /check with the habit id
|
// Handle the error if needed
|
||||||
// axios.post('/edit-habit', {editHabitId: habitId})
|
console.error('Error:', error);
|
||||||
}
|
});
|
||||||
|
}
|
||||||
function deleteHabit(habitId) {
|
|
||||||
// Make a POST request to /delete with the habit id
|
|
||||||
|
|
||||||
axios.post('/delete', {habitId: habitId}, {
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json'
|
|
||||||
}
|
|
||||||
}).then(function (response) {
|
|
||||||
// Handle the success response if needed
|
|
||||||
console.log(response.data);
|
|
||||||
|
|
||||||
// Remove the habit from the DOM
|
|
||||||
var habitElement = document.getElementById("habit-" + habitId);
|
|
||||||
habitElement.remove();
|
|
||||||
}).catch(function (error) {
|
|
||||||
// Handle the error if needed
|
|
||||||
console.error('Error:', error);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', (event) => {
|
document.addEventListener('DOMContentLoaded', (event) => {
|
||||||
@ -106,6 +105,7 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$(function () {
|
||||||
|
$('[data-toggle="tooltip"]').tooltip()
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
Loading…
x
Reference in New Issue
Block a user