# New Feature: Perspective Key Events

**URL:** <https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974>\
**Category:** Ignition Early Access\
**Tags:** perspective\
**Created:** [August 16, 2021, 7:14pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974 "2021-08-16T19:14:08Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![jball](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jball/32/11128_2.png) [@jball](https://forum.inductiveautomation.com/u/jball)\
**Post date:** [August 16, 2021, 7:14pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974/1 "2021-08-16T19:14:08Z")

</div>

Similar in functionality to Vision's Keystroke Scripts, we have introduced **Key Events** into Perspective's Session Events, which can be found in the latest nightly build. These events can be found under the **Project** \> **Session Events** menu item:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/5/c5fd8b145914825c0f96c242abdd343e03503183.png)

This functionality wraps a [KeyboardEvent](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent) that is generated by the browser and provides the ability to match either a **single key** (with or without modifiers), or a **regex pattern** (series of keys) and execute a script once the match has been detected. The match for a single key can be made either when the key has been pressed (_keyDown_) or when the key has been released (_keyUp_). A regex match is always made when the key has been released.

## Single Key

For single keys entered, the match can be a physical _key_ typed, or the _code_ generated by the key. **Modifiers** are additional keys that can be held down during a `KeyboardEvent` and are detectable in the event data. These include _alt_, _control_, _shift_, and _meta_ (command). In addition, the resulting `KeyboardEvent` that is used for match detection has the following advance features that can be utilized:

- **Capture Phase** - Lets the execution of the event happen during "event capturing", which will allow the resulting script to execute _before_ other interface events that may be in place. By default, events execute during an "event bubbling" phase which is dictated by the position of the event binding in the Document Object Model (DOM). In the case of Key Events, these are bound to the `document` layer of the DOM and will execute _after_ other interface events if this option is unchecked.

- **Prevent Default** - Prevents any default browser functionality that would be associated with the event binding. This can be toggled on if there is any functionality that _should not_ be run when a `keydown`/`keyup` event has been fired at the `document` level when a key match is made.

- **Stop Propagation** - Prevents the event from going any further beyond the point in the DOM where it is bound (the `document` level). This can be especially useful if combined with the _Capture Phase_ option as it will prevent any interface `keydown`/`keyup` events from running that have been bound deeper in the DOM than the `document` level.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/d/bdad79d29047067b7cddc10c5eb0e3864467a753.png)

## Regex Pattern

For a regular expression (regex) pattern match, the match will be made based upon a supplied regex _pattern_ and a series of keys that have been stored in a _match buffer_. While there are a variety of use cases for this type of key event detection, the primary use case that we targeted with this feature was **scanning barcodes** from an **HID barcode scanner**.

To create a regex pattern to match against, an online tool like [Regexr](https://regexr.com/) can be very helpful to test for pattern validity. Once a pattern is entered, the _match buffer_ will need to be set. This buffer will always be the most recently typed characters and should be the length of whatever a "correct match" would be based on the supplied regex pattern to minimize the amount of processing that is done during key entry in a Perspective session.

### Example Barcode Pattern Match

The _Pattern_ field in example below contains a regex that matches a `#` character, then 12 numeric characters, and then a `@` character. Additionally, the match is made at the _end of the match buffer_, as denoted by the `$` character used as an anchor. The total number of characters that this regex pattern is meant to match is `14`, so that is used as the value for the _match buffer_:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/7/57ce1a337dd2c02691f3dabe4542215a815bd2a7.png)

**Note:** Key event detection is meant to work inside of a Perspective Session and is not active inside of the Designer.

**Also to Note:** The device being used to trigger the key events must generate a `KeyboardEvent` when a key is pressed. HID barcode scanners _will_ generate a `KeyboardEvent` as they mimic a user typing keys on a physical keyboard. Scanners and other input devices that do not create a `KeyboardEvent` will not trigger this logic.

---

<div class="post-metadata">

**Author:** ![jball](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jball/32/11128_2.png) [@jball](https://forum.inductiveautomation.com/u/jball)\
**Post date:** [August 16, 2021, 7:19pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974/2 "2021-08-16T19:19:18Z")

</div>



---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [August 16, 2021, 10:52pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974/3 "2021-08-16T22:52:48Z")

</div>

> [@jball](#):
>
> or a **regex pattern** (series of keys) and execute a script once the match has been detected.

Oooo! Like!

---

<div class="post-metadata">

**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\
**Post date:** [August 17, 2021, 3:54pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974/4 "2021-08-17T15:54:25Z")

</div>

I wish we have key event stroke for individual page or view not the whole session.

We have a lot of case in a single project that each page should behave differently for arrow key events.

---

<div class="post-metadata">

**Author:** ![jball](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jball/32/11128_2.png) [@jball](https://forum.inductiveautomation.com/u/jball)\
**Post date:** [August 17, 2021, 3:58pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974/5 "2021-08-17T15:58:47Z")

</div>

As part of the event data, you’ve got access to the `pageId` and `path`, so you’ll be able to create different interactions based on the page being displayed. The session is there for you as well (in case you need it).

---

<div class="post-metadata">

**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\
**Post date:** [August 17, 2021, 4:13pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974/6 "2021-08-17T16:13:27Z")

</div>

Good. But if we have this in view config section it will capsulated every thing in single view file and easy to manage.  
Now configuration is in differnet part and hard to manage after sometime.  
when you want to export a page to other project it may overwrite the new project event script as well. So I have to copy and paste my event code by hand to prevention overwrite other page event script.

---

<div class="post-metadata">

**Author:** ![Arnaud\_Declerck](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/arnaud_declerck/32/44872_2.png) [@Arnaud\_Declerck](https://forum.inductiveautomation.com/u/Arnaud_Declerck)\
**Post date:** [November 2, 2021, 8:32am UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974/7 "2021-11-02T08:32:49Z")

</div>

Can we use the key event to conbine a keydown and a mouse click. For example a control keyDown and right click of a mouse open a pdf.

regards

---

<div class="post-metadata">

**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\
**Post date:** [November 2, 2021, 2:35pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974/8 "2021-11-02T14:35:08Z")

</div>

> [@Arnaud\_Declerck](#):
>
> Can we use the key event to conbine a keydown and a mouse click. For example a control keyDown and right click of a mouse open a pdf.

You don't need this feature for that. Mouse events already have a `ctrlKey` property; you would process every mouse event on your component, then check if `ctrlKey` is set to drive your additional logic:  
[https://docs.inductiveautomation.com/display/DOC81/Perspective+Event+Types+Reference#PerspectiveEventTypesReference-MouseEvents](https://docs.inductiveautomation.com/display/DOC81/Perspective+Event+Types+Reference#PerspectiveEventTypesReference-MouseEvents)

---

<div class="post-metadata">

**Author:** ![Arnaud\_Declerck](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/arnaud_declerck/32/44872_2.png) [@Arnaud\_Declerck](https://forum.inductiveautomation.com/u/Arnaud_Declerck)\
**Post date:** [November 2, 2021, 2:39pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-key-events/49974/9 "2021-11-02T14:39:05Z")

</div>

hi @paul-griffith,

thanks for your reply. I will test that out.

Regards
