SyncfusionExamples
diff --git a/‎How to/Get co-ordinates of Annotations/.gitignore renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/.gitignore b/‎How to/Get co-ordinates of Annotations/.gitignore renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/.gitignore
diff --git a/‎How to/Get co-ordinates of Annotations/README.md renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/README.md b/‎How to/Get co-ordinates of Annotations/README.md renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/README.md
diff --git a/‎How to/Get co-ordinates of Annotations/e2e/index.spec.js renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/e2e/index.spec.js b/‎How to/Get co-ordinates of Annotations/e2e/index.spec.js renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/e2e/index.spec.js
diff --git a/‎How to/Get co-ordinates of Annotations/e2e/protractor.conf.js renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/e2e/protractor.conf.js b/‎How to/Get co-ordinates of Annotations/e2e/protractor.conf.js renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/e2e/protractor.conf.js
diff --git a/‎How to/Get co-ordinates of Annotations/gulpfile.js renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/gulpfile.js b/‎How to/Get co-ordinates of Annotations/gulpfile.js renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/gulpfile.js
diff --git a/‎How to/Get co-ordinates of Annotations/license renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/license b/‎How to/Get co-ordinates of Annotations/license renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/license
diff --git a/‎How to/Get co-ordinates of Annotations/package.json renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/package.json b/‎How to/Get co-ordinates of Annotations/package.json renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/package.json
diff --git a/‎How to/Add Rectangle Annotations Using Search Text Bounds/src/app/app.ts
+49 b/‎How to/Add Rectangle Annotations Using Search Text Bounds/src/app/app.ts
+49
diff --git a/‎How to/Get co-ordinates of Annotations/src/index.html renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/src/index.html
+3 b/‎How to/Get co-ordinates of Annotations/src/index.html renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/src/index.html
+3
diff --git a/‎How to/Get co-ordinates of Annotations/src/resources/favicon.ico renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/src/resources/favicon.ico b/‎How to/Get co-ordinates of Annotations/src/resources/favicon.ico renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/src/resources/favicon.ico
diff --git a/‎How to/Get co-ordinates of Annotations/src/styles/styles.css renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/src/styles/styles.css b/‎How to/Get co-ordinates of Annotations/src/styles/styles.css renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/src/styles/styles.css
diff --git a/‎How to/Get co-ordinates of Annotations/tsconfig.json renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/tsconfig.json b/‎How to/Get co-ordinates of Annotations/tsconfig.json renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/tsconfig.json
diff --git a/‎How to/Get co-ordinates of Annotations/webpack.config.js renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/webpack.config.js b/‎How to/Get co-ordinates of Annotations/webpack.config.js renamed to ‎How to/Add Rectangle Annotations Using Search Text Bounds/webpack.config.js
diff --git a/‎How to/Get co-ordinates of Annotations/src/app/app.ts
-17 b/‎How to/Get co-ordinates of Annotations/src/app/app.ts
-17
@@ -0,0 +1,49 @@
+import { pdf } from '@syncfusion/ej2';
+import { PdfViewer, TextSelection, TextSearch, Print, Navigation, Toolbar, Magnification, Annotation, FormDesigner, FormFields, TextSearchHighlightEventArgs, RectangleBounds, RectangleBoundsModel, RectangleSettings } from '@syncfusion/ej2-pdfviewer';
+
+// Inject required modules
+PdfViewer.Inject(TextSelection, TextSearch, Print, Navigation, Toolbar, Magnification, Annotation, FormDesigner, FormFields);
+
+const pdfviewer: PdfViewer = new PdfViewer({
+    documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf',
+    resourceUrl:'https://cdn.syncfusion.com/ej2/28.1.33/dist/ej2-pdfviewer-lib'
+});
+
+pdfviewer.appendTo('#PdfViewer');
+
+// Highlight event handler for text search, which adds a rectangle annotation where the text is found
+pdfviewer.textSearchHighlight = function(args: TextSearchHighlightEventArgs): void {
+    console.log(args);
+    const pageNumber: number = args.pageNumber;
+    const bounds: RectangleBoundsModel = args.bounds;
+    pdfviewer.annotation.addAnnotation('Rectangle', {
+        offset: { x: bounds.left,  y: bounds.top },
+        pageNumber: pageNumber, 
+        width: bounds.width, 
+        height: bounds.height,
+    } as RectangleSettings);
+};
+
+// Add event listener to "searchText" button to trigger a search for the term 'PDF'
+const searchTextButton = document.getElementById('searchText');
+if (searchTextButton) {
+    searchTextButton.addEventListener('click', function() {
+        pdfviewer.textSearchModule.searchText('PDF', false);
+    });
+}
+
+// Add event listener to "searchNext" button to navigate to the next search result
+const searchNextButton = document.getElementById('searchNext');
+if (searchNextButton) {
+    searchNextButton.addEventListener('click', function() {
+    pdfviewer.textSearch.searchNext();
+    });
+}
+
+// Add event listener to "searchCancel" button to cancel the current text search operation
+const searchCancelButton = document.getElementById('searchCancel');
+if (searchCancelButton) {
+    searchCancelButton.addEventListener('click', function() {
+    pdfviewer.textSearch.cancelTextSearch();
+    });
+}
@@ -12,6 +12,9 @@
 </head>
 
 <body>
+    <button id="searchText">Search Text</button>
+    <button id="searchNext">Search Next</button>
+    <button id="searchCancel">Cancel Search</button>
     <!--Element which will render as PDF Viewer -->
     <div id="PdfViewer"></div>
 </body>