Skip to content

Commit 594d8a6

Browse files
AnanthaGokulaRamanAnanthaGokulaRaman
authored
Merge pull request #2110 from syncfusion-content/1002609-RevampJses5
1002609: Updated Review Correction for Text Search Localization and Print
2 parents 7933069 + 7a4842f commit 594d8a6

9 files changed

Lines changed: 449 additions & 166 deletions

File tree

‎Document-Processing/PDF/PDF-Viewer/javascript-es5/Localization/default-language.md‎

Lines changed: 54 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,60 @@ domainurl: ##DomainURL##
1212

1313
The PDF Viewer fully supports localization, allowing all UI text, tooltips, and messages to be replaced with culture-specific strings so the interface matches users’ language and regional settings.
1414

15+
![Default Locale](../../javascript-es6/images/locale-us.gif)
16+
17+
## Default language (en-US)
18+
19+
By default, the PDF Viewer uses the en-US culture and requires no additional configuration.
20+
21+
{% tabs %}
22+
{% highlight js tabtitle="Standalone" %}
23+
ej.pdfviewer.PdfViewer.Inject(
24+
ej.pdfviewer.TextSelection,
25+
ej.pdfviewer.TextSearch,
26+
ej.pdfviewer.Print,
27+
ej.pdfviewer.Navigation,
28+
ej.pdfviewer.Toolbar,
29+
ej.pdfviewer.Magnification,
30+
ej.pdfviewer.Annotation,
31+
ej.pdfviewer.FormDesigner,
32+
ej.pdfviewer.FormFields,
33+
ej.pdfviewer.PageOrganizer
34+
);
35+
36+
var pdfviewer = new ej.pdfviewer.PdfViewer({
37+
documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf',
38+
resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib',
39+
locale: 'ar-AE' //Using locale update culture (en-US by default)
40+
});
41+
pdfviewer.appendTo('#pdfViewer');
42+
{% endhighlight %}
43+
{% highlight ts tabtitle="Server-Backed" %}
44+
45+
ej.pdfviewer.PdfViewer.Inject(
46+
ej.pdfviewer.TextSelection,
47+
ej.pdfviewer.TextSearch,
48+
ej.pdfviewer.Print,
49+
ej.pdfviewer.Navigation,
50+
ej.pdfviewer.Toolbar,
51+
ej.pdfviewer.Magnification,
52+
ej.pdfviewer.Annotation,
53+
ej.pdfviewer.FormDesigner,
54+
ej.pdfviewer.FormFields,
55+
ej.pdfviewer.PageOrganizer
56+
);
57+
58+
var pdfviewer = new ej.pdfviewer.PdfViewer({
59+
documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf',
60+
serviceUrl: 'https://document.syncfusion.com/web-services/pdf-viewer/api/pdfviewer/',
61+
locale: 'ar-AE' //Using locale update culture (en-US by default)
62+
});
63+
pdfviewer.appendTo('#pdfViewer');
64+
{% endhighlight %}
65+
{% endtabs %}
66+
67+
[View Sample on GitHub](https://github.com/SyncfusionExamples/javascript-pdf-viewer-examples)
68+
1569
## Localization keys reference
1670

1771
The PDF Viewer supports localization using culture-specific string collections. By default, the component uses the "en-US" culture.
@@ -270,84 +324,6 @@ The following table lists the default text values used by the PDF Viewer in the
270324
|Exact Matches|EXACT MATCHES|
271325
|Total Matches|TOTAL MATCHES|
272326

273-
## Default language (en-US)
274-
275-
By default, the PDF Viewer uses the en-US culture and requires no additional configuration.
276-
277-
{% tabs %}
278-
{% highlight js tabtitle="Standalone" %}
279-
ej.pdfviewer.PdfViewer.Inject(
280-
ej.pdfviewer.TextSelection,
281-
ej.pdfviewer.TextSearch,
282-
ej.pdfviewer.Print,
283-
ej.pdfviewer.Navigation,
284-
ej.pdfviewer.Toolbar,
285-
ej.pdfviewer.Magnification,
286-
ej.pdfviewer.Annotation,
287-
ej.pdfviewer.FormDesigner,
288-
ej.pdfviewer.FormFields,
289-
ej.pdfviewer.PageOrganizer
290-
);
291-
292-
var pdfviewer = new ej.pdfviewer.PdfViewer({
293-
documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf',
294-
resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib',
295-
locale: 'ar-AE' //Using locale update culture (en-US by default)
296-
});
297-
298-
ej.base.L10n.load({
299-
'ar-AE': {
300-
'PdfViewer': {
301-
'PdfViewer': 'قوات الدفاع الشعبي المشاهد',
302-
'Cancel': 'إلغاء',
303-
'Download file': 'تحميل الملف',
304-
'Download': 'تحميل',
305-
//Followed Up by more keys and values
306-
}
307-
}
308-
});
309-
310-
pdfviewer.appendTo('#pdfViewer');
311-
{% endhighlight %}
312-
{% highlight ts tabtitle="Server-Backed" %}
313-
314-
ej.pdfviewer.PdfViewer.Inject(
315-
ej.pdfviewer.TextSelection,
316-
ej.pdfviewer.TextSearch,
317-
ej.pdfviewer.Print,
318-
ej.pdfviewer.Navigation,
319-
ej.pdfviewer.Toolbar,
320-
ej.pdfviewer.Magnification,
321-
ej.pdfviewer.Annotation,
322-
ej.pdfviewer.FormDesigner,
323-
ej.pdfviewer.FormFields,
324-
ej.pdfviewer.PageOrganizer
325-
);
326-
327-
var pdfviewer = new ej.pdfviewer.PdfViewer({
328-
documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf',
329-
serviceUrl: 'https://document.syncfusion.com/web-services/pdf-viewer/api/pdfviewer/',
330-
locale: 'ar-AE' //Using locale update culture (en-US by default)
331-
});
332-
333-
ej.base.L10n.load({
334-
'ar-AE': {
335-
'PdfViewer': {
336-
'PdfViewer': 'قوات الدفاع الشعبي المشاهد',
337-
'Cancel': 'إلغاء',
338-
'Download file': 'تحميل الملف',
339-
'Download': 'تحميل',
340-
//Followed Up by more keys and values
341-
}
342-
}
343-
});
344-
345-
pdfviewer.appendTo('#pdfViewer');
346-
{% endhighlight %}
347-
{% endtabs %}
348-
349-
[View Sample on GitHub](https://github.com/SyncfusionExamples/javascript-pdf-viewer-examples)
350-
351327
## See Also
352328

353329
- [New Language](./new-language)

‎Document-Processing/PDF/PDF-Viewer/javascript-es5/Localization/new-language.md‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,9 @@ domainurl: ##DomainURL##
1212

1313
You can localize the PDF Viewer UI by:
1414
- Registering localized strings for each culture using `L10n.load` at the application level
15-
- Setting the [`locale`](https://ej2.syncfusion.com/documentation/api/pdfviewer/index-default#locale) property of the `PdfViewer` instance to the desired culture
15+
- Setting the `locale` property of the `PdfViewer` instance to the desired culture
16+
17+
![German Locale](../../javascript-es6/images/locale-de.gif)
1618

1719
## Example Code-snippet to change language using Locale
1820

‎Document-Processing/PDF/PDF-Viewer/javascript-es5/Localization/rtl-language-support.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ RTL support in JavaScript PDF Viewer:
1717
- Load culture-specific strings globally using `L10n.load`.
1818
- Set the PdfViewer [`locale`](https://ej2.syncfusion.com/documentation/api/pdfviewer/index-default#locale) property to the target culture.
1919

20+
![Arabic Localization](../../javascript-es6/images/locale-ar.gif)
21+
2022
## Example Code-snippet to Enable RTL with Arabic Localization
2123

2224
Use the below code-snippet to enable RTL for RTL Languages(Arabic, Hebrew, Persian)

‎Document-Processing/PDF/PDF-Viewer/javascript-es5/how-to/extract-text-js.md‎

Lines changed: 83 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -12,24 +12,34 @@ documentation: ug
1212
The `extractText` method extracts text from one or more pages and can return plain text or text with bounds for each element.
1313

1414
### extractText method
15+
1516
Retrieves text data from one page or a range of pages based on the specified options.
1617

1718
#### Parameters:
18-
**startIndex:** The starting page index for text extraction (0-based index).
1919

20-
**endIndex or isOptions:** Either the ending page index (for multiple pages) or an option specifying extraction criteria for a single page.
20+
- **startIndex:** The starting page index for text extraction (0-based index).
21+
22+
- **endIndex or isOptions:** Either the ending page index (for multiple pages) or an option specifying extraction criteria for a single page.
23+
24+
- **options (optional):** Additional options, such as `TextOnly` for plain text or `TextAndBounds` for detailed text data with bounds.
25+
26+
#### Available Options
27+
28+
- **None:** No text information is extracted or returned. This is useful when you want to optimize memory usage and don't need any text data.
29+
30+
- **TextOnly:** Extracts only the plain text from the document. This option excludes any layout or positional information.
2131

22-
**options (optional):** Additional options, such as `TextOnly` for plain text or `TextAndBounds` for detailed text data with bounds.
32+
- **BoundsOnly:** Extracts layout information, such as bounds or coordinates, without including the plain text data.
2333

24-
- TextOnly: Extracts only plain text without bounds.
25-
- TextAndBounds: Extracts text with bounds (coordinates).
34+
- **TextAndBounds:** Extracts both the plain text and the layout (bounds) information, which is the default behavior.
2635

27-
#### Returns:
36+
#### Returns
2837
Returns a Promise with:
2938
- textData: An array of TextDataSettingsModel with details including bounds and page text.
3039
- pageText: A concatenated string of plain text from the specified page(s).
3140

3241
### Usage of extractText in Syncfusion PDF Viewer Control
42+
3343
Here is an example that demonstrates how to use the extractText method along with event handling:
3444

3545
```html
@@ -66,6 +76,73 @@ document.getElementById('extractTexts').addEventListener('click', function () {
6676
- Single page: Extracts text from page 1 (`startIndex = 1`) using `TextOnly`.
6777
- Multiple pages: Extracts text from pages 0–2 (`startIndex = 0, endIndex = 2`) using `TextOnly`.
6878

79+
### Programmatic Examples for Extract Text Option API
80+
Here is an example that demonstrates how to use the extractText Option along with event handling:
81+
82+
```html
83+
<button id="extractNoneRange">None (Pages 0–2)</button>
84+
<button id="extractTextOnlyRange">TextOnly (Pages 0–2)</button>
85+
<button id="extractBoundsOnlyRange">BoundsOnly (Pages 0–2)</button>
86+
<button id="extractTextAndBoundsRange">TextAndBounds (Pages 0–2)</button>
87+
```
88+
89+
```ts
90+
import { PdfViewer, TextSelection, TextSearch, Print, Navigation, Toolbar, Magnification, Annotation, FormDesigner, FormFields, PageInfoModel, ExtractTextOption } from '@syncfusion/ej2-pdfviewer';
91+
92+
// Inject required modules
93+
PdfViewer.Inject(TextSelection, TextSearch, Print, Navigation, Toolbar, Magnification, Annotation, FormDesigner, FormFields);
94+
95+
const viewer = new PdfViewer({
96+
documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf',
97+
resourceUrl: 'https://cdn.syncfusion.com/ej2/31.1.23/dist/ej2-pdfviewer-lib'
98+
});
99+
viewer.appendTo('#PdfViewer');
100+
101+
// None (no text info)
102+
const btnNone = document.getElementById('extractNoneRange');
103+
if (btnNone) {
104+
btnNone.addEventListener('click', function () {
105+
viewer.extractText(0, 2, ExtractTextOption.None).then((val) => {
106+
console.log('None (Pages 0–2):', val);
107+
});
108+
});
109+
}
110+
111+
// TextOnly
112+
const btnTextOnly = document.getElementById('extractTextOnlyRange');
113+
if (btnTextOnly) {
114+
btnTextOnly.addEventListener('click', function () {
115+
viewer.extractText(0, 2, ExtractTextOption.TextOnly).then((val: any) => {
116+
console.log('TextOnly (Pages 0–2):');
117+
console.log(val);
118+
});
119+
});
120+
}
121+
122+
// BoundsOnly
123+
const btnBoundsOnly = document.getElementById('extractBoundsOnlyRange');
124+
if (btnBoundsOnly) {
125+
btnBoundsOnly.addEventListener('click', function () {
126+
viewer.extractText(0, 2, ExtractTextOption.BoundsOnly).then((val: any) => {
127+
// Typically returns val.textData with bounds per page
128+
console.log('BoundsOnly (Pages 0–2):');
129+
console.log(val);
130+
});
131+
});
132+
}
133+
134+
// TextAndBounds
135+
const btnTextAndBounds = document.getElementById('extractTextAndBoundsRange');
136+
if (btnTextAndBounds) {
137+
btnTextAndBounds.addEventListener('click', function () {
138+
viewer.extractText(0, 2, ExtractTextOption.TextAndBounds).then((val: any) => {
139+
console.log('TextAndBounds (Pages 0–2):');
140+
console.log(val);
141+
});
142+
});
143+
}
144+
```
145+
69146
[View sample in GitHub](https://github.com/SyncfusionExamples/javascript-pdf-viewer-examples/tree/master/How%20to)
70147

71148
## See Also

‎Document-Processing/PDF/PDF-Viewer/javascript-es5/print/enable-print-rotation.md‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,12 @@ documentation: ug
88
domainurl: ##DomainURL##
99
---
1010

11-
# Enable print rotation in the PDF Viewer
11+
# Enable print rotation in the JavaScript
1212

1313
Set the `enablePrintRotation` property to control whether landscape pages are rotated automatically to fit the paper orientation. Keep it enabled to minimize clipping, or disable it to preserve the original orientation.
1414

15+
![Print Rotate](../../javascript-es6/images/print-rotate.gif)
16+
1517
{% tabs %}
1618
{% highlight js tabtitle="Standalone" %}
1719

‎Document-Processing/PDF/PDF-Viewer/javascript-es5/print/overview.md‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,26 @@
11
---
22
layout: post
3-
title: Print Overview in TypeScript PDF Viewer | Syncfusion
4-
description: Learn how to enable, monitor and customize printing in the Syncfusion TypeScript PDF Viewer component.
3+
title: Print Overview in JavaScript PDF Viewer | Syncfusion
4+
description: Learn how to enable, monitor and customize printing in the Syncfusion JavaScript PDF Viewer component.
55
platform: document-processing
66
control: Print
77
documentation: ug
88
domainurl: ##DomainURL##
99
---
1010

11-
# Print Overview in TypeScript PDF Viewer Control
11+
# Print Overview in JavaScript PDF Viewer Control
1212

13-
The TypeScript PDF Viewer includes built‑in printing via the toolbar and APIs so you can control how documents are printed and monitor the process.
13+
The JavaScript PDF Viewer includes built‑in printing via the toolbar and APIs so you can control how documents are printed and monitor the process.
1414

1515
Select **Print** in the built-in toolbar to open the browser print dialog.
1616

17-
![Print](../images/print.png)
17+
![Print](../../javascript-es6/images/print.gif)
1818

19-
## Enable or Disable Print in TypeScript PDF Viewer
19+
## Enable or Disable Print in JavaScript PDF Viewer
2020

21-
The Syncfusion TypeScript PDF Viewer component lets users print a loaded PDF document through the built-in toolbar or programmatic calls. Control whether printing is available by setting the `enablePrint` property.
21+
The Syncfusion JavaScript PDF Viewer component lets users print a loaded PDF document through the built-in toolbar or programmatic calls. Control whether printing is available by setting the `enablePrint` property.
2222

23-
The following TypeScript examples render the PDF Viewer with printing enabled in standalone and server-backed applications.
23+
The following JavaScript examples render the PDF Viewer with printing enabled in standalone and server-backed applications.
2424

2525
{% tabs %}
2626
{% highlight js tabtitle="Standalone" %}
@@ -67,7 +67,7 @@ pdfviewer.appendTo('#PdfViewer');
6767
{% endhighlight %}
6868
{% endtabs %}
6969

70-
## Print programmatically in Typescript PDF Viewer
70+
## Print programmatically in JavaScript PDF Viewer
7171

7272
To start printing from code, call the `print.print()` method after loading a document. This approach is useful when you need to wire up custom UI or initiate printing automatically.
7373

@@ -134,7 +134,7 @@ if (printButton) {
134134
{% endhighlight %}
135135
{% endtabs %}
136136

137-
## Key capabilities:
137+
## Key capabilities
138138

139139
- Enable or disable printing with the enablePrint property
140140
- Start printing from UI (toolbar Print) or programmatically using print.print()
@@ -143,7 +143,7 @@ if (printButton) {
143143
- Choose where printing happens with printMode (Default or NewWindow)
144144
- Track the life cycle with printStart and printEnd events
145145

146-
[View Sample in GitHub](https://github.com/SyncfusionExamples/typescript-pdf-viewer-examples)
146+
[View Sample in GitHub](https://github.com/SyncfusionExamples/javascript-pdf-viewer-examples)
147147

148148
## See Also
149149

‎Document-Processing/PDF/PDF-Viewer/javascript-es5/print/print-modes.md‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,16 @@ documentation: ug
88
domainurl: ##DomainURL##
99
---
1010

11-
# Print modes in the PDF Viewer
11+
# Print modes in the JavaScript PDF Viewer
1212

1313
Use the `printMode` property to choose how the document is printed.
1414

1515
The supported values are:
1616
* `Default`: Prints the document from the same window.
1717
* `NewWindow`: Prints the document from a new window or tab, which can help with browser pop-up policies.
1818

19+
![Print in New Window](../../javascript-es6/images/print-newwindow.gif)
20+
1921
N> Browser pop-up blockers must allow new windows or tabs when you use `pdfviewer.printMode ="NewWindow";`.
2022

2123
The following example shows how to set the print mode.

0 commit comments

Comments
 (0)