scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-02-20 22:03:03 +08:00
Code Issues Projects Releases Packages Wiki Activity

Remove placeholder plugin [SCI-7729]

Browse source
This commit is contained in:
Martin Artnik 2023-01-11 15:49:18 +01:00
parent b559352128
commit 33dca201ba
2 changed files with 1 additions and 76 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
app/javascript/packs/tiny_mce.js vendored
View file

@ -28,7 +28,6 @@ import 'tinymce/plugins/directionality';
import './tinymce/custom_image_uploader/plugin';
import './tinymce/marvinjs/plugin';
import './tinymce/image_toolbar/plugin';
import './tinymce/placeholder/plugin';
// Content styles, including inline UI like fake cursors
// All the above CSS files are loaded on to the page but these two must
@ -184,7 +183,7 @@ window.TinyMCE = (() => {
table autosave autoresize link advlist codesample autolink lists
charmap anchor searchreplace wordcount visualblocks visualchars
insertdatetime nonbreaking save directionality customimageuploader
marvinjs placeholder custom_image_toolbar help quickbars
marvinjs custom_image_toolbar help quickbars
`;
// if (typeof (MarvinJsEditor) !== 'undefined') plugins += ' marvinjsplugin';

74
app/javascript/packs/tinymce/placeholder/plugin.js
View file

@ -1,74 +0,0 @@
/* global tinymce */
tinymce.PluginManager.add('placeholder', (editor) => {
const Label = () => {
// const editorForm = $(editor.getContainer()).closest('form');
// const editorToolbar = editorForm.find('.tox-editor-header');
const placeholderText = editor.getElement().getAttribute('placeholder');
const placeholderAttrs = {
style: `
position: 'absolute',
top: '0px',
left: '0px',
color: '#888',
padding: '1%',
width: 'calc(100% - 50px)',
overflow: 'hidden',
'white-space': 'pre-wrap'
`
};
const contentAreaContainer = editor.getContentAreaContainer();
// Create label el
this.el = editor.dom.add(contentAreaContainer, 'label', placeholderAttrs, placeholderText);
};
editor.on('init', () => {
const label = new Label();
// Correct top css property due to notification bar
function calculatePlaceholderPosition() {
const editorForm = $(editor.getContainer()).closest('form');
const editorToolbar = editorForm.find('.mce-top-part');
const restoreDraftNotification = $(editorForm).find('.restore-draft-notification');
const restoreDraftHeight = restoreDraftNotification.context ? restoreDraftNotification.height() : 0;
const newTop = $(editorToolbar).height() + restoreDraftHeight;
$(label.el).css('top', `${newTop}px`);
}
function checkPlaceholder() {
// Show/hide depending on the content
if (editor.getContent() === '') {
label.show();
} else {
label.hide();
}
calculatePlaceholderPosition();
}
function onKeydown() {
label.hide();
}
$(label.el).click(() => {
editor.focus();
});
checkPlaceholder();
editor.on('focus blur change setContent keyup', checkPlaceholder);
editor.on('keydown mousedown', onKeydown);
});
Label.prototype.hide = () => {
editor.dom.setStyle(this.el, 'display', 'none');
};
Label.prototype.show = () => {
editor.dom.setStyle(this.el, 'display', '');
};
});