I'm upgrading an old internal system used in my academic department. The page that I'm rewriting allows users to modify webpages containing information and content relevant to a course. The old system is using cleditor which I am replacing with the free version of tinyMCE 6.2.0.
One of the functionalities that needs to be replaced is a custom button that brings up a list of URLs to uploaded content and then turns the highlighted text into a link to the selected content (example of this in current system). I have been able to create my own custom button, and I have found the panel
and selectbox
features, but I haven't found how to populate the list in selectbox
using a URL like one can for link_list
.
Below is an example of the javascript that I have:
tinymce.init({
selector: '.course_page_editor',
toolbar: 'custContentLink',
setup: (editor) => {
editor.ui.registry.addButton('custContentLink', {
text: 'Insert Content Link',
onAction: (_) => insert_content_link_dialog(tinymce.activeEditor)
});
}
});
function insert_content_link_dialog(editor)
{
editor.windowManager.open({
title: 'Insert Content Link',
body: {
type: 'panel',
items: [{
type: 'selectbox',
name: 'content_list',
label: 'Choose the file that the link should point to:',
size: 5,
//TODO: generate list of uploaded content URLs
items: [
{text: 'Primary', value: 'primary style'},
{text: 'Success', value: 'success style'},
{text: 'Error', value: 'error style'}
],
flex: true
}]
},
onSubmit: function () {
//TODO: replace highlighted text with selected link
},
buttons: [
{
text: 'Close',
type: 'cancel',
onclick: 'close'
},
{
text: 'Add content link',
type: 'submit',
primary: true,
enabled: true
}
]
});
};
How do I create a popup list of links to server side content
My original process was overly complicated. TinyMCE has the link_list functionality which does exactly what I'm looking for. I then created a page to return a JSON array of link items as outlined in this other question I asked.