# Perspective: Check page open and bind to background colour

**URL:** <https://forum.inductiveautomation.com/t/perspective-check-page-open-and-bind-to-background-colour/65437>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [October 20, 2022, 4:31am UTC](https://forum.inductiveautomation.com/t/perspective-check-page-open-and-bind-to-background-colour/65437 "2022-10-20T04:31:50Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Kingsley\_Choong](https://avatars.discourse-cdn.com/v4/letter/k/b487fb/32.png) [@Kingsley\_Choong](https://forum.inductiveautomation.com/u/Kingsley_Choong)\
**Post date:** [October 20, 2022, 4:31am UTC](https://forum.inductiveautomation.com/t/perspective-check-page-open-and-bind-to-background-colour/65437/1 "2022-10-20T04:31:50Z")

</div>

Is that any possible method to check whether a specific page are open/active in perspective session that can bind to a variable/tag or style binding to change a background colour of a icon dynamically? If so, please guide me as well. Thank you.

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [October 20, 2022, 5:53am UTC](https://forum.inductiveautomation.com/t/perspective-check-page-open-and-bind-to-background-colour/65437/2 "2022-10-20T05:53:07Z")

</div>

You can bind to the page property  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/3/a37987b80ab167b8105d68f58e8f1922fd031573.png)

`page.props.path` is the relative URL (e.g. `/area/page`)  
`page.props.pageId` is the page's main View's viewPath

Alternatively, to view a complete list of all Views open in a session, you can get that from `system.perspective.getSessionInfo`. That'll get you a list of all open sessions and the info for all of them. You just need to find the current session... which is easier said than done. For some reason, the sessionId (8 character HEX) doesn't match the format of the `session.props.id` (massive long HEX)  
@cmallonee maybe?

---

<div class="post-metadata">

**Author:** ![Kingsley\_Choong](https://avatars.discourse-cdn.com/v4/letter/k/b487fb/32.png) [@Kingsley\_Choong](https://forum.inductiveautomation.com/u/Kingsley_Choong)\
**Post date:** [October 20, 2022, 6:34am UTC](https://forum.inductiveautomation.com/t/perspective-check-page-open-and-bind-to-background-colour/65437/3 "2022-10-20T06:34:40Z")

</div>

Thx for the suggestion, the 'pageID ' in page property will only display the page ID which will not show whether the page is active or open.  
I had browse through the system.perspective.getSessionInfo and found there is a 'pageIds' which I may use to check the page Id that are currently active, but can you guide me how to implement it to the component property binding to change the background colour whenever only the page is active?  
Sorry that I am new for scripting in Ignition.

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [October 20, 2022, 4:04pm UTC](https://forum.inductiveautomation.com/t/perspective-check-page-open-and-bind-to-background-colour/65437/4 "2022-10-20T16:04:49Z")

</div>

> [@Kingsley\_Choong](#):
>
> a specific page

You can't manage this via documented scripting functions. The problem you're going to run into is that `system.perspective.getSessionInfo()` will return a list of sessions but you can only access a count of pages and the `id` of each page - but nothing about the path of the Page or the Primary View in use.

> [@nminchin](#):
>
> `page.props.pageId` is the page's main View's viewPath

No it's not. I have to assume you declared this while using the Designer - but this is ONLY true in the Designer because we have to mock-up a fake page id since no page exists. At runtime, each page gets a unique 8-digit identifier.  
 ![Screen Shot 2022-10-20 at 8.51.49 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/2/8224f7fecd85d973762d0b0fabbeb39493ee9c72.png)

> [@nminchin](#):
>
> For some reason, the sessionId (8 character HEX) doesn't match the format of the `session.props.id`

I'd need to see how you're obtaining this session `id`, because I can't think of anywhere we would supply an 8-digit placeholder for the session `id`.

> [@Kingsley\_Choong](#):
>
> binding to change the background colour whenever only the page is active

Two options here:

- Bind against `page.props.path`, and have a dictionary of Page paths you've setup yourself (sans any slashes).
- Bind against `page.props.primaryView` and have a dictionary of View paths you've setup yourself (sans any slashes).

I recommend the `path` route because your post explicitly called out Page and not View:

Custom property (on `root`) with dictionary of supported paths:  
 ![Screen Shot 2022-10-20 at 9.02.47 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/2/f2ddac91d96a5e10a4c9d12d1de7b921be4e6292.png)

Binding and transform:

 ![Screen Shot 2022-10-20 at 9.04.12 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/9/d/9ddbd28a477884ac3d47a6b1955b7487f96bce20.png)

Result:  
 ![Screen Shot 2022-10-20 at 9.01.33 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/0/a0771e0f4219d8d99bb4039fb52b03a3fe9c083c.png)

---

<div class="post-metadata">

**Author:** ![Kingsley\_Choong](https://avatars.discourse-cdn.com/v4/letter/k/b487fb/32.png) [@Kingsley\_Choong](https://forum.inductiveautomation.com/u/Kingsley_Choong)\
**Post date:** [October 21, 2022, 1:43am UTC](https://forum.inductiveautomation.com/t/perspective-check-page-open-and-bind-to-background-colour/65437/5 "2022-10-21T01:43:41Z")

</div>

First, thank you for the suggestion, I work with this example, the result is not as I expected. Let say I create an embedded view as below with the three icons and this embedded view will drop into each of the page represent by 'maintenance', 'motorpage' and 'cylinderpage'. Each icon represent with each page.  
 ![2](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/6/466ac58753863f2017205fbb84e7529f1ba50294.jpeg)

Inside the root of embedded view, I already define the custom property  
 ![1](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/8/283542708a7960714c344c4fce8889666193ded3.jpeg)

Running with the script in the example above will result all icons turn green at the same time.  
 ![5](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/8/880e045b86c408e1dff9e895de41fd2543128c4a.jpeg)

May I know how can I modify the script that bind to the color property of the icon so that let say first icon represent 'maintenance', when only the 'maintenance' page is active, the first icon will turn green else will turn black?

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [October 21, 2022, 2:30pm UTC](https://forum.inductiveautomation.com/t/perspective-check-page-open-and-bind-to-background-colour/65437/6 "2022-10-21T14:30:45Z")

</div>

Hmm... I was expecting you to have one Icon which needed to change color.

If you're going to have multiple icons, where only one of them is "green" based on the page, then you're better served just using the following expression binding on `Icon.props.color`:

```auto
if(this.page.props.path="/motorpage", "#47ff47", "#000000")

```

Then copy this binding to the other sibling icons, replacing the path which should result in the icon becoming green. You don't need to strip out the slashes going this route.
