Thursday, July 10, 2014

Make an APEX page look like an Oracle EBS R12 page


I made the folowing changes to let the APEX page more resemble an E-Business Suite R12 page:
  • First of all, I created several Application Items (Shared Components > Logic) including EBS_APPLICATION_NAME and EBS_URL. These will be set in a routine check_ebs_credentials that will run when a page is launched (part of the Authorization Scheme I explained earlier).
  • For the User Interface select APEX Theme 20 (Traditional Blue), a standard theme that comes along with APEX (one of the Legacy Themes)
  • Logo (Shared Components > User Interface > User Interface Attributes)
    The Oracle Logo displayed in Oracle EBS R12 can also be displayed in the APEX application:
    • First copy the file FNDSSCORP.gif  $OA_MEDIA (EBS) to the directory 'images' in APEX
    • Logo Type: Image 
    • Logo: /i/FNDSSCORP.gif 
    • Logo attributes: alt="Oracle Logo" title="Oracle Logo" width="155" heigth="20" border="0" 
  • Navigation Bar Entries (Shared Components > Navigation)
    In the E-Business Suite R12, self-service pages (HTML pages) like the APEX pages can be called from a menu in forms (java program) or a menu in the browser (HTML page). In the first case the HTML page is opened in a new browser window and when done the user has to close that window. In the latter case the HTML page appears in the same browser window and when done the user can navigate back to the menu. This is a bit of a problem for navigation. In the normal E-Busisness Suite self-service pages (using OAF) this is managed correctly: in the navigation bar you will see ‘Close window’ or ‘Home’. Because it seems not possible to determine how the APEX page is launched, only the ‘Home’ entry has been provided. For closing a window all browsers have built-in possibilities.
    • Remove Logout
    • Add Home. For 'URL Target' enter &EBS_URL. (don't forget the dot)
      EBS_URL holds the value icx_session_attribute '_USERORSSWAPORTALURL' but can also be composed of the value of profile option APPS_SERVLET_AGENT concatenated with /OA.jsp?OAFunc=OAHOMEPAGE#
  • Template (Shared Components > Templates > Type: Page, Name: No Tabs).
    In the application I only make use of pages that use the page template named 'No tab'. The application name is added to the page header (however defined in the page body) and the user name has been removed from the footer as well as a copyright tekst was added to the bottom righthand corner. I couldn’t find how to set the built-in application substitution strings, so I made changes to the templates, however setting of the built-in application substitution strings would result in a more generic solution.
    • Definition > Body: 
      • The application name is added stored in the Application Item EBS_APPLICATION_NAME.
      • The style attribute is necessary to display the name with the correct format. Image blank.gif is used to force some space between the logo and the application name. 
      • Also two blank lines are added (one above the logo; one beneath the logo):

        <div id="t20PageHeader">
        <table border="0" cellpadding="0" cellspacing="0" summary="">
        <tr><td colspan=3> </td></tr>
        <tr>
        <td id="t20Logo" valign="top">#LOGO#<br />#REGION_POSITION_06#</td>
        <td id="t20HeaderMiddle" valign="top" width="100%"><img src="/i/blank.gif" width="20" border="0"><span title="EBS Application Name" style="font-family:Arial; color:#FFFFFF; font-size:16px; white-space:nowrap; font-weight:bold; vertical-align:top;">&EBS_APPLICATION_NAME.</span> #REGION_POSITION_07#<br /></td>
        <td id="t20NavBar" valign="top">#NAVIGATION_BAR#<br />#REGION_POSITION_08#</td>
        </tr>
        <tr><td colspan=3> </td></tr>
        </table>
        </div>
        <div id="t20BreadCrumbsLeft">#REGION_POSITION_01#</div>
        <table border="0" cellpadding="0" cellspacing="0" summary="" id="t20PageBody" width="100%" height="70%">
        <td width="100%" valign="top" height="100%" id="t20ContentBody">
        <div id="t20Messages">#GLOBAL_NOTIFICATION##SUCCESS_MESSAGE##NOTIFICATION_MESSAGE#</div>
        <div id="t20ContentMiddle">#BOX_BODY##REGION_POSITION_02##REGION_POSITION_04#</div>
        </td>
        <td valign="top" width="200" id="t20ContentRight">#REGION_POSITION_03#<br /></td>
        </tr>
        </table>
    • Definition > Footer 
      • Added an extra line to look it more like EBS R12. 
      • Also a copyright text is added like in EBS R12. 
      • The username has been deleted from the footer (&APP_USER.):

        <table border="0" cellpadding="0" cellspacing="0" summary="" id="t20PageFooter" width="100%">
        <tr><td colspan=3> </td></tr>
        <tr>
        <td id="t20Left" valign="top"><span id="t20UserPrompt"></span><br /></td>
        <td id="t20Center" valign="top">#REGION_POSITION_05#</td>
        <td id="t20Right" valign="top"><span id="t20Customize">#CUSTOMIZE#Copyright (c) 2014, Marc Weeren. All rights reserved.</span><br /></td>
        </tr>
        </table>
        <br class="t20Break"/>
        #FORM_CLOSE#
        #DEVELOPER_TOOLBAR#
        #GENERATED_CSS#
        #GENERATED_JAVASCRIPT#
        </body>
        </html>


Before:


After:


3 comments: