53 lines
1.7 KiB
JavaScript
53 lines
1.7 KiB
JavaScript
tinymce.PluginManager.add('placeholder', function(editor) {
|
|
editor.on('init', function() {
|
|
var label = new Label;
|
|
|
|
onBlur();
|
|
|
|
tinymce.DOM.bind(label.el, 'click', onFocus);
|
|
editor.on('focus', onFocus);
|
|
editor.on('blur', onBlur);
|
|
editor.on('change', onBlur);
|
|
editor.on('setContent', onBlur);
|
|
editor.on('keydown', onKeydown);
|
|
|
|
function onFocus() {
|
|
if (!editor.settings.readonly === true) {
|
|
label.hide();
|
|
}
|
|
editor.execCommand('mceFocus', false);
|
|
}
|
|
|
|
function onBlur() {
|
|
if (editor.getContent() == '') {
|
|
label.show();
|
|
} else {
|
|
label.hide();
|
|
}
|
|
}
|
|
|
|
function onKeydown(){
|
|
label.hide();
|
|
}
|
|
});
|
|
|
|
var Label = function(){
|
|
var placeholder_text = editor.getElement().getAttribute("placeholder") || editor.settings.placeholder;
|
|
var placeholder_attrs = editor.settings.placeholder_attrs || {style: {position: 'absolute', top:'5px', left:0, color: '#888', padding: '1%', width:'98%', overflow: 'hidden', 'white-space': 'pre-wrap'} };
|
|
var contentAreaContainer = editor.getContentAreaContainer();
|
|
|
|
tinymce.DOM.setStyle(contentAreaContainer, 'position', 'relative');
|
|
|
|
// Create label el
|
|
this.el = tinymce.DOM.add( contentAreaContainer, editor.settings.placeholder_tag || "label", placeholder_attrs, placeholder_text );
|
|
}
|
|
|
|
Label.prototype.hide = function(){
|
|
tinymce.DOM.setStyle( this.el, 'display', 'none' );
|
|
}
|
|
|
|
Label.prototype.show = function(){
|
|
tinymce.DOM.setStyle( this.el, 'display', '' );
|
|
}
|
|
});
|