Kobe/docupulse
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

convo manager separation

Browse Source
This commit is contained in:
Kobe
2025-05-28 10:01:04 +02:00
parent c9c0eba15b
commit b091f1bb4e
3 changed files with 115 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
static/css/member-management.css Normal file
View File

@@ -0,0 +1,25 @@
.member-avatar {
width: 40px;
height: 40px;
border-radius: 50%;
object-fit: cover;
margin-right: 1rem;
}
.badge-creator {
background-color: #d1f2eb;
color: #117a65;
font-weight: 500;
}
.btn-remove-member {
background: #f8d7da;
color: #c82333;
border: none;
font-weight: 500;
}
.btn-remove-member:hover {
background: #f5c6cb;
color: #a71d2a;
}

88
static/js/create-conversation.js Normal file
View File

@@ -0,0 +1,88 @@
$(document).ready(function() {
$('.select2').select2({
theme: 'bootstrap-5',
width: '100%',
placeholder: 'Search for a user...',
allowClear: true
});
// Keep track of added members
var addedMembers = new Set();
var creatorId = document.querySelector('.member-row').dataset.userId;
addedMembers.add(creatorId);
// Function to show alert modal
function showAlert(message) {
$('#alertModalMessage').text(message);
var alertModal = new bootstrap.Modal(document.getElementById('alertModal'));
alertModal.show();
}
// Handle Add Member button click
$('#addMemberBtn').click(function() {
var selectedUserId = $('#user_id').val();
var selectedUserName = $('#user_id option:selected').text();
var selectedUserEmail = $('#user_id option:selected').data('email') || '';
var selectedUserAvatar = $('#user_id option:selected').data('avatar') || "/static/default-avatar.png";
if (!selectedUserId) {
showAlert('Please select a user to add.');
return;
}
if (addedMembers.has(selectedUserId)) {
showAlert('This user has already been added.');
return;
}
// Add to the set of added members
addedMembers.add(selectedUserId);
// Disable the option in the dropdown
$('#user_id option[value="' + selectedUserId + '"]').prop('disabled', true);
$('#user_id').val(null).trigger('change');
// Create the member list item
var memberItem = $('<div class="list-group-item d-flex align-items-center member-row" data-user-id="' + selectedUserId + '">')
.append($('<img class="member-avatar">').attr('src', selectedUserAvatar))
.append($('<div class="flex-grow-1">')
.append($('<div class="fw-bold">').text(selectedUserName))
.append($('<div class="text-muted small">').text(selectedUserEmail))
)
.append($('<button type="button" class="btn btn-remove-member ms-2">')
.append($('<i class="fas fa-user-minus me-1"></i>'))
.append('Remove')
.click(function() {
$(this).closest('.list-group-item').remove();
addedMembers.delete(selectedUserId);
// Re-enable the option in the dropdown
$('#user_id option[value="' + selectedUserId + '"]').prop('disabled', false);
$('#user_id').trigger('change');
updateHiddenInputs();
})
);
// Add to the list
$('#selectedMembersList').append(memberItem);
// Update hidden inputs
updateHiddenInputs();
});
function updateHiddenInputs() {
// Remove any existing members inputs
$('#conversationForm input[name="members"]').remove();
// Add new hidden inputs for each member
addedMembers.forEach(function(memberId) {
var input = $('<input>')
.attr('type', 'hidden')
.attr('name', 'members')
.val(memberId);
$('#conversationForm').append(input);
});
}
// Initialize hidden inputs
updateHiddenInputs();
});

92
templates/conversations/create_conversation.html
View File

@@ -6,6 +6,7 @@
{% block extra_css %}
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<link href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.3.0/dist/select2-bootstrap-5-theme.min.css" rel="stylesheet" />
<link href="{{ url_for('static', filename='css/member-management.css') }}" rel="stylesheet" />
<style>
.member-avatar {
width: 40px;
@@ -145,94 +146,5 @@
{% block extra_js %}
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
$(document).ready(function() {
$('.select2').select2({
theme: 'bootstrap-5',
width: '100%',
placeholder: 'Search for a user...',
allowClear: true
});
// Keep track of added members
var addedMembers = new Set();
var creatorId = '{{ current_user.id }}';
addedMembers.add(creatorId);
// Function to show alert modal
function showAlert(message) {
$('#alertModalMessage').text(message);
var alertModal = new bootstrap.Modal(document.getElementById('alertModal'));
alertModal.show();
}
// Handle Add Member button click
$('#addMemberBtn').click(function() {
var selectedUserId = $('#user_id').val();
var selectedUserName = $('#user_id option:selected').text();
var selectedUserEmail = $('#user_id option:selected').data('email') || '';
var selectedUserAvatar = $('#user_id option:selected').data('avatar') || "{{ url_for('static', filename='default-avatar.png') }}";
if (!selectedUserId) {
showAlert('Please select a user to add.');
return;
}
if (addedMembers.has(selectedUserId)) {
showAlert('This user has already been added.');
return;
}
// Add to the set of added members
addedMembers.add(selectedUserId);
// Disable the option in the dropdown
$('#user_id option[value="' + selectedUserId + '"]').prop('disabled', true);
$('#user_id').val(null).trigger('change');
// Create the member list item
var memberItem = $('<div class="list-group-item d-flex align-items-center member-row" data-user-id="' + selectedUserId + '">')
.append($('<img class="member-avatar">').attr('src', selectedUserAvatar))
.append($('<div class="flex-grow-1">')
.append($('<div class="fw-bold">').text(selectedUserName))
.append($('<div class="text-muted small">').text(selectedUserEmail))
)
.append($('<button type="button" class="btn btn-remove-member ms-2">')
.append($('<i class="fas fa-user-minus me-1"></i>'))
.append('Remove')
.click(function() {
$(this).closest('.list-group-item').remove();
addedMembers.delete(selectedUserId);
// Re-enable the option in the dropdown
$('#user_id option[value="' + selectedUserId + '"]').prop('disabled', false);
$('#user_id').trigger('change');
updateHiddenInputs();
})
);
// Add to the list
$('#selectedMembersList').append(memberItem);
// Update hidden inputs
updateHiddenInputs();
});
function updateHiddenInputs() {
// Remove any existing members inputs
$('#conversationForm input[name="members"]').remove();
// Add new hidden inputs for each member
addedMembers.forEach(function(memberId) {
var input = $('<input>')
.attr('type', 'hidden')
.attr('name', 'members')
.val(memberId);
$('#conversationForm').append(input);
});
}
// Initialize hidden inputs
updateHiddenInputs();
});
</script>
<script src="{{ url_for('static', filename='js/create-conversation.js') }}"></script>
{% endblock %}