Migrating Custom Search Definition and Configuration

In the following DIY blog series, I described how we can use the framework provided in PeopleTools 8.58 to configure our own custom visualizations and dashboards in Kibana and use them in PeopleSoft applications via the 'Kibana Visualizer'.

Refer: DIY - Kibana Dashboards with Application Data

Someone ask a very valid question:
How do we migrate these configurations from one environment (source) to another (target)?

This post will detail the steps for migrating the Search Definition and associated configuration.

Migration

We can migrate everything related to the Search Definition using an App Designer project. Simply insert the Search Definition and make sure the the 'Related Definitions' are selected as shown below.

Save the 'Project' and migrate to target environment.

Note: If we used any Application Package PeopleCode to configure the Search Definition (Security Configuration) - Document Filter App Class, then we must also include the App Package in the project.

Post Migration Steps

Once we migrate the configuration, we must complete the following administrative steps in the target environment.

1. Deploy Search Definition
2. Schedule Search Index
3. Configure Search Context (optional)
4. Configure Search Group Security

Related Posts

Migrating Custom Kibana Visualizations/Dashboards

PeopleTools 8.57 | Testing the New App Designer Utility Features

PeopleTools 8.57.01 is now generally available! Once I got an environment up and running on PT 8.57, I tested the latest enhancements to App Designer. Since this early .01 release is currently only available on Oracle Cloud, I thought I would share couple of my favorite features!

Database Name on the Header

It is about time! Certainly a very valuable feature to constantly remind us of the current database as we work. If we have multiple App Designer sessions open, it is quite easy to accidentally make changes in the wrong database!

In the example shown below, PSPDB is the database name of my HCM 9.2 PUM Image (upgraded to 8.57.01).

Property Window for Page Design

This is a fantastic feature which makes page design in PeopleTools - App Designer far more intuitive. It is very similar to some of the popular IDEs such as Eclipse. This feature will drastically reduce the number of mouse clicks required to view/set/update page field properties!

PSPRSMNAVINFO - Portal Menu Navigation in SQL

Last week, I worked on a requirement where I needed to find all the components that are part of a role (or a list of roles) including the Portal Menu Navigation Path if it exists. It is easy to get the list of components that are part of a role but it is not really straight forward to qualify that information with the actual Portal Menu Navigation (if it exists).

 In the past, I used the following query to return the Portal Menu Navigation Path for a Component. The query mines through the Portal Structure and Content and presents the navigation hierarchy in the result.

As we can see, it will not be easy to re-purpose this hierarchical query and expand it for my requirement.

While poking around on this topic, I stumbled on this gem of a table PSPRSMNAVINFO that, I believe, was introduced thanks to the PeopleSoft Search Framework!

Here is what we can see in the Definition Properties of this record:
"Holds the Navigation Path to the given target crefs registered in Portal Registry. Holds only effective and non-expired target crefs.
Used by the Portal Menu SES Search.
Updated every schedule of search index file"

From my understanding, it appears that this table is used as part of the PeopleSoft Search Framework - PTPORTALREGISTRY Search Definition. Also, the App Engine library PORTALPATHAE is responsible for populating this table with the navigation path information when the search index is built.

PeopleTools > Search Framework > Designer > Search Definition (PTPORTALREGISTRY)

PeopleTools > Search Framework > Administration > Schedule Search Index

To identify the last time the PTPORTALREGISTRY search definition index was built, we can query the table PSPRSMPATHSTAT.

If for any reason we don't have the Search Framework enabled and we still want to take advantage of the data in this table, then we can simply populate this table by directly running the PORTALPATHAE App Engine Library from App Designer. Since I was testing this on a Virtual Box installation of a PUM image (CS 9.2 - Image 4), I did not have Search enabled/configured. I ran the AE from App Designer as follows:

Now, let us see how we can use PSPRSMNAVINFO to get the Portal Menu Navigation information.

The best part about this table is that it allows us to directly retrieve the navigation path for a component without having to deal with the hierarchical structure in PSPRSMDEFN. This makes it easier to use/expand this information in other queries.

Here is how I extended this information to create a query that retrieves all components in a role along with the Portal Menu Navigation Path information (if it exists).


Github link to SQL Queries in this post:
https://github.com/SasankVemana/PS-Portal-Menu-Navigation-Queries

DIY - PeopleSoft on the Cloud - Part 3

In this third and final part, I will demonstrate how to access the demo instance (PUM image on OPC) via SQL Developer and App Designer from an on premise workstation.

Step 1: Create Security List for database access and add to the instance

Create Security IP List:

Oracle Compute Cloud Service console > Network tab > Security IP Lists > Create Security IP List

Enter the public ip address(es) of your on premise workstation(s). This will ensure that only a trusted list of on premise ip addresses can access the database (via SQL Developer/App Designer) of your demo instance (PUM image running on OPC).

Note: If you are not sure of the public ip address of your on premise workstation then simply visit https://whatismyipaddress.com/ using a browser on the workstation.

Create Security Application:

Oracle Compute Cloud Service console > Network tab > Security Applications > Create Security Application

Create a Security Application to open TCP port 1522 to allow database access. You might wonder how I figured the database for the demo instance is using port 1522? We can find it in the tnsnames.ora file located in /opt/oracle/psft/pt/tools_client/ which we can access via WinSCP (refer: Part 2).

Create Security List:

Oracle Compute Cloud Service console > Network tab > Security Lists > Create Security List

Create Security Rule:

Oracle Compute Cloud Service console > Network tab > Security Rules > Create Security Rule

Using the Security IP List, Security Application and Security List that we just created, create a Security Rule as follows:

Add Security List to Instance:

Oracle Compute Cloud Service console > Instances tab > View > Under "Security Lists" > Add to Security List

In my example, the security list that I added is called 'psftuser_sec_list_1522'.

Step 2: Installing Oracle and PeopleTools Clients (SQL Developer and App Designer)

Hypothetically, if we had installed the PUM image locally and if we did not already have the Oracle and PeopleTools clients installed on the local workstation, then we would have mapped the samba drive and installed the clients from there.

I was not able to figure out how to map the samba drive of the demo instance (PUM image) running on OPC to an on premise workstation. The alternative/workaround is to connect to the instance on OPC using WinSCP from the on premise workstation (as described in Part 2), download the relevant folders locally and install the necessary clients.

We can find the content of the samba drive under the following location using WinSCP:
 /opt/oracle/psft/pt/tools_client

Step 3: Updating the tnsnames.ora file in the on premise work station

Find the database name of the instance:

Login to the instance online and navigate to the following page:
Navigator > PeopleTools > Lifecycle Tools > Update Manager > Update Manager Dashboard > Update Manager Utilities > About PeopleSoft Image

Add database to the tnsnames.ora file on the on premise workstation:

For a typical Oracle client installation, the tnsnames.ora file can be found in the following directory:
C:\oracle\product\12.1.0\client_1\network\admin

TNS Details:

HOST: Enter the public ip address of your instance
PORT: 1522
SERVICE_NAME: Enter the database name of your instance which we determine in the preceding steps

<ENTER_DBNAME> =
   (DESCRIPTION =
       (ADDRESS_LIST =
           (ADDRESS = (PROTOCOL = TCP)(HOST = <ENTER_PUBLIC_IP>)(PORT = 1522))
       )
       (CONNECT_DATA =
           (SERVER = DEDICATED)
           (SERVICE_NAME = <ENTER_DBNAME>)
       )
    )

For Example:

Step 4: Access OPC instance via SQL Developer from on premise workstation

Default Username/Password: SYSADM/SYSADM

Connection Properties:

Successful Connection:

Step 5: Access OPC instance via App Designer from an on premise workstation

Note: The default connect id and password is the same as people/peop1e

If you have not configured the default connect id/password then you can do so using Configuration Manager.

The PeopleTools client installation should be in your C drive.
For example: C:\PT8.55.11_Client_ORA\

We can find Configuration Manager (pscfg.exe) and App Designer (pside.exe) in the following location:
C:\PT8.55.11_Client_ORA\bin\client\winx86\

Connect via App Designer:

Use the database name of your OPC instance which we determined in the preceding steps.

Successful Connection:

Fluid - WYSIHTML5 Editor Prototype!

I recently answered a question on the OTN forums related to rich text editor in PeopleSoft. Since PeopleTools 8.50, PeopleSoft has leveraged using CKEditor for rich text editor (aka RTE) configurations options in App Designer. As a follow up to the OTN, I wrote a small post on how to create and use custom RTE configurations, toolbars and plugins.

CKEditor in PeopleTools provides a way to create and work with a WYSIWYG (What You See Is What You Get) rich text editor.

This has found its way to several use cases ranging from but not limited to:
-    Rich text configuration fields which are then used for rich text display in HTMLAREAs
-    Content source for rich text enabled emails
-    Content source for rich text enabled BI Publisher reports
-    Content source for Enterprise Components Forms Builder – Instructions
-    Content source for rich text enabled Student Activity Guide (Configurable) Pages such as Agreement Pages, Start and Complete Pages

While this is a great utility, it is a WYSIWYG editor which means that it might only be appropriate for Classic pages and might not be suitable for Fluid. I was curious to see how a rich text enabled field appears on a Fluid page and based on my tests it appears that Fluid does not support rich text enabled fields.

RTE Field on a Fluid Page:

Results: RTE toolbar does not appear in Fluid.

We can also confirm that rich text is not supported for Fluid in PeopleBooks.

Home > PeopleSoft > PeopleTools 8.54 > Fluid User Interface Developer’s Guide > Considerations for PeopleSoft Fluid Application Implementation

We can imagine how RTE powered by CKEditor (WYSIWYG) would introduce several challenges when it comes to incorporating the editor in Fluid. But why not WYSIHTML5 - What You See Is HTML5? :)

So that is how I got started on this little pet project!

I wanted to take the same concept and create a rich text editor that is also responsive (WYSIHTML5). I used an open source project (http://wysihtml.com/) to develop a prototype for a WYSIHTML5 Editor in PeopleSoft (Fluid) that enables Responsive Rich Text.

It is still a prototype so it has a few quirks to be worked around and it is also not a fully functional RTE yet. But I think it is a great start!

Step 1: Load Open Source Project to the Web Server

Based on instructions in the http://wysihtml.com/ I downloaded the open source project (zip file), extracted/unzipped the contents and placed it on the web server.

Path:

<PIA_HOME>/webserv/<DOMAIN>/applications/peoplesoft/PORTAL.war/<site_name>

Contents:

This completes the first step to make the necessary javascripts and stylesheets (amongst other things) available on the web server.

Now moving on to incorporating this in PeopleTools.

Step 2: Create Fluid Page with WYSIHTML5 Editor (Configuration)

Legend:

1. Static HTMLAREA (1) is used to store a javascript function and a button which when invoked transfers the WYSIHTML5 contents in HTMLAREA (4) to an invisible - modifiable by javascript - long edit field (2).

The "csk_div" ID used in var x = document.getElementByID("csk_div"); is referencing an input field (WYSIHTML5 editor) in HTMLAREA (4).

2. Invisible (Modifiable by Javascript) field to temporarily store/move (PreSave) the WYSIHTML5 contents from HTMLAREA (4) to the component buffer. This helps with sending the HTML5 contents to the server during the save (3). This is kind of a hack/temporary workaround and there should be a cleaner way to get this to work. It is a "to-do" item to make this more efficient.

 
3. Save button to push data (component buffer) in the page to the server.

4. HTMLAREA that holds the WYSIHTML5 contents with an input/editable field (and other associated wysihtml toolbar items, styling and scripts). HTMLAREA is populated using PageActivate PeopleCode using a HTML object (CSK_WYSIHTML5).

CSK_WYSIHTML5 HTML object was built primarily based on the HTML in this example page:
http://voog.github.io/wysihtml/examples/advanced.html

Few things to note about CSK_WYSIHTML5 HTML:

- An ID attribute ("csk_div") was added to a DIV that represents the input/editable element for the HTML5 editor. This is needed because it is used in the javascript function that is part of the Static HTMLAREA (1).
- The contents in the HTML5 editor field (csk_div) are passed in using a bind variable (via Page PeopleCode).
- The script sources were appropriately adjusted to refer to the directory on the web server (where the wysihtml project is located).

Step 3: Create Fluid Page for WYSIHTML5 Display (Viewer)

This is a very simple Fluid page with a single HTMLAREA that is loaded on PageActivate as shown above. During the load,  the HTML5 contents that was created and stored using the previous page (CSK_WYSIHTML5_CFG) is retrieved and used as a parameter to HTML object (CSK_WYSIHTML5_DISP). The HTML retrieved from CSK_WYSIHTML5_DISP is them assigned to the HTMLAREA field.

CSK_WYSIHTML5_DISP was also primarily built using the following page:
http://voog.github.io/wysihtml/examples/advanced.html

Only differences are:
- Toolbar was removed (as it is a display only page).
- Made the editor display only (non-editable).
- Added a bind value to place the HTML5 contents using PageActivate code.

Let us see this in action!! 

I created a custom Fluid Hompage (Sasank's WYSIHTML5) and added the two Fluid Pages as tiles.

Fluid Page with WYSIHTML5 Editor Prototype:

- Enter "Rich Text"/Responsive contents in the editor.
- Click on "PreSave (Load to Buffer)" button.
- Click on "Final Save" button.

Legend:
1. Push buttons to save responsive rich text data.
2. Responsive rich text toolbar.
3. Responsive rich text editor.

Quirks:
- Right now, the page just refreshes if we press ENTER/carriage return on the editor. ENTER/carriage return only works when the cursor is on text that does not contain any styling. This is also a "to-do" task.
- We must click the "PreSave (Load to Buffer)" button first before clicking the "Final Save" button, otherwise the changes made in the editor will not get transferred to the server as part of the component buffer.

Fluid Page with WYSIHTML5 Display Prototype:

We can see how the rich text displayed on this page in a HTMLAREA is responsive!

Demo Videos!!

WYSIHTML5 Responsive Rich Text Editor (click here to view video in a new tab):

WYSIHTML5 Responsive Rich Text Display (click here to view video in a new tab):

I just wanted to share this project with the PeopleSoft community! A lot of javascript hacking and app designer cheats (workarounds if you will) were required to get this prototype to function. I would love to work with anyone who would like to collaborate on improving this project and see where the results take us! Perhaps a truly integrated Responsive Rich Text Editor… Perhaps a futuristic Web Based Responsive Page Development Utility… Perhaps a case for productization and potential incorporation into the PeopleSoft solution!?!?!?

Project Details:

Disclaimer: I am sharing the project primarily to seek collaborators and others who might be interested in playing with or extending this prototype. If you choose to perform any of below steps then it is at your own risk! :)

Project Environment: HCM 9.2 PUM Image 9 - PeopleTools 8.54.08

1. Download the project by clicking here.
2. Unzip/extract the project and copy it to a testing/play environment (using 'Copy From File' option in App Designer).
3. Build project.
4. Explore! Test! Explore! Test!

Notes:

1. This project which contains the WYSIHTML5 editor prototype for PeopleSoft should be considered a proof of concept only. Please do not load this into your production environment. This was purely intended for experimentation and evaluation purposes.
2. I, the author, will not assume any liability for any problems resulting from the implementation of this project.
3. All objects in the project are custom and start with the prefix "CSK_".
4. A role (CSK_WYSIHTML5_TEST) in the project should give access to both the pages above.

Please feel free to comment on this post if you have any questions/concerns/suggestions.

Invoke PeopleCode Event from Javascript (in a HTMLAREA)

Let us walk through an example on how to invoke a peoplecode event from a javascript in a HTMLAREA.

Here is a test page which contains a push button that display a winmessage on FieldChange.

Let us see what happens behind the scenes when we click on the push button by inspecting the HTML.

We can see that the onclick event on the push button invokes the javascript function (delivered) submitAction_win0(document.win0, this.id, event). In this case, this.id would be equal to CSK_TEST_WRK_TEST. The general format for the id field would be <RECORD_NAME>_<FIELD_NAME>. This would translate to <RECORD_NAME> = CSK_TEST_WRK and <FIELD_NAME> = TEST.

Now let us include a HTMLAREA on the page.

Include the following HTML and javascript in the HTMLAREA properties. Note: I am using a constant HTML value for the purposes of this example.

HTML Code:

<script>
function myFunction() {
   submitAction_win0(document.win0,"CSK_TEST_WRK_TEST", event);
}
</script>

<a href="#" onclick="myFunction()">Push Button in HTMLAREA</a>

Updated HTML Code - 20151105 - Thanks to @Santiago.gmerino's comment below:

<script>
function myFunction() {
   // submitAction_win0(document.win0,"CSK_TEST_WRK_TEST", event);
   // Use %formname to resolve _win# dynamically.
   submitAction_%formname(document.%formname,"CSK_TEST_WRK_TEST",event);
}
</script>

<a href="#" onclick="myFunction()">Push Button in HTMLAREA</a>

Now let us test the javascript in the HTMLAREA.

We can see the hyperlink that we added in the HTMLAREA appear on the page. Let us click the hyperlink 'Push Button in HTMLAREA'. This should trigger the FieldChange event on the push button CSK_TEST_WRK.TEST.

Note: At the time of writing this post, I am using HCM 9.2 PUM Image 12 - PeopleTools 8.54.08.