Skip to content

Commit

Permalink
EZP-31632: Floating table toolbar (#1721)
Browse files Browse the repository at this point in the history
  • Loading branch information
mateuszdebinski authored Mar 16, 2021
1 parent db033a8 commit 8e7712a
Show file tree
Hide file tree
Showing 3 changed files with 24 additions and 7 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,9 @@ export default class EzConfgiFixedBase extends EzConfigBase {
const editorRect = editor.element.getClientRect();
const toolbarHeight = toolbar ? toolbar.getBoundingClientRect().height : 0;
const shouldBeFixed = editorRect.top - toolbarHeight - 2 * TOOLBAR_OFFSET < 0;
const header = document.querySelector('.ez-edit-header__content-type-name');
const top = shouldBeFixed
? TOOLBAR_OFFSET
? TOOLBAR_OFFSET + (header ? header.offsetHeight : 0)
: editorRect.top + editor.element.getWindow().getScrollPosition().y - toolbarHeight - TOOLBAR_OFFSET;

if (toolbar) {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
import AlloyEditor from 'alloyeditor';
import EzConfgiFixedBase from './base-fixed';

export default class EzConfigTableBase {
export default class EzConfigTableBase extends EzConfgiFixedBase {
constructor(config) {
super(config);

this.name = this.getConfigName();

const editAttributesButton = config.attributes[this.name] || config.classes[this.name] ? `${this.name}edit` : '';
Expand All @@ -16,12 +18,13 @@ export default class EzConfigTableBase {
'eztableremove',
...config.extraButtons[this.name],
];

this.getArrowBoxClasses = AlloyEditor.SelectionGetArrowBoxClasses.table;
this.setPosition = AlloyEditor.SelectionSetPosition.table;
}

getConfigName() {
return '';
}

getArrowBoxClasses() {
return 'ae-toolbar-floating';
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -80,16 +80,29 @@ export default class EzConfigBase {
const path = editor.elementPath();
let block = path.block;

if (!block || isWidgetElement) {
if (isWidgetElement) {
const inlineCustomTag = path.elements.find((element) => element.$.dataset.ezelement === 'eztemplateinline');

block = inlineCustomTag || targetElement;
}

if (!block ) {
block = path.lastElement;
}

if (block.is('li')) {
block = block.getParent();
}

if (block.is('td') || block.is('th')) {
for (let parent of block.getParents()) {
if (parent.getName() === 'table') {
block = parent;
break;
}
}
}

return block;
}

Expand Down

0 comments on commit 8e7712a

Please sign in to comment.