| 1 |
(function() { |
| 2 |
tinymce.create('tinymce.plugins.mentions', { |
| 3 |
init: function(ed, url) { |
| 4 |
ed.on('init', function() { |
| 5 |
var contentArea = jQuery(ed.getDoc()).find('body'); |
| 6 |
contentArea.attr('contenteditable', 'true'); |
| 7 |
|
| 8 |
var tribute = new Tribute({ |
| 9 |
trigger: '@', // Ensure @ is set as the trigger character |
| 10 |
values: function(text, cb) { |
| 11 |
console.log('Fetching mentions for:', text); // Debug log |
| 12 |
jQuery.ajax({ |
| 13 |
url: ajaxurl, // Use WordPress AJAX URL |
| 14 |
method: 'POST', |
| 15 |
data: { |
| 16 |
action: 'fetch_mentions', |
| 17 |
query: text |
| 18 |
}, |
| 19 |
success: function(response) { |
| 20 |
console.log('Mentions fetched:', response); // Debug log |
| 21 |
cb(response); |
| 22 |
}, |
| 23 |
error: function(error) { |
| 24 |
console.log('Error fetching mentions:', error); // Debug log |
| 25 |
} |
| 26 |
}); |
| 27 |
}, |
| 28 |
selectTemplate: function(item) { |
| 29 |
return '@' + item.original.name; |
| 30 |
}, |
| 31 |
lookup: 'name', |
| 32 |
fillAttr: 'name', |
| 33 |
menuItemLimit: 5, // Limit number of items displayed |
| 34 |
noMatchTemplate: function() { |
| 35 |
return '<li>No matches found</li>'; |
| 36 |
} |
| 37 |
}); |
| 38 |
|
| 39 |
tribute.attach(contentArea.get(0)); |
| 40 |
console.log('Tribute attached:', contentArea.get(0)); // Debug log |
| 41 |
|
| 42 |
// Debug Tribute.js events |
| 43 |
contentArea.on('tribute-active-true', function() { |
| 44 |
console.log('Tribute activated'); // Debug log |
| 45 |
}); |
| 46 |
|
| 47 |
contentArea.on('tribute-active-false', function() { |
| 48 |
console.log('Tribute deactivated'); // Debug log |
| 49 |
}); |
| 50 |
|
| 51 |
contentArea.on('tribute-replaced', function() { |
| 52 |
if (tribute.menuContainer) { |
| 53 |
tribute.menuContainer.classList.add('tribute-container'); |
| 54 |
console.log('Menu container initialized'); // Debug log |
| 55 |
} |
| 56 |
}); |
| 57 |
|
| 58 |
// Debug keyup and click events |
| 59 |
contentArea.on('keyup click', function(event) { |
| 60 |
console.log('Keyup or click event detected:', event); // Debug log |
| 61 |
console.log('Current content:', contentArea.text()); // Debug log |
| 62 |
|
| 63 |
if (tribute.isActive) { |
| 64 |
console.log('Tribute is active'); // Debug log |
| 65 |
var caretPos = contentArea.caret('offset'); |
| 66 |
var menuContainer = jQuery('.tribute-container'); |
| 67 |
if (menuContainer.length > 0) { |
| 68 |
menuContainer.css({ |
| 69 |
top: caretPos.top + 20, // Adjust position as needed |
| 70 |
left: caretPos.left |
| 71 |
}); |
| 72 |
} |
| 73 |
} else { |
| 74 |
console.log('Tribute is not active'); // Debug log |
| 75 |
} |
| 76 |
}); |
| 77 |
}); |
| 78 |
}, |
| 79 |
getInfo: function() { |
| 80 |
return { |
| 81 |
longname: 'Mentions Plugin', |
| 82 |
author: 'Your Name', |
| 83 |
version: '1.0' |
| 84 |
}; |
| 85 |
} |
| 86 |
}); |
| 87 |
// Register plugin |
| 88 |
tinymce.PluginManager.add('mentions', tinymce.plugins.mentions); |
| 89 |
})(); |
| 90 |
|