Versions Compared

Version Old Version 1 New Version 2
Changes made by

Armando Carratala

Armando Carratala

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Table of Contents
maxLevel2
indentcircle

Description

AlisonGUI is a javascript client library to access Alison-Desktop and AlisonServer certificates functionalities from any browser. AlisonGUI embed AkisonJS into it.  

Browser compatibility

Chrome

Firefox

Safari

Opera

Brave

Edge

IExplorer

Latest ✔Latest ✔Latest ✔Latest ✔Latest ✔Latest ✔

11 ✔

Download

You can [download latest stable release] of AlisonGUI.

Integration

You must include the following line in your HTML page.

<script type="text/javascript" src="alisonGUI.umd.js"></script>

Future Releases

It is possible to access future releases of the library to test new features to be implemented.



Note
titleDisclaimer

Disclaimer

This is a work in progress.

It may be subject to changes in the future.


Related Product

Alison Desktop

Go to the Alison Desktop documentation.


Methods

List of available methods.


Version

Use the attribute libVersion to determine current version of the library.

Code Block
languageactionscript3
titleLibrary Version
const version = alisonGUI.libVersion;

.


Anchor
methodInitialize
methodInitialize
Mount

This method initialize the defined providers, set filters and display features and show a dialog windows to perform the selected operation.


Code Block
languagejs
titleInitialize
AlisonGUI.mount( parameter );


ArgumentRequiredDescription
parameter✔

A JSon string defining all the components and operations.

A description of each field can be found below.

.


Parameters

Following fields can be present into the parameters.

Code Block
languagejs
titleFields
{
	gui?: {...},
	providers: {...},
	filters?: [...],
	certificate?: {...},
	operation?: {...},
	signature?: {...},
	onConfirm: (result) {...},
	onCancel: (result) {...}
}

.

gui:

These values define some graphics features of the library.

Code Block
languagejs
titlegui:
gui: {
	logoUrl: logoUrl?,
	theme: themeId?,
	header: header?,
	language: language?,
	viewSignature: boolean?
}


ArgumentRequiredDescription
logoUrl✘

URL to the logo image to be included into the header of the dialog window.

theme✘Name of the graphic theme to be used. Default value: "theme0".
header✘

String to describe the operation.

language✘Language. It none is defined, library uses browser language, or "en" if the language is not supported by the library.
viewSignature✘If "true", the text to be signed is displayed on frame of the same window.

.

filters:

It's possible to define a filter to be applied on the certificate list. A filter can define several conditions.

Code Block
languagejs
titlegui:
filters: [
	{
		subject: subject?,
		issuer: issuer?,
		keysore: keystoreArray?,
		expirationWindow: expirationWindow?
	} , ...
}


ArgumentRequiredDescription
subject✘

A string that is included into the Distinguished Name (DN) of the subject's certificate.

issuer✘A string that is included into the Distinguished Name (DN) of the issuer's certificate.
keystore✘

An array of valid keystores. Ex: "CSK", "MACOS"].

expirationWindow✘

A certificate can be filtered by its expiration date.

This field must define 2 integer values: "<past-days>,<previous-days>", and these values allows to create a range around the expiration date of the certificate.

A wildcard (*) can be used to disable one of the values. Some examples:

0 , * : all valid certificates.

* , 0 : all expired certificates.

0 , 60 : valid certificates with less than 60 days of validity.

-30 , 90 : certificates close to expire (less than 90 days), or expired (less than 30 expired days).

60 , * : certificates with more than 60 days of validity.


.

.


Example

Select a certificate


Code Block
languagejs
themeEclipse
titleSelect a Certificate
<script src="./alisonGUI.umd.js"></script>

AlisonGUI.mount({
	gui: {
		logoUrl: company.logo,
		language: "en"
	},
	providers: {
		desktop: {
			url: 
			accessToken: "ewogICJ2MiI..."
		},
		tad: {
			requestUrl: 'https://localhost:3000/requestSignature',
			responseUrl: 'https://localhost:3000/responseSignature'
		}
	},
	filters: [
		{
            expirationWindow: '0,*',
            issuer: 'CN=Bank*'
		}
	],
	onConfirm: (result) => {
		console.log("onConfirm"); 
		console.log(result);
	},
	onCancel: (result) => {
		console.log("onCancel"); 
		console.log(result);
	}
});