I have content that references Images by ID within a placeholder (e.g. "$m(12345)" ). I have a REST call that will return an img-tag for the placeholder.
I would like CKEditor to display the image when the content is opened in editor, or a placeholder is inserted. But I want the placeholder to remain in the content (including when switching to the Source view)
I've tried to do this by adding a rule to the dataFilter:
CKEDITOR.on('instanceLoaded', function(ckeditor){
var mediaPlaceholderRegex = /\$m\(.*\)/;
ckeditor.editor.dataProcessor.dataFilter.addRules({
text: function( text, node ) {
return text.replace( mediaPlaceholderRegex, function( match ) {
var params = "placeholder="+match;
var xhttp = new XMLHttpRequest();
xhttp.open("POST", url, false);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send(params);
return xhttp.responseText;
} );
}
});
});
It does the job of replacing the placeholder with the image tag, but the img-tag is also there when switching to the source view.
Is there an easy way to only apply a filter to the wysiwyg view. The only way I see is to add a htmlFilter that would revert the img-tag back to a placeholder.