mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2025-01-22 07:28:15 +08:00
Merge pull request #4790 from artoscinote/ma_SCI_7729
Fix editor close when clicking restore notification [SCI-7729]
This commit is contained in:
commit
99b1bd5b68
8 changed files with 57 additions and 103 deletions
|
@ -18,19 +18,17 @@ function initEditMyModuleDescription() {
|
|||
if ($(this).hasClass('record-info-link')) return;
|
||||
e.stopPropagation();
|
||||
});
|
||||
TinyMCE.initIfHasDraft(viewObject);
|
||||
}
|
||||
|
||||
function initEditProtocolDescription() {
|
||||
var viewObject = $('#protocol_description_view');
|
||||
viewObject.on('click', function(e) {
|
||||
if ($(e.target).hasClass('record-info-link')) return;
|
||||
TinyMCE.init('#protocol_description_textarea', refreshProtocolStatusBar);
|
||||
TinyMCE.init('#protocol_description_textarea', { afterInitCallback: refreshProtocolStatusBar });
|
||||
}).on('click', 'a', function(e) {
|
||||
if ($(this).hasClass('record-info-link')) return;
|
||||
e.stopPropagation();
|
||||
});
|
||||
TinyMCE.initIfHasDraft(viewObject);
|
||||
}
|
||||
|
||||
function initCopyToRepository() {
|
||||
|
|
|
@ -140,7 +140,6 @@
|
|||
function processResult(ev, resultTypeEnum) {
|
||||
var $form = $(ev.target.form);
|
||||
$form.clearFormErrors();
|
||||
|
||||
textValidator(ev, $form.find('#result_name'), 0, GLOBAL_CONSTANTS.NAME_MAX_LENGTH);
|
||||
|
||||
switch (resultTypeEnum) {
|
||||
|
|
|
@ -29,7 +29,6 @@ var ProtocolRepositoryHeader = (function() {
|
|||
if ($(this).hasClass('record-info-link')) return;
|
||||
e.stopPropagation();
|
||||
});
|
||||
TinyMCE.initIfHasDraft(viewObject);
|
||||
}
|
||||
|
||||
return {
|
||||
|
|
49
app/javascript/packs/tiny_mce.js
vendored
49
app/javascript/packs/tiny_mce.js
vendored
|
@ -28,7 +28,15 @@ 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
|
||||
// be loaded into the editor iframe so they are loaded as strings and passed
|
||||
// to the init function.
|
||||
import 'raw-loader';
|
||||
import contentCss from '!!raw-loader!tinymce/skins/content/default/content.min.css';
|
||||
import contentUiCss from '!!raw-loader!tinymce/skins/ui/tinymce-5/content.min.css';
|
||||
const contentStyle = [contentCss, contentUiCss].map((s) => s.toString() ).join("\n");
|
||||
|
||||
window.TinyMCE = (() => {
|
||||
function initHighlightjs() {
|
||||
|
@ -85,6 +93,14 @@ window.TinyMCE = (() => {
|
|||
$(notificationBar).append(restoreBtn).append(cancelBtn);
|
||||
$(editor.contentAreaContainer).before(notificationBar);
|
||||
|
||||
// Prevents save on blur if clicking draft notification
|
||||
$('.restore-draft-notification').on('mousedown', () => {
|
||||
editor.isBlurTempDisabled = true;
|
||||
setTimeout(() => {
|
||||
editor.isBlurTempDisabled = false;
|
||||
}, 500);
|
||||
});
|
||||
|
||||
$(restoreBtn).click(() => {
|
||||
editor.plugins.autosave.restoreDraft();
|
||||
makeItDirty(editor);
|
||||
|
@ -167,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';
|
||||
|
||||
|
@ -185,6 +201,9 @@ window.TinyMCE = (() => {
|
|||
return tinyMCE.init({
|
||||
cache_suffix: '?v=6.3.1', // This suffix should be changed any time library is updated
|
||||
selector,
|
||||
skin: false,
|
||||
content_css: false,
|
||||
content_style: contentStyle,
|
||||
convert_urls: false,
|
||||
promotion: false,
|
||||
menu: {
|
||||
|
@ -195,11 +214,8 @@ window.TinyMCE = (() => {
|
|||
plugins,
|
||||
autoresize_bottom_margin: 20,
|
||||
placeholder: options.placeholder,
|
||||
skin: false,
|
||||
content_css: false,
|
||||
toolbar_sticky: true,
|
||||
toolbar_sticky_offset: editorToolbaroffset,
|
||||
content_style: "body { font-family: Lato, sans-serif; }",
|
||||
codesample_languages: [
|
||||
{ text: 'R', value: 'r' },
|
||||
{ text: 'MATLAB', value: 'matlab' },
|
||||
|
@ -357,6 +373,8 @@ window.TinyMCE = (() => {
|
|||
if (options.afterInitCallback) { options.afterInitCallback(); }
|
||||
},
|
||||
setup: (editor) => {
|
||||
editor.isBlurTempDisabled = false;
|
||||
|
||||
editor.on('keydown', (e) => {
|
||||
if (e.key === 'Enter' && $(editor.contentDocument.activeElement).atwho('isSelecting')) {
|
||||
return false;
|
||||
|
@ -393,7 +411,7 @@ window.TinyMCE = (() => {
|
|||
});
|
||||
|
||||
editor.on('blur', () => {
|
||||
if (editor.blurDisabled) return false;
|
||||
if (editor.isBlurTempDisabled || editor.blurDisabled) return false;
|
||||
|
||||
if ($('.atwho-view:visible').length || $('#MarvinJsModal:visible').length) return false;
|
||||
setTimeout(() => {
|
||||
|
@ -427,7 +445,7 @@ window.TinyMCE = (() => {
|
|||
this.destroyAll();
|
||||
this.init();
|
||||
},
|
||||
getContent: () => tinyMCE.activeEditor.getContent(),
|
||||
getContent: () => tinyMCE.activeEditor && tinyMCE.activeEditor.getContent(),
|
||||
updateImages: (editor) => {
|
||||
const iframe = $(`#${editor.id}`).next().find('.tox-edit-area iframe').contents();
|
||||
const images = $.map($('img', iframe), e => e.dataset.mceToken);
|
||||
|
@ -437,20 +455,7 @@ window.TinyMCE = (() => {
|
|||
makeItDirty: (editor) => {
|
||||
makeItDirty(editor);
|
||||
},
|
||||
highlight: initHighlightjs,
|
||||
initIfHasDraft: (viewObject) => {
|
||||
const storedDrafts = sessionStorage.getItem(draftLocation());
|
||||
const draftName = viewObject.data('tinymce-init');
|
||||
if (storedDrafts && JSON.parse(storedDrafts)[0] === draftName) {
|
||||
const top = viewObject.offset().top;
|
||||
setTimeout(() => {
|
||||
viewObject.click();
|
||||
}, 0);
|
||||
setTimeout(() => {
|
||||
window.scrollTo(0, top - 150);
|
||||
}, 2000);
|
||||
}
|
||||
}
|
||||
highlight: initHighlightjs
|
||||
};
|
||||
})();
|
||||
|
||||
|
@ -467,5 +472,5 @@ $(document).on('turbolinks:before-visit', (e) => {
|
|||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
return false;
|
||||
return true;
|
||||
});
|
||||
|
|
|
@ -1,2 +1 @@
|
|||
@import "tinymce/skins/ui/tinymce-5/skin.min.css";
|
||||
@import "tinymce/skins/ui/tinymce-5/content.min.css";
|
||||
|
|
|
@ -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', '');
|
||||
};
|
||||
});
|
|
@ -86,6 +86,7 @@
|
|||
"precss": "^2.0.0",
|
||||
"prop-types": "^15.7.2",
|
||||
"rails-erb-loader": "^5.4.2",
|
||||
"raw-loader": "^4.0.2",
|
||||
"react": "^16.8.6",
|
||||
"react-bootstrap": "^0.31.5",
|
||||
"react-bootstrap-table": "^4.3.1",
|
||||
|
|
29
yarn.lock
29
yarn.lock
|
@ -3716,6 +3716,11 @@ emojis-list@^2.0.0:
|
|||
resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-2.1.0.tgz#4daa4d9db00f9819880c79fa457ae5b09a1fd389"
|
||||
integrity sha1-TapNnbAPmBmIDHn6RXrlsJof04k=
|
||||
|
||||
emojis-list@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-3.0.0.tgz#5570662046ad29e2e916e71aae260abdff4f6a78"
|
||||
integrity sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==
|
||||
|
||||
encodeurl@~1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
|
||||
|
@ -6106,6 +6111,11 @@ json5@^2.1.0:
|
|||
dependencies:
|
||||
minimist "^1.2.0"
|
||||
|
||||
json5@^2.1.2:
|
||||
version "2.2.3"
|
||||
resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.3.tgz#78cd6f1a19bdc12b73db5ad0c61efd66c1e29283"
|
||||
integrity sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==
|
||||
|
||||
jsonfile@^2.1.0:
|
||||
version "2.4.0"
|
||||
resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-2.4.0.tgz#3736a2b428b87bbda0cc83b53fa3d633a35c2ae8"
|
||||
|
@ -6274,6 +6284,15 @@ loader-utils@1.2.3, loader-utils@^1.0.1, loader-utils@^1.0.2, loader-utils@^1.1.
|
|||
emojis-list "^2.0.0"
|
||||
json5 "^1.0.1"
|
||||
|
||||
loader-utils@^2.0.0:
|
||||
version "2.0.4"
|
||||
resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-2.0.4.tgz#8b5cb38b5c34a9a018ee1fc0e6a066d1dfcc528c"
|
||||
integrity sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==
|
||||
dependencies:
|
||||
big.js "^5.2.2"
|
||||
emojis-list "^3.0.0"
|
||||
json5 "^2.1.2"
|
||||
|
||||
locate-path@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e"
|
||||
|
@ -8995,6 +9014,14 @@ raw-body@2.5.1:
|
|||
iconv-lite "0.4.24"
|
||||
unpipe "1.0.0"
|
||||
|
||||
raw-loader@^4.0.2:
|
||||
version "4.0.2"
|
||||
resolved "https://registry.yarnpkg.com/raw-loader/-/raw-loader-4.0.2.tgz#1aac6b7d1ad1501e66efdac1522c73e59a584eb6"
|
||||
integrity sha512-ZnScIV3ag9A4wPX/ZayxL/jZH+euYb6FcUinPcgiQW0+UBtEv0O6Q3lGd3cqJ+GHH+rksEv3Pj99oxJ3u3VIKA==
|
||||
dependencies:
|
||||
loader-utils "^2.0.0"
|
||||
schema-utils "^3.0.0"
|
||||
|
||||
rc@^1.2.7:
|
||||
version "1.2.8"
|
||||
resolved "https://registry.yarnpkg.com/rc/-/rc-1.2.8.tgz#cd924bf5200a075b83c188cd6b9e211b7fc0d3ed"
|
||||
|
@ -9783,7 +9810,7 @@ schema-utils@^1.0.0:
|
|||
ajv-errors "^1.0.0"
|
||||
ajv-keywords "^3.1.0"
|
||||
|
||||
schema-utils@^3.1.0, schema-utils@^3.1.1:
|
||||
schema-utils@^3.0.0, schema-utils@^3.1.0, schema-utils@^3.1.1:
|
||||
version "3.1.1"
|
||||
resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-3.1.1.tgz#bc74c4b6b6995c1d88f76a8b77bea7219e0c8281"
|
||||
integrity sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==
|
||||
|
|
Loading…
Reference in a new issue