Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -1,24 +1,24 @@
---
layout: post
title: Show hide spinner in JavaScript (ES5) Document editor | Syncfusion
description: Learn here all about Show hide spinner in Syncfusion JavaScript (ES5) Document editor control of Syncfusion Essential JS 2 and more.
title: Show hide spinner in JavaScript (ES5) Document Editor | Syncfusion
description: Learn here all about Show hide spinner in Syncfusion JavaScript (ES5) Document Editor component of Syncfusion Essential JS 2 and more.
platform: document-processing
control: Show hide spinner
documentation: ug
domainurl: ##DomainURL##
---

# Show hide spinner in JavaScript (ES5) Document editor
# Show hide spinner in JavaScript (ES5) Document Editor

Using [`spinner`](https://ej2.syncfusion.com/documentation/spinner/getting-started#create-the-spinner-globally) component, you can show/hide spinner while opening document in [JavaScript DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/javascript-docx-editor) (Document Editor).
Using the [`spinner`](https://ej2.syncfusion.com/documentation/spinner/getting-started#create-the-spinner-globally) component, you can show or hide a spinner while opening a document in the [JavaScript DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/javascript-docx-editor) (Document Editor).

Example code snippet to show/hide spinner
Example code snippet to show or hide a spinner

```ts
// showSpinner() will make the spinner visible
showSpinner(document.getElementById('container'));

// hideSpinner() method used hide spinner
// hideSpinner() method used to hide the spinner
hideSpinner(document.getElementById('container'));
```

Expand All @@ -35,4 +35,4 @@ Refer to the following example.

{% previewsample "/document-processing/code-snippet/document-editor/javascript-es5/spinner-cs1" %}

>Note: In above example, we have used setInterval to hide spinner, just for demo purpose.
N> In the above example, we have used setInterval to hide the spinner, just for demo purposes.
22 changes: 11 additions & 11 deletions Document-Processing/Word/Word-Processor/javascript-es5/image.md
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
---
layout: post
title: Image in JavaScript (ES5) Document editor control | Syncfusion
description: Learn here all about Image in Syncfusion JavaScript (ES5) Document editor control of Syncfusion Essential JS 2 and more.
title: Image in JavaScript (ES5) DOCX Editor control | Syncfusion
description: Learn here all about Image in Syncfusion JavaScript (ES5) Document Editor control of Syncfusion Essential JS 2 and more.
platform: document-processing
control: Image
documentation: ug
domainurl: ##DomainURL##
---

# Image in JavaScript (ES5) Document editor control
# Image in JavaScript (ES5) Document Editor control

[JavaScript DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/javascript-docx-editor) (Document Editor) supports common raster format images like PNG, BMP, JPEG, SVG and GIF. You can insert an image file or online image in the document using the [`insertImage()`](https://ej2.syncfusion.com/javascript/documentation/api/document-editor/editor/#insertimage) method. Refer to the following sample code.
[JavaScript DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/javascript-docx-editor) (Document Editor) supports common raster image formats such as PNG, BMP, JPEG, SVG, and GIF. You can insert an image file or online image in the document using the [`insertImage()`](https://ej2.syncfusion.com/javascript/documentation/api/document-editor/editor#insertimage) method. Refer to the following sample code.

{% tabs %}
{% highlight js tabtitle="index.js" %}
Expand All @@ -23,41 +23,41 @@ domainurl: ##DomainURL##

{% previewsample "/document-processing/code-snippet/document-editor/javascript-es5/image-cs1" %}

N> 1. Image files will be internally converted to base64 string. Whereas, online images are preserved as URL. N> 2. EMF and WMF images can't be inserted, but these types of images will be preserved in Document Editor when using ASP.NET MVC Web API.
N> Image files are internally converted to base64 strings, whereas online images are preserved as URLs. EMF and WMF images can't be inserted, but these types of images will be preserved in Document Editor when using ASP.NET MVC Web API.

## Alternate text

Document Editor expose API to get or set the alternate text of the selected image. Refer to the following sample code.
Document Editor exposes an API to get or set the alternate text of the selected image. Refer to the following sample code.

```ts
documenteditor.selection.imageFormat.alternateText = 'Adventure Cycle';
```

## Image resizing

Document Editor provides built-in image resizer that can be injected into your application based on the requirements. This allows you to resize the image by dragging the resizing points using mouse or touch interactions. This resizer appears as follows.
Document Editor provides a built-in image resizer that can be injected into your application based on the requirements. This allows you to resize the image by dragging the resizing points using a mouse or touch interactions. This resizer appears as follows.

![Image](images/image.png)

## Changing size

Document Editor expose API to get or set the size of the selected image. Refer to the following sample code.
Document Editor exposes an API to get or set the size of the selected image. Refer to the following sample code.

```ts
documenteditor.selection.imageFormat.width = 800;
documenteditor.selection.imageFormat.height = 800;
```

>Note: Images are stored and processed(read/write) as base64 string in DocumentEditor. The online image URL is preserved as a URL in DocumentEditor upon saving.
N> Images are stored and processed (read/write) as base64 string in DocumentEditor. The online image URL is preserved as a URL in DocumentEditor upon saving.

## Text wrapping style

Text wrapping refers to how images fit with surrounding text in a document. Please [refer to this page](./text-wrapping-style) for more information about text wrapping styles available in Word documents.

## Positioning the image

DocumentEditor preserves the position properties of the image and displays the image based on position properties. It does not support modifying the position properties. Whereas the image will be automatically moved along with text edited if it is positioned relative to the line or paragraph.
DocumentEditor preserves the position properties of the image and displays the image based on these position properties. It does not support modifying the position properties. The image will be automatically moved along with the edited text if it is positioned relative to the line or paragraph.

## See Also
## See also

* [Feature modules](./feature-module)
32 changes: 16 additions & 16 deletions Document-Processing/Word/Word-Processor/javascript-es5/import.md
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
---
layout: post
title: Import in JavaScript (ES5) Document editor control | Syncfusion
description: Learn here all about Import in Syncfusion JavaScript (ES5) Document editor control of Syncfusion Essential JS 2 and more.
title: Import in JavaScript (ES5) DOCX Editor control | Syncfusion
description: Learn here all about Import in Syncfusion JavaScript (ES5) Document Editor control of Syncfusion Essential JS 2 and more.
platform: document-processing
control: Import
documentation: ug
domainurl: ##DomainURL##
---

# Import in JavaScript (ES5) Document editor control
# Import in JavaScript (ES5) Document Editor control

In [JavaScript DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/javascript-docx-editor) (Document Editor), the documents are stored in its own format called **Syncfusion Document Text (SFDT)**.
In [JavaScript DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/javascript-docx-editor) (Document Editor), the documents are stored in Document Editor's own format called **Syncfusion Document Text (SFDT)**.

The following example shows how to open SFDT data in Document Editor.

Expand All @@ -27,7 +27,7 @@ The following example shows how to open SFDT data in Document Editor.

## Import document from local machine

The following example shows how to import document from local machine.
The following example shows how to import a document from the local machine.

{% tabs %}
{% highlight js tabtitle="index.js" %}
Expand All @@ -42,11 +42,11 @@ The following example shows how to import document from local machine.

## Convert word documents into SFDT

You can convert word documents into SFDT format using the .NET Standard library [`Syncfusion.EJ2.WordEditor.AspNet.Core`](<https://www.nuget.org/packages/Syncfusion.EJ2.WordEditor.AspNet.Core/>) by the web API service implementation. This library helps you to convert word documents (.dotx,.docx,.docm,.dot,.doc), rich text format documents (.rtf), and text documents (.txt) into SFDT format.
You can convert Word documents into SFDT format using the .NET Standard library [`Syncfusion.EJ2.WordEditor.AspNet.Core`](<https://www.nuget.org/packages/Syncfusion.EJ2.WordEditor.AspNet.Core/>) by the web API service implementation. This library helps you to convert Word documents (.dotx,.docx,.docm,.dot,.doc), rich text format documents (.rtf), and text documents (.txt) into SFDT format.

>Note: The JavaScript Document Editor component's document pagination (page-by-page display) can't be guaranteed for all the Word documents to match the pagination of Microsoft Word application. For more information about [why the document pagination (page-by-page display) differs from Microsoft Word](./import#why-the-document-pagination-differs-from-microsoft-word)
N> The Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor component's document pagination (page-by-page display) can't be guaranteed for all the Word documents to match the pagination of Microsoft Word application. For more information about [why the document pagination (page-by-page display) differs from Microsoft Word](./import#why-the-document-pagination-differs-from-microsoft-word).

Please refer the following example for converting word documents into SFDT.
Please refer to the following example for converting Word documents into SFDT.

```js
// Initialize the Document Editor component.
Expand Down Expand Up @@ -100,7 +100,7 @@ function loadFile(file) {
}
```

Heres how to handle the server-side action for converting word document in to SFDT.
Here's how to handle the server-side action for converting a Word document into SFDT.

```c#
[AcceptVerbs("Post")]
Expand Down Expand Up @@ -148,19 +148,19 @@ Here’s how to handle the server-side action for converting word document in to

```

To know about server-side action, please refer this [page](./web-services-overview).
To know about server-side action, please refer to this [page](./web-services-overview).

## Compatibility with Microsoft Word

JavaScript Document Editor is a minimal viable Word document viewer/editor product for web applications. As most compatible Word editor, the product vision is adding valuable feature sets of Microsoft Word, and not to cover 100% feature sets of Microsoft Word desktop application. You can even see the feature sets difference between Microsoft Word desktop and their Word online application. So kindly don't misunderstand this component as a complete replacement for Microsoft Word desktop application and expect 100% feature sets of it.
Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor is a minimal viable Word document viewer/editor product for web applications. As the most compatible Word editor, the product vision is adding valuable feature sets of Microsoft Word, and not to cover 100% feature sets of Microsoft Word desktop application. You can even see the feature sets difference between Microsoft Word desktop and their Word online application. So kindly don't misunderstand this component as a complete replacement for Microsoft Word desktop application and expect 100% feature sets of it.

### How Syncfusion<sup style="font-size:70%">&reg;</sup> accepts the feature request for Document Editor
### How Syncfusion<sup style="font-size:70%">&reg;</sup> accepts the feature requests for Document Editor

Syncfusion accepts new feature request as valid based on feature value and technological feasibility, then plan to implement unsupported features incrementally in future releases in a phase-by-phase manner.
Syncfusion accepts new feature requests as valid based on feature value and technological feasibility, then plans to implement unsupported features incrementally in future releases in a phase-by-phase manner.

### How to report the problems in Document Editor
### How to report problems in Document Editor

You can report the problems with displaying, or editing Word documents in Document Editor component through [`support forum`](https://www.syncfusion.com/forums/), [`Direct-Trac`](https://www.syncfusion.com/support/directtrac/), or [`feedback portal`](https://www.syncfusion.com/feedback/). Kindly share the Word document for replicating the problem easily in minimal time. If you have confidential data, you can replace it and attach the document.
You can report problems with displaying or editing Word documents in Document Editor component through [`support forum`](https://www.syncfusion.com/forums/), [`Direct-Trac`](https://www.syncfusion.com/support/directtrac/), or [`feedback portal`](https://www.syncfusion.com/feedback/). Kindly share the Word document for replicating the problem easily in minimal time. If you have confidential data, you can replace it and attach the document.

### Why the document pagination differs from Microsoft Word

Expand All @@ -179,7 +179,7 @@ The following table illustrates the reasons for pagination (page-by-page display
|Any unsupported elements or formatting present in your document |Customer can report to Syncfusion<sup style="font-size:70%">&reg;</sup> support and track the status through feature request link.   Syncfusion<sup style="font-size:70%">&reg;</sup> implements unsupported features incrementally in future releases based on feature importance, customer interest, efforts involved, and technological feasibility. Also, suggests alternate approach for possible cases.|
|Technical limitation related to framework   For example, there is a known case with slight fractional difference in text size measured using HTML and Microsoft Word’s display.|Customer can report to Syncfusion<sup style="font-size:70%">&reg;</sup> support and track the status through feature request link.  Syncfusion<sup style="font-size:70%">&reg;</sup> does research about alternate approaches to overcome the technical limitation/behaviors and process it same as a feature. >Note: Here the challenge is, time schedule for implementation varies based on the alternate solution and its reliability.|

## See Also
## See also

* [Feature modules](./feature-module)
* [How to show and hide spinner while opening document in DocumentEditor](./how-to/show-hide-spinner)
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
---
layout: post
title: Keyboard shortcut in JavaScript (ES5) Document editor control | Syncfusion
title: Keyboard shortcut in JavaScript (ES5) DOCX editor control | Syncfusion
description: Learn here all about Keyboard shortcut in Syncfusion JavaScript (ES5) Document editor control of Syncfusion Essential JS 2 and more.
platform: document-processing
control: Keyboard shortcut
documentation: ug
domainurl: ##DomainURL##
---

# Keyboard shortcut in JavaScript (ES5) Document editor control
# Keyboard shortcut in JavaScript (ES5) Document Editor control

## Text formatting

Expand All @@ -21,26 +21,26 @@ The following table lists the default keyboard shortcuts in [JavaScript DOCX Edi
|Ctrl + U | Toggles the underline property of selected text.|
|Ctrl + + | Toggles the subscript formatting of selected text.|
|Ctrl + Shift + + | Toggles the superscript formatting of selected contents.|
| Ctrl + } | Increases the actual font size of selected text by one point.|
| Ctrl + { | Decreases the actual font size of selected text by one point.|
| Ctrl + } | Increases the font size of selected text by one point.|
| Ctrl + { | Decreases the font size of selected text by one point.|

## Paragraph formatting

The following table lists the default keyboard shortcuts for formatting the paragraph:

| Key combination | Description |
|-----------------|-------------|
|Ctrl + E | Selected paragraphs are center aligned.|
|Ctrl + E | Selected paragraphs are center-aligned.|
|Ctrl + J |Selected paragraphs are justified.|
|Ctrl + L | Selected paragraphs are left aligned.|
|Ctrl + R | Selected paragraphs are right aligned.|
|Ctrl + 1 | Single line spacing is applied for selected paragraphs.|
|Ctrl + 5 | 1.5 line spacing is applied for selected paragraphs.|
|Ctrl + 2 | Double spacing is applied for selected paragraphs.|
|Ctrl + 0 | No spacing is applied before the selected paragraphs.|
|Ctrl + L | Selected paragraphs are left-aligned.|
|Ctrl + R | Selected paragraphs are right-aligned.|
|Ctrl + 1 | Applies single line spacing to the selected paragraphs.|
|Ctrl + 5 | Applies 1.5 line spacing to the selected paragraphs.|
|Ctrl + 2 | Applies double line spacing to the selected paragraphs.|
|Ctrl + 0 | Applies no spacing before the selected paragraphs.|
|Ctrl + M | Increases the left indent of selected paragraphs by a factor of 36 points.|
|Ctrl + Shift + M | Decreases the left indent of selected paragraphs by a factor of 36 points.|
|Ctrl + * | Show/Hide the hidden characters like spaces, tab, paragraph marks, and breaks.|
|Ctrl + * | Shows or hides hidden characters such as spaces, tabs, paragraph marks, and breaks.|

## Clipboard

Expand Down Expand Up @@ -96,20 +96,20 @@ The following table lists the default keyboard shortcuts for formatting the para
|Ctrl + F| Opens options pane.|
|Ctrl + H| Opens replace tab in options pane.|

## Create, Save and Print document
## Create, Save, and Print document

|Key Combination|Description|
|---------------|-----------|
|Ctrl + N| Opens empty document.|
|Ctrl + N| Opens an empty document.|
|Ctrl + S| Saves the document in SFDT format.|
|Ctrl + P| Prints the document.|

## Edit Operation

|Key Combination|Description|
|---------------|-----------|
|Backspace | Deletes one character to the left.|
|Delete | Deletes one character to the right.|
|Backspace| Deletes one character to the left.|
|Delete| Deletes one character to the right.|
|Ctrl + Z | Undo last performed action.|
|Ctrl + Y | Redo last undo action.|

Expand All @@ -128,6 +128,6 @@ The following table lists the default keyboard shortcuts for formatting the para
|Ctrl + D| Opens font dialog.|
|Ctrl + K| Opens hyperlink dialog.|

## See Also
## See also

* [How to override the keyboard shortcuts](./how-to/override-the-keyboard-shortcuts)
Loading