Sunday, June 12, 2016

PeopleTools 8.55+ - Using Oracle JET (JQuery, JQueryUI, requireJS and more) - Part 4

This post is a continuation of my 'PeopleTools 8.55+ - Using Oracle JET' series (refer: Part 1, Part 2 and Part 3).

In Part 1 (refer: Global JavaScript Injection Bootstrap for Fluid UI - Step 3), I pointed out that using 'Branding System Options' for injecting javascript in Classic pages would result in them getting invoked more than once (per header, pagelet, target frame, etc.). For most Branding Tasks, this might not be necessary since we are only dealing with the header portion of the HTML and other general styling.

All the topics described so far in this series worked fine with the 'Global JavaScript Injection Bootstrap' getting invoked just once as detailed in Step 2 and Step 3. But there may be some advanced requirements possibly outside the scope of Branding where we may intend to inject the Global JavaScript once per header, pagelet, target frame, etc. in order to manipulate the target content area, form data/component buffer and so on. For such cases (to be detailed in a subsequent post), we could use the following alternative step to include our 'Global JavaScript Injection' Bootstrap JS.

Note: The following step would replace Step 2 and Step 3 (which means we need to revert both those changes).

Add CSK_FL_BOOTSTRAP_JS to Classic and Fluid using PT_UTIL JS object:

PT_UTIL is a delivered javascript object that is included in Fluid (via PT_COMMON_FMODE) and Classic (via PT_COMMON). My thought was to simply include our custom bootstrap javascript object in PT_UTIL (using the %include meta-html).


Additionally, I updated the javascript CSK_FL_DBNAME_JS as follows:

Object Name: CSK_FL_DBNAME_JS


The only change was the window.self == window.top condition to avoid the following 'custom header repetition' problem.


The rest of the javascript objects detailed so far in this series should work as-is without any issues.

8 comments:

  1. Hi Sasank, you posts on creating an environment specific header for non-prod DBs have been super useful. Thank you!

    I have an issue regarding the header, I have noticed that for Classic pages, if I'm going from one classic page to another in the same folder e.g. I'm in the PeopleTools>Portal>Branding folder, and I'm in Branding System Options page, the non-prod environment header is showing correctly, but if I go to another page in the same folder, say Branding Objects, the non-prod environment header disappears. Only when I click on another folder or the NavBar, the header comes back again.

    Do you have any suggestions to fix this? Thanks.
    Mary

    ReplyDelete
    Replies
    1. Hi Mary - I have not seen that issue with the header.

      Are you seeing any errors on the browser console? Also, what tools version are you on?

      You may want to add some debug statements to your javascript using console.log to see if the javascript is getting executed. If it is not then you can further investigate why.

      Delete
  2. Sasanak

    This looks great... I am going to start playing with this in the next couple of Days.. Question since you are loading JS thru Branding how do you migrate to other environments

    ReplyDelete
  3. Replies
    1. Hi William - You can migrate the JS objects (which are stored as HTML objects in App Designer) using App Designer.

      There is a challenge with migrating Branding Objects via App Designer which I have written about in this post:
      https://pe0ples0ft.blogspot.com/2015/04/peopletools-854-branding-objects.html

      Delete
  4. I tried loading to PT_UTIL... And nothing. If I look at the rendered source I do not see the Loaded java script any where...

    I tried console.log and I do not see any messages nothing....

    ReplyDelete
  5. Actually I have looked at to console log... PT_Util seems to run the Bootstrap.. It seems to load. Bu
    t I do not see any thing working

    ReplyDelete
  6. Okay after some playing I Got a piece working (the Opening up of Navigation with one click ) But the simple DBNameing is not working

    ReplyDelete