0

I'm trying to redirect user who access a site to a mobile site. This is what I have done so far but the problem is that the function keeps running every time when the page loads. The functions gets called after the page loads. I'm a JavaScript beginner.

function redirectPage() {
    var runOnce = 0;

    if (runOnce == 0 && windowWidth <= 767){
        runOnce = 1;
        window.location.assign("example.net/mobile-site");
    }

    else if (runOnce == 0 && windowWidth >= 767){
        runOnce = 1;
        window.location.assign("example.net/regular-site");
    }
}

UPDATE

This is what I did but so far the browser keeps loading again and again.

var windowWidth = 0;

$(document).ready(function(){
    checkBrowserWidth();
    redirectPage(); 
});

function checkBrowserWidth() {      
    windowWidth = window.outerWidth;
}

function redirectPage() {
    if (typeof(Storage) != 'undefined') {
        // Store value 
        localStorage.setItem('runOnce', 0);
    }
    var runOnce = localStorage.getItem('runOnce');

    if (runOnce == 0 && windowWidth <= 767){
        localStorage.setItem('runOnce', 1);
        window.location.assign("example.net/mobile-site");
    }

    else if (runOnce == 0 && windowWidth >= 767){
        localStorage.setItem('runOnce', 1);
        window.location.assign("example.net/regular-site");
    }
}
  • The javascript is run when the page loads because javascript is executed in the order it appears on the page while the page loads. When you change the window.location you are loading a different page, and the javascript on that page will execute as the page loads. – Zack Oct 28 '14 at 20:19
  • 1
    What I do is make a cookie. If the cookie exists, the code doesn't run, if it doesn't exist ( cleared cache or expired ) it runs and creates a new cookie. – Gary Hayes Oct 28 '14 at 20:25
  • @user3757910 What are you trying to accomplish with that check for `Storage` not being undefined? If you examine what is happening there you can figure out the source of your issue. – Esteban Felix Oct 29 '14 at 04:10

1 Answers1

1

There are several issues with your approach.

Scope

JavaScript has function scope. This means that runOnce will always be undefined outside of the redirectPage function. So every call will leave runOnce as undefined.

console.log(window.setSomething); // undefined
function scopeExample() {
  var setSomething = 'something';
}
console.log(window.setSomething); // undefined

If you want to save off a global variable you will need to set it on a global scope like window.

// this will be set on a global-basis, however it will not affect the next request as 
// explained in the next section
window.runOnce = 0;
function redirectPage() {    
    if (window.runOnce == 0 && windowWidth <= 767){
        window.runOnce = 1;
        window.location.assign("example.net/mobile-site");
    }

    else if (runOnce == 0 && windowWidth >= 767){
        window.runOnce = 1;
        window.location.assign("example.net/regular-site");
    }
}

Script Lifetime

Imagine every page load as a separate app entirely. It has no knowledge of the previous request unless you want it to. You would need to save it in a cookie or in a client-side storage like localStorage.

function redirectPage() {
    var runOnce = localStorage.get('runOnce');

    if (runOnce == '0' && windowWidth <= 767){
        localStorage.set('runOnce', '1');
        window.location.assign("example.net/mobile-site");
    }

    else if (runOnce == '0' && windowWidth >= 767){
        localStorage.get('runOnce', '1');
        window.location.assign("example.net/regular-site");
    }
}
Esteban Felix
  • 1,561
  • 10
  • 21
  • 1
    It isn't really true that runOnce will always be set to 0, since after evaluating the if statements it will be set to 1. The value or runOnce, however, will be undefined anywhere outside of the redirectPage function, and will be reset to 0 by the redirectPage function when the page loads after setting the window.location. – Zack Oct 28 '14 at 20:22
  • @Zack you are correct. That is what I was trying to convey (and failing miserably at apparently). – Esteban Felix Oct 28 '14 at 20:26
  • 1
    Your edit is good. I think it is pretty clear what you mean now, the wording just sounded wrong at first. – Zack Oct 28 '14 at 20:30