Keep certain links in standalone mode on iPhone

Question

I've found this gist that does prevents links from webpages to go outside the "standalone mode" on an iPhone, but I'd like to disable this functionality on certain links with classes.

Whenever a modal is present, this functionality breaks it and quick opens the modal and then redirects to the href.

The code:

    if(("standalone" in window.navigator) && window.navigator.standalone) {
      var noddy, remotes = false;
      document.addEventListener('click', function(event) {
        noddy = event.target;
        while(noddy.nodeName !== "A" && noddy.nodeName !== "HTML") {
              noddy = noddy.parentNode;
          }
        if('href' in noddy && noddy.href.indexOf('http') !== -1 && (noddy.href.indexOf(document.location.host) !== -1 || remotes)) {
          event.preventDefault();
          document.location.href = noddy.href;
        }
      }, false);
    }

How can I modify it to include that a with classes, such as open, modal shouldn't use the above functionality and just keep the modal open?

Answer 1

Try this.

if(("standalone" in window.navigator) && window.navigator.standalone) {
  var noddy, remotes = false;
  document.addEventListener('click', function(event) {
    noddy = event.target;
    var className = noddy.className;
    if(noddy.nodeName === "A" 
        && (className.indexOf('open') != -1 || className.indexOf('modal') != -1)){
         return;//Just return without doing anything
    }

    while(noddy.nodeName !== "A" && noddy.nodeName !== "HTML") {
          noddy = noddy.parentNode;
      }
    if('href' in noddy && noddy.href.indexOf('http') !== -1 && (noddy.href.indexOf(document.location.host) !== -1 || remotes)) {
      event.preventDefault();
      document.location.href = noddy.href;
    }
  }, false);
}

As a side note if you are using jQuery in your page or application then your code can be reduced very much by using jQuery built in apis.