TypeError: null is not an object (evaluating 'e[D]')


(Kelley) #1

I am receiving this error ‘TypeError: null is not an object (evaluating ‘e[D]’)’ in the HYPE-518.thin.min.js file when I try to return to a scene.

Please see the link to my dropbox with the project example code. The example has two scenes in it. The first scene simply calls the second scene. On the second scene I am manipulating elements with a function in an external javascript file. Everything appears to work well until I leave the second scene and return to the first scene. When I try to return to the second scene a second time, the error occurs.

Any suggestions would be greatly appreciated!


(Mark Hunte) #2

I cannot look at this properly but I had a similar Issue when cloning. I needed to remove the Hype_document. Class (think thats the one) from any class list of a clone


(Kelley) #3

Thanks for the reply, MarkHunte. I am not sure how I would do that exactly…


(Mark Hunte) #4

Are you cloning


(Hans-Gerd Claßen) #5

hi,
hype wrapps all of its elements …
so you’re targeting the wrapperelements for your new innerHTML instead of their childs.
so in fact this leads in messing up hypes elementstructure …

work with classes and id’s within hype or step one element deeper … means adding ‘childNodes[0]’ to every of your targets

sunny day :slight_smile:


(Hans-Gerd Claßen) #6
function callExternalFunctionInJSFile(catID, docName, resourceFolder) {
   "use strict";

   // Set variables...
   var btnCntr    = 0;
   var picPath    = '';
    var ReportUrl  = '';
   var lImgNames  = new Array(12);
   var buttonDiv;
   var imgAmt = Math.floor(Math.random() * 12) + 1;  

   // Define array of element names...
   lImgNames[0]  = 'ImageScreen_ReportThumb01';
   lImgNames[1]  = 'ImageScreen_ReportThumb02';
   lImgNames[2]  = 'ImageScreen_ReportThumb03';
   lImgNames[3]  = 'ImageScreen_ReportThumb04';
   lImgNames[4]  = 'ImageScreen_ReportThumb05';
   lImgNames[5]  = 'ImageScreen_ReportThumb06';
   lImgNames[6]  = 'ImageScreen_ReportThumb07';
   lImgNames[7]  = 'ImageScreen_ReportThumb08';
   lImgNames[8]  = 'ImageScreen_ReportThumb09';
   lImgNames[9]  = 'ImageScreen_ReportThumb10';
   lImgNames[10] = 'ImageScreen_ReportThumb11';
   lImgNames[11] = 'ImageScreen_ReportThumb12';
   
   // hide all the named elements...
   for (btnCntr = 0; btnCntr < 12; btnCntr++) {
      buttonDiv = document.getElementById(lImgNames[btnCntr]); 
      if (buttonDiv !== undefined) {
         buttonDiv.style.display = 'none';
      }
   }

   // load the elements...
   for (btnCntr = 0; btnCntr < imgAmt; btnCntr++) {
      // get pointer to element...
      buttonDiv = document.getElementById(lImgNames[btnCntr]);
      if (buttonDiv !== undefined) {
         // Show the element...
         buttonDiv.style.display = 'block';
   
         // Label...
        buttonDiv.childNodes[0].childNodes[0].innerHTML = 'Title for Pic[' + (btnCntr +1) + ']';
        buttonDiv.childNodes[0].childNodes[0].style.display = "block";
   
         // load the element image....
         picPath = resourceFolder + '/Image' + (btnCntr + 1) + '.jpg';
        buttonDiv.childNodes[1].childNodes[0].innerHTML = '<img  src=' + picPath + ' alt="' + 'Image' + (btnCntr + 1) + '.jpg' +'" style="width:200px;height:120px;" />';

         buttonDiv.childNodes[1].style.display = "block";
   
         // Save the url in element....
         ReportUrl = 'http://www.duckduckgo.com';
         buttonDiv.childNodes[2].childNodes[0].innerHTML = ReportUrl;
         buttonDiv.childNodes[2].childNodes[0].style.display = "none";
      }
   }

   return 'Success';
}

(Kelley) #7

Thank you very much for this! I really appreciate it! I made the changes and of course it works like a charm. I will have to research using classes and ID’s with Hype! Again, Thank you! :smile:


(Mark Hunte) #8

Also possibly a cleaner way without wiping innerHTML is to do it like

buttonDiv.childNodes[1].childNodes[0].style.backgroundImage = `url(' ${picPath}')`;
buttonDiv.childNodes[1].childNodes[0].style.backgroundSize = "200px 120px";
buttonDiv.childNodes[1].childNodes[0].title= `Image ${(btnCntr + 1)}.jpg`

To understand how I am writing this : url(’ ${picPath}’)

see :


(Kelley) #9

Thanks Mark! I will incorporate the new string literals into my coding practices… I appreciate your input! Thanks!! :slight_smile: