# Highlight tool trigger as left click

**URL:** <https://pdfjs.community/t/highlight-tool-trigger-as-left-click/1664>\
**Category:** Technical Support\
**Created:** [May 10, 2022, 7:34am UTC](https://pdfjs.community/t/highlight-tool-trigger-as-left-click/1664 "2022-05-10T07:34:16Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Abhiramsa3](https://avatars.discourse-cdn.com/v4/letter/a/43a26b/32.png) [@Abhiramsa3](https://pdfjs.community/u/Abhiramsa3)\
**Post date:** [May 10, 2022, 7:34am UTC](https://pdfjs.community/t/highlight-tool-trigger-as-left-click/1664/1 "2022-05-10T07:34:16Z")

</div>

**Which product are you using?**  
PDF Express Js

**PDF.js Express Version**  
8.X.X

**Detailed description of issue**  
on left click of mouse is it possible to highlightToolbutton option to be triggered.

**Expected behaviour**  
on left click of mouse is it possible to triggered the highlightToolbutton menu, and capture the highlighted text.

**Does your issue happen with every document, or just one?**  
Yes

**Link to document**

**Code snippet**  
annotationManager.addEventListener(‘annotationSelected’, (annotations, action) =\> {  
if (action === ‘selected’) {  
console.log(‘annotation selection action’, action);  
const selectedAnnots = annotationManager.getSelectedAnnotations();  
console.log(‘selected Content’, selectedAnnots);

```
            } else if (action === 'deselected') {
                console.log('annotation deselection', annotations);
               
            }
            if (annotations === null && action === 'deselected') {
                console.log('all annotations deselected');
            }
        })
```

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex031/uploads/pdfjscommunity/original/1X/ffbcd25c7d423db8d5acd5db201c272f4db306dd.png) [@system](https://pdfjs.community/u/system)\
**Post date:** [May 10, 2022, 7:34am UTC](https://pdfjs.community/t/highlight-tool-trigger-as-left-click/1664/3 "2022-05-10T07:34:22Z")

</div>

**Hello, I’m Ron, an automated tech support bot 🤖**

While you wait for one of our customer support representatives to get back to you, please check out some of these documentation pages:

Guides:
- [Customize annotation tools - Extend built in tools](https://pdfjs.express/documentation/annotation/customizing-tools.8#extend-built-in-tools)
- [Customizing WebViewer UI Popups](https://pdfjs.express/documentation/ui-customization/customizing-popup.8)
- [Customize toolbar in viewer - Header items - ActionButton](https://pdfjs.express/documentation/ui-customization/customizing-header.8#actionbutton)

APIs:
- [Tools.CalloutCreateTool - mouseLeftUp(e)](https://pdfjs.express/api/7.0/Tools.CalloutCreateTool.html#mouseLeftUp__anchor)
- [Tools.GenericAnnotationCreateTool](https://pdfjs.express/api/7.0/Tools.GenericAnnotationCreateTool.html#__anchor)
- [Tools.EllipseCreateTool - mouseLeftUp(e)](https://pdfjs.express/api/7.0/Tools.EllipseCreateTool.html#mouseLeftUp__anchor)

Forums:
- [On double click/Enter, i want to finish marking of annotation where the last point was set and not where the cursor is present](https://pdfjs.community/t/on-double-click-enter-i-want-to-finish-marking-of-annotation-where-the-last-point-was-set-and-not-where-the-cursor-is-present/446/3)
- [Force tool button panToolButton starting enabled by default](https://pdfjs.community/t/force-tool-button-pantoolbutton-starting-enabled-by-default/1449/1)
- [Customization of “stickyToolGroupButton”](https://pdfjs.community/t/customization-of-stickytoolgroupbutton/197/1)

---

<div class="post-metadata">

**Author:** ![Logan](https://yyz1.discourse-cdn.com/flex031/user_avatar/pdfjs.community/logan/32/13_2.png) [@Logan](https://pdfjs.community/u/Logan)\
**Post date:** [May 12, 2022, 3:55pm UTC](https://pdfjs.community/t/highlight-tool-trigger-as-left-click/1664/4 "2022-05-12T15:55:06Z")

</div>

Hey there,

I am a bit confused by your question. Can you please be a bit more descriptive? Which menu/option do you want to trigger? What is the use case?

Logan

---

<div class="post-metadata">

**Author:** ![Abhiramsa3](https://avatars.discourse-cdn.com/v4/letter/a/43a26b/32.png) [@Abhiramsa3](https://pdfjs.community/u/Abhiramsa3)\
**Post date:** [May 13, 2022, 5:08am UTC](https://pdfjs.community/t/highlight-tool-trigger-as-left-click/1664/5 "2022-05-13T05:08:24Z")

</div>

For example am having text paragraph consist of 10 lines, i need to select 2 lines out of 10, on left click of mouse , while selecting 2 lines i need to trigger highlightToolbutton menu function.

---

<div class="post-metadata">

**Author:** ![Logan](https://yyz1.discourse-cdn.com/flex031/user_avatar/pdfjs.community/logan/32/13_2.png) [@Logan](https://pdfjs.community/u/Logan)\
**Post date:** [May 18, 2022, 4:18pm UTC](https://pdfjs.community/t/highlight-tool-trigger-as-left-click/1664/6 "2022-05-18T16:18:35Z")

</div>

Hi there,

There is no good way to select the highlight tool when text is selected. However, you can edit the text select tool to highlight text which is pretty close to what you want I think. here’s some code:

```javascript
  const { Tools } = instance.Core

  const textHighlight = new Tools.TextHighlightCreateTool(instance.Core.documentViewer);
  
  const textSelectDown = Tools.TextSelectTool.prototype.mouseLeftDown;
  Tools.TextSelectTool.prototype.mouseLeftDown = function() {
    textHighlight.mouseLeftDown(arguments[0])
    textSelectDown.apply(this, arguments);
  };
  
  const textSelectMove = Tools.TextSelectTool.prototype.mouseMove;
  Tools.TextSelectTool.prototype.mouseMove = function() {
    textHighlight.mouseMove(arguments[0])
    textSelectMove.apply(this, arguments);
  };
  
  const textSelectUp = Tools.TextSelectTool.prototype.mouseLeftUp;
  Tools.TextSelectTool.prototype.mouseLeftUp = function() {
    textHighlight.mouseLeftUp(arguments[0])
    textSelectUp.apply(this, arguments);
  };

```

Thanks!  
Logan

---

<div class="post-metadata">

**Author:** ![Abhiramsa3](https://avatars.discourse-cdn.com/v4/letter/a/43a26b/32.png) [@Abhiramsa3](https://pdfjs.community/u/Abhiramsa3)\
**Post date:** [May 20, 2022, 5:57am UTC](https://pdfjs.community/t/highlight-tool-trigger-as-left-click/1664/7 "2022-05-20T05:57:34Z")

</div>

Hi Logan,  
Excellent it worked for me, highlightToolbutton is triggering when i select.  
is it possible to capture highlighted text in some variable?

---

<div class="post-metadata">

**Author:** ![Logan](https://yyz1.discourse-cdn.com/flex031/user_avatar/pdfjs.community/logan/32/13_2.png) [@Logan](https://pdfjs.community/u/Logan)\
**Post date:** [May 20, 2022, 2:29pm UTC](https://pdfjs.community/t/highlight-tool-trigger-as-left-click/1664/8 "2022-05-20T14:29:36Z")

</div>

Hey!

In the `mouseLeftUp` event you could call `documentViewer.getSelectedText()` like so:

```javascript
  const textSelectUp = Tools.TextSelectTool.prototype.mouseLeftUp;
  Tools.TextSelectTool.prototype.mouseLeftUp = function() {
    textHighlight.mouseLeftUp(arguments[0])
    textSelectUp.apply(this, arguments);

    const text = instance.Core.documentViewer.getSelectedText()
    console.log(text)
  };

```

Thanks,  
Logan