table element
This commit is contained in:
@@ -1 +1 @@
|
|||||||
1.2.71
|
1.2.73
|
||||||
|
|||||||
@@ -53,7 +53,7 @@
|
|||||||
if (!component) return;
|
if (!component) return;
|
||||||
const modal = editor.Modal;
|
const modal = editor.Modal;
|
||||||
if (!modal) return;
|
if (!modal) return;
|
||||||
const attrs = component.getAttributes ? component.getAttributes() : {};
|
const attrs = (component.get && component.get('attributes')) || {};
|
||||||
const rows = Number(attrs['data-bridge-rows'] || 3) || 3;
|
const rows = Number(attrs['data-bridge-rows'] || 3) || 3;
|
||||||
|
|
||||||
const container = document.createElement('div');
|
const container = document.createElement('div');
|
||||||
@@ -126,76 +126,30 @@
|
|||||||
modal.open();
|
modal.open();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const isBridgeTableComponent = (model) => {
|
||||||
|
if (!model) return false;
|
||||||
|
const el = (model.view && model.view.el) || (model.getEl && model.getEl());
|
||||||
|
if (el && el.tagName && el.tagName.toLowerCase() === 'table') {
|
||||||
|
return el.getAttribute('data-bridge-table') === '1';
|
||||||
|
}
|
||||||
|
const attrs = (model.get && model.get('attributes')) || {};
|
||||||
|
return attrs && attrs['data-bridge-table'] === '1';
|
||||||
|
};
|
||||||
|
|
||||||
if (editor.Commands && editor.Commands.add) {
|
if (editor.Commands && editor.Commands.add) {
|
||||||
editor.Commands.add('bridge-table:edit', {
|
editor.Commands.add('bridge-table:edit', {
|
||||||
run(ed, sender, opts = {}) {
|
run(ed, sender, opts = {}) {
|
||||||
if (sender && sender.set) sender.set('active', 0);
|
if (sender && sender.set) sender.set('active', 0);
|
||||||
const component = opts.component || ed.getSelected();
|
const component = opts.component || ed.getSelected();
|
||||||
if (component && component.is && component.is('bridge-table')) {
|
if (isBridgeTableComponent(component)) {
|
||||||
openTableModal(component);
|
openTableModal(component);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!domc.getType('bridge-table')) {
|
|
||||||
const baseType = domc.getType('table') || domc.getType('default');
|
|
||||||
const BaseModel = baseType.model;
|
|
||||||
const BaseView = baseType.view;
|
|
||||||
domc.addType('bridge-table', {
|
|
||||||
model: BaseModel.extend({
|
|
||||||
initialize(props = {}, opts = {}) {
|
|
||||||
// Guard before base init: grapes expects classes to be iterable in getAttributes
|
|
||||||
if (props && props.classes && typeof props.classes.forEach !== 'function') {
|
|
||||||
props.classes = [];
|
|
||||||
}
|
|
||||||
if (!this.classes || typeof this.classes.forEach !== 'function') {
|
|
||||||
this.classes = [];
|
|
||||||
}
|
|
||||||
if (BaseModel.prototype.initialize) {
|
|
||||||
BaseModel.prototype.initialize.apply(this, [props, opts]);
|
|
||||||
}
|
|
||||||
if (!this.classes || typeof this.classes.forEach !== 'function') {
|
|
||||||
this.classes = [];
|
|
||||||
}
|
|
||||||
const attrs = this.getAttributes ? this.getAttributes() : {};
|
|
||||||
const nextAttrs = Object.assign({
|
|
||||||
'data-bridge-table': '1',
|
|
||||||
'data-bridge-rows': '3',
|
|
||||||
'data-bridge-cols': '2',
|
|
||||||
role: 'presentation',
|
|
||||||
}, attrs || {});
|
|
||||||
if (this.addAttributes) {
|
|
||||||
this.addAttributes(nextAttrs);
|
|
||||||
} else if (this.set) {
|
|
||||||
this.set('attributes', nextAttrs, { silent: true });
|
|
||||||
}
|
|
||||||
const toolbar = this.get && this.get('toolbar');
|
|
||||||
if (!Array.isArray(toolbar) || !toolbar.some(btn => btn && btn.command === 'bridge-table:edit')) {
|
|
||||||
this.set && this.set('toolbar', [
|
|
||||||
...(Array.isArray(toolbar) ? toolbar : []),
|
|
||||||
{
|
|
||||||
label: tableIcon,
|
|
||||||
command: 'bridge-table:edit',
|
|
||||||
attributes: { title: 'Tabelle bearbeiten' },
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
view: BaseView,
|
|
||||||
isComponent(el) {
|
|
||||||
if (!el || !el.hasAttribute) return false;
|
|
||||||
if (el.tagName && el.tagName.toLowerCase() === 'table' && el.getAttribute('data-bridge-table') === '1') {
|
|
||||||
return { type: 'bridge-table' };
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
editor.on('component:selected', (model) => {
|
editor.on('component:selected', (model) => {
|
||||||
if (model && model.is && model.is('bridge-table')) {
|
if (isBridgeTableComponent(model)) {
|
||||||
const toolbar = model.get('toolbar') || [];
|
const toolbar = model.get('toolbar') || [];
|
||||||
const exists = toolbar.some(btn => btn && btn.command === 'bridge-table:edit');
|
const exists = toolbar.some(btn => btn && btn.command === 'bridge-table:edit');
|
||||||
if (!exists) {
|
if (!exists) {
|
||||||
@@ -210,7 +164,7 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
editor.on('component:dblclick', (model) => {
|
editor.on('component:dblclick', (model) => {
|
||||||
if (model && model.is && model.is('bridge-table')) {
|
if (isBridgeTableComponent(model)) {
|
||||||
openTableModal(model);
|
openTableModal(model);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user