The PST Migration Guide

This manual describes the integration of the PST plugin into an existing website and the conversion of existing older PST integrations to the new PST plugin.

1. Improvements over the older versions of the PST

2. Browser compatibility

The new PST and the PST plugin continue to support all browsers that were supported by the old version.

                                                 minimum required Version
                Microsoft Internet Explorer          9
                Microsoft Internet Explorer Mobile  10
                Microsoft Edge                      All Versions
                Mozilla Firefox                      3.5
                Mozilla Firefox for Android         37
                Google Chrome                        4
                Google Chrome for Android           42
                Android Browser                      4.4
                Apple Safari                         3.2
                Apple Safari for iOS                 3.2
                Opera                               11.5
                Opera Mobile                        12
                Opera Mini                           8
                Blackbery Browser                    7
                UC Browser for Android               9.9                
            

3. Install and configure the PST proxy

3.1 Requirements

3.2 Installation of the PST-Proxy

3.3 Configuration of the Apache web server

To make the PST proxy available under an URL on your web server, you have to add a "ProxyPass" entry in your Apache configuration:

4. Integration of the PST plugin into an existing website

4.1 Requirements

4.2 Prepare a website

Integrate the PST plugin into your start website (index.html). It is then available to you globally in your project. Example:

                <script src="/proxy/js/plugin.min.js"><script>
            

The PST is displayed in an area defined on the website. This area should be defined by an HTML tag. Example:

                <div id="pst-viewport"></div>
            

Use CSS to design the area as it should appear on the website. Example:

                .my-viewport: {
                    margin: 0 auto;
                    max-width: 1024px;
                }
            

Add the CSS class to your output area. Example:

                <div id="pst-viewport" class="my-viewport"></div>
            

Initialize the PST plugin in a script tag on the website in which you have defined the output area. Example:

                <script>
                    PST.init({
                        id:       <String>,   optional An individual id or "undefined" if no id should by passed.,
                        viewport: <String>,   required The id of the output area, here: "pst-viewport",
                        locale:   <String>,   optional An ISO-639-2 Alpha2 language code (supported languages see below).,
                        baseUrl:  <String>,   optional The base URL of the PST-Proxy.
                        success:  <function>, required A function that is called when the PST is successfully executed.,
                        error:    <function>, optional A function that is called in the case of an error during or after execution of the PST.
                        onblock:  <function>, optional A function that is called when the next button in a block element has been clicked.
                    });
                </script
            

4.2.1 Supported languages

The following country codes can be transferred to the "locale" field in the Init object. If an unsupported country code is passed, the PST appears in English.

                ca Catalan
                cs Czech
                de German
                el Greek
                en English
                es Spanish
                fr French 
                hr Croatian
                it Italian
                ja Japanese
                nl Dutch
                pl Polish
                pt Portuguese
                ru Russian
                tr Turkish
                zh Chinese
            

If no value is transferred to this field, an attempt is made to read the test participant's language from their browser settings.

If you have implemented these steps in your website, the PST, if configured correctly, will be executed in the area you have defined.

4.3 Description of the callback functions "success", "error" and "onblock"

4.3.1 Function "success"

                success: function(status, result) {
                    // The status 200 shoud be returned always 
                    if(status === 200) {
                        // The result object contains the following fields:
                        result.id;      // The result id. If the parameter ID was set in the PST.init () function, this is returned here.
                        result.type;    // The PST fulltype, e.g. ENTP, ISTJ, etc.
                        result.e;       // The value for the dimension "extraversion"
                        result.s;       // The value for the dimension "sensing"
                        result.n;       // The value for the dimension "intuition"
                        result.t;       // The value for the dimension "thinking"
                        result.f;       // The value for the dimension "feeling"
                        result.j;       // The value for the dimension "judging"
                    } else {
                        // Handle exception
                    }
                }
            

4.3.2 Function "error"

                error: function(error) {
                    // The error object contains the following fields:
                    error.code;     //An error code (see below).
                    error.message;  //An error message (see below)
                }
                
            

4.3.3 Funtion "onblock"

                onblock: function(index) {
                    // The parameter "index" is the number of the block that calls this function. The index starts with 0.
                }
            

4.3.4 Error codes and messages

                Code    Message
                398     The test ID already exist!
                399     The "failback" message from the PST-Proxy
                400     You must pass an unique test id!
                401     A HTTP Error message. The HTTP Status code is passed through the "success" function
                402     No connection to the server can be established at the moment. Please try again later.
            

5. Migration of an existing PST plugin

The new version of the PST plugin is no longer 100% compatible with the older versions. Migration is therefore necessary.

Overview of the changes

The global variable of the PST plugin is now no longer called PSY but PST. All functions referencing PSY must be replaced with the PST variable.

The PST.init () function still requires a configuration object.

The following changes must be made to this configuration object:

The function that is specified under the "success" field has been given an additional transfer parameter "status". The function must be defined as follows:

                success: function(status, result) {}
            

The result object of the "success" function now returns the "id" field instead of the "testid" field