Not able to load a custom app in IE : Failed to load app - could not locate the jsclass

nitish.kumar
User offline. Last seen 2 years 1 week ago. Offline
Joined: 02/22/2011
Points: 30

Hi

We have created  a custom application which loads an html component and uses it in the presto application.

We have added the js code for loading the same, it works fine in Mozilla and Chrome but fails to load in the IE, it gives an error "Failed to load app - could not locate the jsclass"

Please suggest if we need to add any pluggin, or can we handle it in our code to make this app work in all the browsers

Below is the attached sample form the JS class

 

NotificationAlert = function(app) {
    this.app = app;
    instance = this;
    var intvl = setInterval(function() {
      if (document["AlertsView"] && document["AlertsView"].renderAlertsInTable) {
        clearInterval(intvl);
        instance.receive();
      }
    }, 100);
  };
 
  NotificationAlert.prototype = {
    // *receive method* , this method is called when a publisher sends data to this suscriber
    // configured manually in mashboard
    receive: function() {
      //console.log("receive",data)
        var conn = this.app.getConnection(), app = this.app;
      jQuery(app.rootElement).find(".waiting").show();
      conn.request({
        sid: 'Event_Notification_Mashup',
        oid: 'runMashup',
        header: {
          resultFormat: 'xml'
        },
      },
                   {
                     onSuccess: function(response) {
                       jQuery(app.rootElement).find(".waiting").hide();
                       var intvl = setInterval(function() {
                         if (document["AlertsView"] && document["AlertsView"].renderAlertsInTable) {
                           clearInterval(intvl);
                           document["AlertsView"].renderAlertsInTable(response.response);
                         }
                       }, 100);
                     },
                     
                     onFailure: function(err) {
                       console.log("Service Error:", err);
                     },
                     scope: this
                   });
    }

0
Your rating: None
Mike Bennett
User offline. Last seen 5 weeks 6 days ago. Offline
Joined: 12/09/2009
Points: 54

 Could you post your app.xml?

nitish.kumar
User offline. Last seen 2 years 1 week ago. Offline
Joined: 02/22/2011
Points: 30

Please find below the App.xml contents :

 <?xml version="1.0" encoding="UTF-8"?>
<app draggable="false" height="200" id="AlertApp" jsclass="NotificationAlert"
minimizable="false"
name="AlertApp"
width="100%">
  <requires>
    <require src="js/app.js" type="script"/>
    <require src="css/app.css" type="css"/>
    <require src="html/app.html" type="html"/>
    <require type='other' src='ECUITFlexResources.swf' />
    <require type='other' src='ECUITFlex_styles.swf' />
    <require type='other' src='ECUITFlex_ecue_styles.swf' />
    <require type='other' src='AlertsView.swf' />
    <require type='other' src='playerProductInstall.swf' />
  </requires>
   <dependson>    
        <resource name="Event_Notification_Mashup" operation="runMashup" type="service"/>
        <resource name="EventNotificationFilterMashUp" operation="runMashup" type="service"/>     
   </dependson>   
</app>

 

Also here is the HTML object content for the app (app.html)

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
      id="AlertsView" width="878" height="563" wmode="opaque"
      codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
      <param name="movie" value="AlertsView.swf" />
      <param name="quality" value="high" />
      <param name="wmode" value="opaque" />   
      <param name="bgcolor" value="#869ca7" />
      <param name="allowScriptAccess" value="sameDomain" />
      <embed src="AlertsView.swf" quality="high" bgcolor="#869ca7"
        width="878" height="563" name="AlertsView" align="middle"
        play="true"
        loop="false"
        quality="high"
        allowScriptAccess="sameDomain"
        type="application/x-shockwave-flash"
        pluginspage="http://www.adobe.com/go/getflashplayer"
        style="z-index: 1;">
      </embed>
</object>

nitish.kumar
User offline. Last seen 2 years 1 week ago. Offline
Joined: 02/22/2011
Points: 30

..Awaiting some solution

Thanks

Nitish

Mike Bennett
User offline. Last seen 5 weeks 6 days ago. Offline
Joined: 12/09/2009
Points: 54

 First thing that I can see is that you don't need the <require> elements for each of your SWF files.  Your SWF files should be loaded simply by referencing them by relative URL in your html file.  If that does not work then uploaded a Zip of your app here.

 

nitish.kumar
User offline. Last seen 2 years 1 week ago. Offline
Joined: 02/22/2011
Points: 30

Hi Mike

I have an application file as suggested. I modified the js content to load the html content dynamically, and also refering the swf by the relative path for the presto artifacts lying within the file system.

The application fails to lod in Internet Explorer, (have verified it on IE version 6,7 and 8), but it works fine in mozilla and chrome.

In IE i end up getting the error message in the browser

"Failed to load app - could not locate the jsclass - NotificationAuditLog.JS"

Please find attached the app.zip file

Thanks in advance

Mike Bennett
User offline. Last seen 5 weeks 6 days ago. Offline
Joined: 12/09/2009
Points: 54

I think you need to simply add a "loadconfirmation" on your <require> element for js/app.js:

Currently in your App.xml, you have:

<require src="js/app.js" type="script"/>

Change this to:
<require src="js/app.js" type="script" loadconfirmation="NotificationAuditLog.JS"/>

 
Internet Explorer in particular runs into problems with asynchronous loading of javascript files (while Chrome, Firefox and Safari do not).  For that reason, presto includes a "loadconfirmation" which contains either an object reference or an expression which we check to make sure that the file is loaded.  In your case, your js/app.js file declares an object called "NotificationAuditLog.JS".  By adding the 'loadconfirmation', Presto will load the file and wait until the "NotificationAuditLog.JS" object exists.  Once it does, it will proceed with executing the app.
 
You used to get the "could not locate the jsclass" error before because your App was executing before all of the javascript files it needs were fully loaded.
 
nitish.kumar
User offline. Last seen 2 years 1 week ago. Offline
Joined: 02/22/2011
Points: 30

Hi

I modified the file as per your suggestion, but still I guess it fails after proceeding partially. Now I get to see a "Loading" banner on top of the browser, followed by the same error message Failed to load app - could not locate the jsclass - NotificationAuditLog.JS.

Earlier it did not show the "Loading" banner on the top, but with the change as suggested, I could only see only this being appended on the top of the eror message, the application still fails to launch.

Attached the image for your reference.

 

Mike Bennett
User offline. Last seen 5 weeks 6 days ago. Offline
Joined: 12/09/2009
Points: 54

This is occurring because of an error in your js/app.js file that only breaks in Internet Explorer.  For some reason, IE will break (but FF, Chrome and Safari won't) if your javascript contains unnecessary commas.  See:

http://www.enterprisedojo.com/2010/12/19/beware-the-trailing-comma-of-death/

for a full explanation.

After I fixed your app.js file the app loaded fine on my system (although it didn't do anything because I don't have the backend NotificationAuditLogMashup that your app calls).

You needed to remove the trailing comma of death on line 65.  You should also consider running your code through jslint.

 

 

nitish.kumar
User offline. Last seen 2 years 1 week ago. Offline
Joined: 02/22/2011
Points: 30

Thanks a lot Mike

Finally managed to get my app working in the IE. It was really a "trailing comma of death"

Sincere thanks once again.

-Nitish