54 lines
2.2 KiB
JavaScript
54 lines
2.2 KiB
JavaScript
|
(function(){
|
||
|
|
|
||
|
|
if (typeof window.customToolbarElements === 'undefined') { window.customToolbarElements = []; }
|
||
|
|
window.customToolbarElements.push({
|
||
|
|
identifier: 'content-headings',
|
||
|
|
button: {
|
||
|
|
title : 'Headings',
|
||
|
|
label : '<i class="fa fa-header content-headings"></i>',
|
||
|
|
class : 'heading-icon',
|
||
|
|
},
|
||
|
|
processAction: function(editor) {
|
||
|
|
|
||
|
|
if ($('#heading-dropdown').is(':visible')) {
|
||
|
|
$('#heading-dropdown').remove();
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
var dropdown = '<div id="heading-dropdown">';
|
||
|
|
dropdown += '<a href="javascript:void(0);" data-heading="# " class="heading-dropdown-h1">H1</a>';
|
||
|
|
dropdown += '<a href="javascript:void(0);" data-heading="## " class="heading-dropdown-h2">H2</a>';
|
||
|
|
dropdown += '<a href="javascript:void(0);" data-heading="### " class="heading-dropdown-h3">H3</a>';
|
||
|
|
dropdown += '<a href="javascript:void(0);" data-heading="#### " class="heading-dropdown-h4">H4</a>';
|
||
|
|
dropdown += '<a href="javascript:void(0);" data-heading="##### " class="heading-dropdown-h5">H5</a>';
|
||
|
|
dropdown += '<a href="javascript:void(0);" data-heading="###### " class="heading-dropdown-h6">H6</a>';
|
||
|
|
dropdown += '</div>';
|
||
|
|
|
||
|
|
var $headingDropdown = $('.heading-icon');
|
||
|
|
var $dropdown = $(dropdown)
|
||
|
|
.insertAfter($headingDropdown);
|
||
|
|
|
||
|
|
|
||
|
|
$dropdown.on('click', 'a', function () {
|
||
|
|
$('#heading-dropdown').remove();
|
||
|
|
|
||
|
|
var text = $(this).data('heading');
|
||
|
|
|
||
|
|
//Add text to the editor
|
||
|
|
var cm = editor.editor,
|
||
|
|
pos = cm.getDoc().getCursor(true),
|
||
|
|
posend = cm.getDoc().getCursor(false);
|
||
|
|
|
||
|
|
for (var i=pos.line; i<(posend.line+1);i++) {
|
||
|
|
cm.replaceRange(text+cm.getLine(i), { line: i, ch: 0 }, { line: i, ch: cm.getLine(i).length });
|
||
|
|
}
|
||
|
|
|
||
|
|
cm.setCursor({ line: posend.line, ch: cm.getLine(posend.line).length });
|
||
|
|
cm.focus();
|
||
|
|
});
|
||
|
|
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
})();
|