@syncfusion/ej2-documenteditor
Version:
Feature-rich document editor control with built-in support for context menu, options pane and dialogs.
117 lines (116 loc) • 4.89 kB
JavaScript
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
import { RibbonGroupBase } from '../ribbon-interfaces';
export var CELL_ALIGN_GROUP_ID = '_cell_align_group';
export var ALIGN_TOP_BUTTON_ID = '_align_top_button';
export var ALIGN_CENTER_BUTTON_ID = '_align_center_button';
export var ALIGN_BOTTOM_BUTTON_ID = '_align_bottom_button';
/**
* Represents the Cell Align Group in Table Layout tab
* @private
*/
var CellAlignGroup = /** @class */ (function (_super) {
__extends(CellAlignGroup, _super);
/**
* Constructor for the CellAlignGroup
* @param {DocumentEditorContainer} container - DocumentEditorContainer instance
*/
function CellAlignGroup(container) {
return _super.call(this, container) || this;
}
/**
* Gets the ribbon group model for Cell Align
* @returns {RibbonGroupModel} - Ribbon group model
*/
CellAlignGroup.prototype.getGroupModel = function () {
var _this = this;
return {
id: this.ribbonId + CELL_ALIGN_GROUP_ID,
header: this.localObj.getConstant('Align Text'),
enableGroupOverflow: true,
overflowHeader: this.localObj.getConstant('Align Text'),
collections: [
{
items: [
{
type: 'Button',
keyTip: 'AT',
id: this.ribbonId + ALIGN_TOP_BUTTON_ID,
buttonSettings: {
iconCss: 'e-icons e-de-ctnr-aligntop',
cssClass: 'e-flat e-de-icon-btn',
isToggle: true,
clicked: function () { return _this.applyAlignTop(); }
},
ribbonTooltipSettings: {
content: this.localObj.getConstant('Align top')
}
},
{
type: 'Button',
keyTip: 'AL',
id: this.ribbonId + ALIGN_CENTER_BUTTON_ID,
buttonSettings: {
iconCss: 'e-icons e-de-ctnr-aligncenter-table',
cssClass: 'e-flat e-de-icon-btn',
isToggle: true,
clicked: function () { return _this.applyAlignCenterHorizontal(); }
},
ribbonTooltipSettings: {
content: this.localObj.getConstant('Align center')
}
},
{
type: 'Button',
keyTip: 'AB',
id: this.ribbonId + ALIGN_BOTTOM_BUTTON_ID,
buttonSettings: {
iconCss: 'e-icons e-de-ctnr-alignbottom',
cssClass: 'e-flat e-de-icon-btn',
isToggle: true,
clicked: function () { return _this.applyAlignBottom(); }
},
ribbonTooltipSettings: {
content: this.localObj.getConstant('Align bottom')
}
}
]
}
]
};
};
/**
* Applies top alignment to the selected cells
* @returns {void}
*/
CellAlignGroup.prototype.applyAlignTop = function () {
this.documentEditor.selectionModule.cellFormat.verticalAlignment = 'Top';
};
/**
* Applies center alignment to the selected cells
* @returns {void}
*/
CellAlignGroup.prototype.applyAlignCenterHorizontal = function () {
this.documentEditor.selectionModule.cellFormat.verticalAlignment = 'Center';
};
/**
* Applies bottom alignment to the selected cells
* @returns {void}
*/
CellAlignGroup.prototype.applyAlignBottom = function () {
this.documentEditor.selectionModule.cellFormat.verticalAlignment = 'Bottom';
};
return CellAlignGroup;
}(RibbonGroupBase));
export { CellAlignGroup };