Skip to content

Commit

Permalink
Feat: implement edit contact dropdown
Browse files Browse the repository at this point in the history
  • Loading branch information
@henochit
henochit committed Aug 6, 2023
1 parent 39e8826 commit e2f31ba
Show file tree
Hide file tree
Showing 3 changed files with 22 additions and 11 deletions.
10 changes: 8 additions & 2 deletions modules/contacts/site.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,9 @@ var autocomplete_contact = function(e, class_name, list_div) {
var count = 0;
$(list_div).html('');
for (i in res.contact_suggestions) {
div.html(res.contact_suggestions[i]);
var suggestion = JSON.parse(res.contact_suggestions[i].replace(/"/g, '"'))

div.html(suggestion.contact);
if ($(class_name).val().match(div.text())) {
continue;
}
Expand All @@ -70,7 +72,7 @@ var autocomplete_contact = function(e, class_name, list_div) {
first = '';
}
count++;
$(list_div).append('<a tabindex="1" href="#" class="'+first+'contact_suggestion unread_link">'+res.contact_suggestions[i]+'</a>');
$(list_div).append('<a tabindex="1" href="#" class="'+first+'contact_suggestion" data-id="'+suggestion.contact_id+'" data-type="'+suggestion.type+'" data-source="'+suggestion.source+'" unread_link">'+suggestion.contact+'</a>');
}
if (count > 0) {
$(list_div).show();
Expand Down Expand Up @@ -147,6 +149,10 @@ var setup_autocomplete_events = function(class_name, list_div, fld_val) {
};

var add_autocomplete = function(event, class_name, list_div, fld_val) {
$(class_name).attr("data-id", $(event.target).data('id'));
$(class_name).attr("data-type", $(event.target).data('type'));
$(class_name).attr("data-source", $(event.target).data('source'));

if (!fld_val) {
fld_val = get_search_term(class_name);
}
Expand Down
4 changes: 2 additions & 2 deletions modules/smtp/site.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@
.bubble_dropdown-content {display: none;position: absolute;background-color: #f9f9f9;padding: 10px;border: 1px solid #ddd; min-width: 160px; z-index: 1;}
.bubble_dropdown-content.show {display: block;}
.bubble_dropdown-content ul {list-style-type: none;padding: 0;margin: 0;}
.bubble_dropdown-content ul li span {display: flex; align-items: center; padding: 8px 4px;text-decoration: none;color: #333;}
.bubble_dropdown-content ul li span:hover { background-color: #f1f1f1;cursor: pointer;}
.bubble_dropdown-content ul li span, .bubble_dropdown-content ul li a {display: flex; align-items: center; padding: 8px 4px;text-decoration: none;color: #333;}
.bubble_dropdown-content ul li span:hover, .bubble_dropdown-content ul li a:hover { background-color: #f1f1f1;cursor: pointer;}
.bubble_dropdown-content ul li img { width: 16px;height: 16px;margin-right: 8px;}

19 changes: 12 additions & 7 deletions modules/smtp/site.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -323,15 +323,17 @@ var resize_input = function(input) {
};

var text_to_bubbles = function(input) {
if ($(input).val()) {
var contact_id = input.getAttribute("data-id");
var contact_type = input.getAttribute("data-type");
var contact_source = input.getAttribute("data-source");

if ($(input).val() && contact_id) {
var recipients = $(input).val().split(/,|;/);
var invalid_recipients = '';

console.log("TEXT TO BUBBLES", $(input).val().split(/,|;/));

for (var i = 0; i < recipients.length; i++) {
if (is_valid_recipient(recipients[i])) {
append_bubble(recipients[i].trim(), input);
append_bubble(recipients[i].trim(), input, contact_id, contact_type, contact_source);
} else {
if (invalid_recipients) {
invalid_recipients = invalid_recipients + ', ';
Expand All @@ -345,8 +347,8 @@ var text_to_bubbles = function(input) {
};

var bubble_index = 0;
var append_bubble = function(value, to) {
var bubble = '<div id="bubble_'+bubble_index+'" class="bubble bubble_dropdown-toggle" onclick="toggle_bubble_dropdown(this)" draggable="true" data-value="'+value+'">'+value+'<span class="bubble_close">&times;</span></div>';
var append_bubble = function(value, to, id, type, source) {
var bubble = '<div id="bubble_'+bubble_index+'" class="bubble bubble_dropdown-toggle" onclick="toggle_bubble_dropdown(this)" draggable="true" data-id="'+id+'" data-type="'+type+'" data-source="'+source+'" data-value="'+value+'">'+value+'<span class="bubble_close">&times;</span></div>';
$(to).prev().append(bubble);
bubble_index++;
};
Expand All @@ -356,11 +358,14 @@ var toggle_bubble_dropdown = function(element) {

if (!dropdownContent) {
var textValue = element.dataset.value;
var contact_id = element.getAttribute('data-id');
var contact_type = element.getAttribute('data-type');
var contact_source = element.getAttribute('data-source');
var editIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAcQAAAHEBHD+AdwAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEESURBVDiNldO/LuxRFMXxz5KJRqFSKCU6IUIp0XoGkXgBDUFHoldQ6XQ6iUqlcm8iOh5AoUGp9C83dysQMn4zmVnJKU72/q61T7KPqtLPwRL+4BAjqSpJJjHrWw9VdaZNSVaxginMYznYwRguf/TeVdVpAzyHexTWcQFXPYy9imO0Pu97uMbmAAbaR+2QvFhV/36Uzqtqt284yR5U1Zpu6b3AHQ2SrPQCNxokCTYwhFY32FdDm2bw18eynCS5wf8muNMTFvCECUzjuQlOspVktGmCJ7zgDFtV9dyUjHEM/zKoqv0OQKO67kGvBo9JRvqBkgz6+D+3LWzjKMlwHx5vOKiq13cd46KPLEvGfQAAAABJRU5ErkJggg==';
var copyIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdAAAAHQBMYXlgQAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADUSURBVDiN7ZI9SgNBAIW/F0JECwubQAr7gIUgVjZ2Ymed2lzB2tIjeAEPIFh4ASsbTxGIlXaCwmeRXZxdzGpi64OB4c37KyYqJZIcAjfAgOV4BU7VGWrjACfAuM23NJfAuUq/aN4BdoE5sJFkv9X6rM6q+xssvP3KvAfcAU8ds8dJLtTbkqwXHAHX6tUyd5Iz4BhoBPTq947mRk6b6H2nWgX/AX8LcK2AJENgCjzA10f6fa3OkxyoL+WCD2DzB+9WpaM2A0QlyQi4B7Y7At6BifpYkp8XA1pTMGl6mgAAAABJRU5ErkJggg==';
dropdownContent = document.createElement('div');
dropdownContent.classList.add('bubble_dropdown-content');
dropdownContent.innerHTML = '<ul><li onclick="copy_text_to_clipboard(this)" data-value="'+textValue+'"><span><img src="'+copyIcon+'"> Copy</span></li><li><span><img src="'+editIcon+'"> Edit</span></li></ul>';
dropdownContent.innerHTML = '<ul><li><span data-value="'+textValue+'" onclick="copy_text_to_clipboard(this)"><img src="'+copyIcon+'"> Copy</span></li><li><a href="?page=contacts&contact_id='+contact_id+'&contact_source='+contact_source+'&contact_type='+contact_type+'"><img src="'+editIcon+'"> Edit</a></li></ul>';
element.parentNode.appendChild(dropdownContent);
}

Expand Down

0 comments on commit e2f31ba

Please sign in to comment.