Signature Control Oracle Policy Automation JavaScript Extensions

Here at the OPA Hub we have already gotten back into gear after the holidays and in fact next week we will be off to Finland for some exciting OPA-related things but in the meantime, here are some thoughts about the Signature Control. Actually it is not just about the Signature Control. Rather, in this post, we want to look at some ways of extending the unextendable. If you check out the documentation regarding the Oracle Policy Automation JavaScript Interview Extensions, the Signature Control is not in the list (except for the styling possibilities- there are no extension capabilities). So what if you need to change it’s behaviour? Can we invent Signature Control Oracle Policy Automation JavaScript Extensions?

Of course I can hear you say that the likelihood of wanting to use the Signature Control Oracle Policy Automation JavaScript Extensions is small : after all we should never be using the JavaScript extensions to do anything too crazy (remember the guidelines at the bottom of this page). What on earth would people want to change for the Signature Control – or indeed for any Control that is not currently listed as having that capability?

Well, here is a simple example :

Signature Control Oracle Policy Automation JavaScript Extensions

The Signature Control is not responsive. Of course I could tell my phone and tablet users to zoom in or out, or switch orientation. But I don’t want to. Look, I’m just trying to make a point. Customers will always come up with things that we might not expect, and the Signature Control will be no exception.

The width of the control is fixed, by the parameter entered at Design Time :

Signature Control Oracle Policy Automation JavaScript Extensions

Since we cannot extend the behaviour of the Signature, maybe we need another approach. Let’s look at some useful things we came across while researching this article.

  1. The most obvious way to extend the Signature Control is to add a blank Control to the Interview that can be extended, and leverage the keys (mount, unmount and so on) of that Control to work on the Signature. In the case shown below, a blank Container has been added to the Interview for that purpose. It has a custom property to help identify it in the JavaScript later, like most of the examples shown on this site and elsewhere.

Signature Control Oracle Policy Automation JavaScript Extensions

2. Secondly, We should be aware that the value set at Design Time for the Signature Control width (and a lot of other useful information about your Interview) can be referenced in JavaScript :

var currentWidth = interview._session.config.interviewProperties["signature-width"];

This might be useful for some sort of fallback or default value.

3. Thirdly we should be good citizens and not forget that the styling options in Oracle Policy Automation do give us a fairly broad range of options without resorting to JavaScript code. For example:

Signature Control Oracle Policy Automation JavaScript Extensions

In the above example, we use the styling capabilities of the Signature Control to change the ink colour, and we apply a CSS style to the Control as a whole. With that in mind, we can leverage media queries in the CSS to establish different sizes of display for different users:

In the example CSS below, the outline (the border) of the Signature can be changed depending on the size of the viewport / screen that the user is holding. Smaller viewports will use a one pixel border, larger ones will use 2 pixel. It’s a simple example.

4. The Signature Control might only need extending during the mount or unmount process – which makes a Container Control a good choice. For the update we will simply leave that blank since there is nothing on the Signature Control we want to work with.

The client didn’t like that funny dotted line you get when you need to sign the signature panel. Using our newly added Class, we can select the siblings of the Signature and remove the line:

var myDiv = $('.eca-signature');
var myLine = $("canvas.eca-signature").siblings();
myLine.hide();

Signature Control Oracle Policy Automation JavaScript Extensions

5.  We might also use jQuery to add a resize handler to the Interview window, and based on that we could resize the Signature to a certain degree. We can also trigger the resize handler when the window is first shown, to make sure our Signature Control is always presented in the right size. And that opens up a world of opportunities.

So what does all this give us? The following video shows some of the results. This is just a scratchpad idea – so as usual the example is given with no warranties. You can get the example code from the OPA Hub Shop by searching the code examples for Signature Control.

Signature Control Oracle Policy Automation JavaScript Extensions – Summary

It’s a work in progress, but piggybacking on top of an extendable Control like the Container (which is also pretty much invisible, which is a bonus) let’s us imagine all sorts of trickery on the Signature Control. Plus, as good citizens we have learned along the way of some interesting standard styling and customization.

In the example code there are, as usual, a number of console logs as well as some experimental code that probably does nothing : as I always say, this is for educational purposes!