scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2024-11-15 05:34:53 +08:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #8021 from andrej-scinote/aj_SCI_11241

Browse source 
Fix displaying of long TinyMCE tables [SCI-11241]
This commit is contained in:
andrej-scinote 2024-11-08 11:11:18 +01:00 committed by GitHub
commit d5e21019cd
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 23 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
app/assets/javascripts/my_modules/protocols.js
View file

@ -29,7 +29,8 @@ function initEditMyModuleDescription() {
});
setTimeout(function() {
TinyMCE.wrapTables(viewObject);
const notesContainerEl = document.getElementById('notes-container');
window.wrapTables(notesContainerEl);
}, 100);
}
@ -327,16 +328,6 @@ function initAccessModal() {
});
}
function initWrapTables() {
const viewMode = new URLSearchParams(window.location.search).get('view_mode');
if (['archived', 'locked'].includes(viewMode)) {
setTimeout(() => {
const notesContainerEl = document.getElementById('notes-container');
window.wrapTables(notesContainerEl);
}, 100);
}
}
/**
* Initializes page
*/
@ -348,7 +339,6 @@ function init() {
initProtocolSectionOpenEvent();
initDetailsDropdown();
initAccessModal();
initWrapTables();
}
init();

21
app/assets/javascripts/shareable_links/handson_table_wraping.js
View file

@ -1,17 +1,12 @@
/* global */
(function () {
const rtf = $('.rtf-view').toArray();
for (let i = 0; i < rtf.length; i += 1) {
const container = $(rtf[i]).find('table').toArray();
for (let j = 0; j < container.length; j += 1) {
const table = $(container[j]);
if ($(table).parent().hasClass('table-wrapper')) return;
$(table).wrap(`
<div class="table-wrapper w-full" style="overflow: auto;"></div>
`);
}
}
$('.rtf-view').toArray().forEach((rtf) => {
$(rtf).find('table').toArray().forEach((table) => {
if ($(table).parents('table').length === 0) {
$(table).css('float', 'none')
.wrapAll('<div class="table-wrapper w-full" style="overflow: auto"></div>');
}
});
});
}());

27
app/assets/javascripts/sitewide/utils.js
View file

@ -142,23 +142,14 @@ $.fn.initSubmitModal = function(modalID, modelName) {
* @returns {string} - HTML with tables wrapped.
*/
function wrapTables(htmlStringOrDomEl) {
if (typeof htmlStringOrDomEl === 'string') {
const container = $(`<span class="text-base">${htmlStringOrDomEl}</span>`);
container.find('table').toArray().forEach((table) => {
if ($(table).parent().hasClass('table-wrapper')) return;
$(table).css('float', 'none').wrapAll(`
<div class="table-wrapper" style="overflow: auto; width: 100%"></div>
`);
});
return container.prop('outerHTML');
}
// Check if the value is a DOM element
if (htmlStringOrDomEl instanceof Element) {
const tableElement = $(htmlStringOrDomEl).find('table');
if (tableElement.length > 0) {
tableElement.wrap('<div class="table-wrapper" style="overflow: auto; width: 100%"></div>');
const updatedHtml = $(htmlStringOrDomEl).html();
$(htmlStringOrDomEl).replaceWith(updatedHtml);
const htmlContent = `<span class="text-base">${htmlStringOrDomEl}</span>`;
const container = typeof htmlStringOrDomEl === 'string' ? $(htmlContent) : $(htmlStringOrDomEl);
container.find('table').toArray().forEach((table) => {
if ($(table).parents('table').length === 0) {
$(table).css('float', 'none')
.wrapAll('<div class="table-wrapper w-full" style="overflow: auto"></div>');
}
}
});
return container.prop('outerHTML');
}

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

@ -489,11 +489,10 @@ window.TinyMCE = (() => {
},
wrapTables: (container) => {
container.find('table').toArray().forEach((table) => {
if ($(table).parent().hasClass('table-wrapper')) return;
$(table).css('float', 'none').wrapAll(`
<div class="table-wrapper" style="overflow: auto; width: ${container.width()}px"></div>
`);
if ($(table).parents('table').length === 0) {
$(table).css('float', 'none')
.wrapAll('<div class="table-wrapper w-full" style="overflow: auto"></div>');
}
});
}
};