1

I am building within a content management system, so I have to get creative with load functions.

I have 2 scripts running on load. A random background image for the home page, and the navigation menu. I included both in a separate script that runs on load. The only page to get the background image is the home page. So on all the other pages that do not have the random home script linked, the script errors out and the menu does not load.

I would like the background image to execute first. A bad work around is to load the menu first, and let the random home script break on any sub pages but this is NOT ideal and I am hoping to find a solution.

I would like to load the image first, and then run the navigation script. And in the event that the image script is undefined, I would like it to skip, and execute the navigation script.

Here is my code:

function start() {

var randH = randomHome(); 
var undefined = false; 
if (randH === undefined) {
   loadNAV();
} 

  else {
        randomHome();
        loadNAV();
      }
}

window.onload = start;

The 2 functions are linked in separate files and work just fine when listed like this:

function start() {

  loadNAV();
  randomHome();  

}

window.onload = start;

But this leaves errors on sub pages that do not get the background image. So i am searching for a no error answer that loads the background image first, or skips it, and then the navigation.

Valerie
  • 35
  • 1
  • 7

2 Answers2

2

Create an anonymous function that runs on load and checks for the existence of the start() function. If it exists, call it.

window.onload = function() {
    if (start) {
        start();
    }
};

Remove the undefined = false line. undefined is a reserved keyword and already evaluates as "falsy" and what you've done will cause a lot of issues for anything else relying on the undefined keyword. Instead, change the if statement to use == instead of ===. == evaluates equality, === evaluates identity.

If you're trying to prevent the randomHome() script from running if it doesn't exist, the same code would be used inside the start() function.

function start() {
    // only call randomHome function if it exists
    if (randomHome) {
        var home = randomHome();
        // anything else to do with the homes goes here
    }

    // load the nav regardless of whether randomHome exists
    loadNAV();
}
Soviut
  • 88,194
  • 49
  • 192
  • 260
  • == test for equality when === test for identity – Aubin Jan 23 '17 at 15:16
  • @soviut the start function is on every page it alwasy exists, its the randomHome script that does not exist on every page... – Valerie Jan 23 '17 at 15:35
  • This still breaking at var randH = randomHome(); – Valerie Jan 23 '17 at 15:40
  • function start() { var randH = randomHome(); if (randH == undefined) { return true; loadNAV(); } else { randomHome(); loadNAV(); } } window.onload = start; – Valerie Jan 23 '17 at 15:42
  • window.onload = function() { if (randomHome) { randomHome(); loadNAV(); } else { loadNAV();} }; @soviut is this what you mean? the problem is that it still sees randomHome as undefined. – Valerie Jan 23 '17 at 15:55
  • There's no need for the `else` statement since `loadNAV()` gets called regardless. The only conditional aspect is whether or not `randomHome` exists and gets called – Soviut Jan 23 '17 at 21:26
0

This is what ended up working. thanks all.

function start() {

if(window.randomHome == undefined )
{ 

    loadNAV();
}

else {
        randomHome();
        loadNAV();
}
}
window.onload = start;
Valerie
  • 35
  • 1
  • 7