@syncfusion/ej2-documenteditor
Version:
Feature-rich document editor control with built-in support for context menu, options pane and dialogs.
244 lines (243 loc) • 9.9 kB
JavaScript
import { Browser, createElement, EventHandler, L10n } from '@syncfusion/ej2-base';
import { DialogUtility } from '@syncfusion/ej2-popups';
import { beforeFileOpenEvent, fileMenuItemClickEvent } from '../../../document-editor/base/index';
import { RIBBON_ID } from '../ribbon-base/ribbon-constants';
/**
* File menu constants
*/
export var FILE_MENU_ID = 'file_menu';
export var NEW_DOCUMENT_ID = 'new';
export var OPEN_DOCUMENT_ID = 'open';
export var EXPORT_ID = 'export';
export var EXPORT_SFDT_ID = 'export_sfdt';
export var EXPORT_DOCX_ID = 'export_docx';
export var EXPORT_DOTX_ID = 'export_dotx';
export var EXPORT_TXT_ID = 'export_txt';
export var PRINT_ID = 'print';
/**
* FileMenu class for Document Editor Ribbon
* @private
*/
var FileMenu = /** @class */ (function () {
/**
* Constructor for FileMenu class
*
* @param {DocumentEditorContainer} container - Document editor container reference
*/
function FileMenu(container) {
this.container = container;
}
/**
* Get file menu items
*
* @returns {MenuItemModel[]} File menu items
* @private
*/
FileMenu.prototype.getFileMenuItems = function () {
var locale = this.container.localObj;
var fileMenuItems = [];
var commentId = this.container.element.id + RIBBON_ID;
// Check if fileMenuItems property exists and use it, otherwise use default items
var items = this.container.fileMenuItems;
for (var i = 0; i < items.length; i++) {
/* eslint-disable */
var item = items[i];
if (typeof item === 'string') {
switch (item) {
case 'New':
fileMenuItems.push({
text: locale.getConstant('New'),
iconCss: 'e-icons e-de-ctnr-new',
id: commentId + NEW_DOCUMENT_ID
});
break;
case 'Open':
fileMenuItems.push({
text: locale.getConstant('Open'),
iconCss: 'e-icons e-de-ctnr-open',
id: commentId + OPEN_DOCUMENT_ID
});
break;
case 'Export':
fileMenuItems.push({
text: locale.getConstant('Export'),
iconCss: 'e-icons e-de-ctnr-export',
id: commentId + EXPORT_ID,
items: [
{ id: commentId + EXPORT_SFDT_ID, text: locale.getConstant('Syncfusion Document Text (*.sfdt)') },
{ id: commentId + EXPORT_DOCX_ID, text: locale.getConstant('Word Document (*.docx)') },
{ id: commentId + EXPORT_DOTX_ID, text: locale.getConstant('Word Template (*.dotx)') },
{ id: commentId + EXPORT_TXT_ID, text: locale.getConstant('Plain Text (*.txt)') }
]
});
break;
case 'Print':
fileMenuItems.push({
text: locale.getConstant('Print'),
iconCss: 'e-icons e-de-ctnr-print',
id: commentId + PRINT_ID
});
break;
}
}
else {
// Item is already a MenuItemModel
fileMenuItems.push(item);
}
}
return fileMenuItems;
};
/**
* Handle file menu item selection
*
* @param {MenuEventArgs} args - Menu item selection arguments
* @returns {void}
*/
FileMenu.prototype.onFileMenuItemSelect = function (args) {
var locale = this.container.localObj;
if (args.item && args.item.id) {
switch (args.item.text) {
case locale.getConstant('New'):
this.container.documentEditor.openBlank();
break;
case locale.getConstant('Open'):
this.initializeFilePicker();
this.filePicker.value = '';
this.filePicker.click();
break;
case locale.getConstant('Print'):
this.container.documentEditor.print();
break;
case locale.getConstant('Word Document (*.docx)'):
this.container.documentEditor.save(this.container.documentEditor.documentName || 'Document', 'Docx');
break;
case locale.getConstant('Word Template (*.dotx)'):
this.container.documentEditor.save(this.container.documentEditor.documentName || 'Document', 'Dotx');
break;
case locale.getConstant('Syncfusion Document Text (*.sfdt)'):
this.container.documentEditor.save(this.container.documentEditor.documentName || 'Document', 'Sfdt');
break;
case locale.getConstant('Plain Text (*.txt)'):
this.container.documentEditor.save(this.container.documentEditor.documentName || 'Document', 'Txt');
break;
default:
// Trigger file menu click event for custom handling
this.container.trigger(fileMenuItemClickEvent, args);
break;
}
this.container.documentEditor.focusIn();
}
};
/**
* Initialize file picker
*
* @private
* @returns {void}
*/
FileMenu.prototype.initializeFilePicker = function () {
if (!this.filePicker) {
this.filePicker = createElement('input', {
attrs: { type: 'file', accept: '.doc,.docx,.rtf,.txt,.htm,.html,.sfdt' },
className: 'e-de-ctnr-file-picker'
});
if (Browser.isIE) {
document.body.appendChild(this.filePicker);
}
EventHandler.add(this.filePicker, 'change', this.onFileChange, this);
}
};
/**
* Handle file change event when a document is opened
* @private
* @returns {void}
*/
FileMenu.prototype.onFileChange = function () {
var _this = this;
var file = this.filePicker.files[0];
var fileSize = file.size;
var check;
var eventArgs = { fileSize: fileSize, isCanceled: check };
this.container.documentEditor.trigger(beforeFileOpenEvent, eventArgs);
if (eventArgs.isCanceled) {
return;
}
if (file) {
var formatType_1 = file.name.substr(file.name.lastIndexOf('.'));
if (formatType_1 === '.sfdt' || formatType_1 === '.txt') {
var fileReader_1 = new FileReader();
fileReader_1.onload = function () {
if (formatType_1 === '.txt') {
_this.container.documentEditor.documentHelper.openTextFile(fileReader_1.result);
}
else {
if (_this.container.documentEditor.documentEditorSettings.openAsyncSettings.enable) {
_this.container.documentEditor.openAsync(fileReader_1.result);
}
else {
_this.container.documentEditor.open(fileReader_1.result);
}
}
};
fileReader_1.readAsText(file);
}
else {
if (this.isSupportedFormatType(formatType_1.toLowerCase())) {
if (this.container.documentEditor.documentEditorSettings.openAsyncSettings.enable) {
this.container.documentEditor.openAsync(file);
}
else {
this.container.documentEditor.open(file);
}
}
else {
var localizeValue = new L10n('documenteditor', this.container.documentEditor.defaultLocale);
DialogUtility.alert({
content: localizeValue.getConstant('Unsupported format'),
closeOnEscape: true,
showCloseIcon: true,
position: { X: 'center', Y: 'center' }
}).enableRtl = this.container.enableRtl;
}
}
this.container.documentEditor.documentName = file.name.substr(0, file.name.lastIndexOf('.'));
}
};
/**
* Check if the file format is supported
* @private
* @param {string} formatType - The file format extension
* @returns {boolean} Whether the format is supported
*/
FileMenu.prototype.isSupportedFormatType = function (formatType) {
switch (formatType) {
case '.dotx':
case '.docx':
case '.docm':
case '.dotm':
case '.dot':
case '.doc':
case '.rtf':
case '.txt':
case '.xml':
case '.html':
return true;
default:
return false;
}
};
/**
* Destroy the file menu
* @returns {void}
*/
FileMenu.prototype.destroy = function () {
if (this.filePicker) {
EventHandler.remove(this.filePicker, 'change', this.onFileChange);
if (this.filePicker.parentNode) {
this.filePicker.parentNode.removeChild(this.filePicker);
}
this.filePicker = null;
}
};
return FileMenu;
}());
export { FileMenu };