How You Load the Media Toolbar API

Find toolbar API modules under the svcMca.tlb.api namespace to enable quick and clear identification, and to avoid conflicts with similar JavaScript functions. To load the API JavaScript file, concatenate the following two parameters to the iFrame source toolbar URL:

  • oraParentFrame: Represents the origin of the Oracle instance, including the protocol and the port. For example, https://mypodinstance.oraclecloud.com:12345.

  • oraApiSource: Represents the path from where the toolbar API JavaScript file can be loaded, including the leading slash. For example, /service/js/mcaInteractionV1.js.

  • oraTbStyle: Indicates whether the toolbar is displayed on a Live Window. oraTbStyle=LiveWindow indicates the Toolbar is Displayed in the Live Window, otherwise the value is set to Embedded to indicate the display is on the Applications page.

Here's an example to load the MCA Javascript dynamically:

<script type="text/javascript"
id="dynamicLoadScript">
	 (function() {
    window.dynamicLoadCompleted = false;
    window.staticLoadCompleted = false;
    console.log("##DLS: Running DynamicLoadScript to load the Oracle API
JS...");
    function getParameterByName(name) {
      var match = RegExp('[?&]' + name +
'=([^&]*)').exec(window.location.search);
      return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
    }
    var oraApiPath = '';
    var oraOrigin = getParameterByName('oraParentFrame');
    var oraApiSource = getParameterByName('oraApiSource');
    console.log('##DLS: PageParameters - oraParentFrame: '+oraOrigin+'
oraApiSource: '+oraApiSource);
    try {                
      if (oraApiSource && oraApiSource.startsWith("http")) {
        oraApiPath = oraApiSource; //handle case where apiSource is loaded
from external CDN
      } else {
        oraApiPath = oraOrigin+oraApiSource;
      }
      console.log('##DLS: Oracle API JS URL: '+oraApiPath);    
    } catch (e) {
      console.log('##DLS: Error '+e);
      console.error(e);
    }
    function onDynamicLoadComplete() {
      /* TODO INSERT ANY INIT PROCESSING HERE */

    }
    if (typeof define === 'function' && define.amd) {
      try {
        require([oraApiPath], function (mcaTlb) {
          window['svcMca'] = {};
          window.svcMca['tlb'] = mcaTlb;
          window.dynamicLoadCompleted = true;
          console.log('##DLS: Successfully loaded Oracle API JS');
          onDynamicLoadComplete();
        });
      } catch (e) {
        console.log('##DLS: Error loading ORACLE API JS from URL:
'+oraApiPath);
        console.error(e);
      }
    } else {
      var currentNode = document.getElementById('dynamicLoadScript');
      var node = document.createElement('script');
      node.type = 'text/javascript';
      node.charset = 'utf-8';
      node.async = true;
      node.src = oraApiPath;
      node.addEventListener('load', function(evt) {
          window.dynamicLoadCompleted = true;
          console.log('##DLS: Successfully loaded Oracle API JS');
          onDynamicLoadComplete();
      }, false);
      node.addEventListener('error', function(evt) {
          console.log('##DLS: Error loading ORACLE API JS from URL:
'+node.src);
      }, false);
      currentNode.parentNode.insertBefore(node, currentNode.nextSibling);
    }
  })();
</script>