TechSock

    iOS Exit Offers

    I was recently tasked with developing a exit script to offer a coupon code before a customer leave the site. I managed to create a cross platform exit offer script that is almost done*. I think the most interesting part of my solution is how I am displaying this offer for iOS device. It needed to be easy. Desktops, notebooks, tablets, etc. (any device that runs flash) can utilize ZeroClipboard to copy text to the clipboard in just one click. iOS devices do not have flash, so ZeroClipboard isn't an option. I decided not to pour hours into creating a one tap "copy" to clipboard for iOS, since most people using their iOS device for purchasing goods are probably fairly savvy. I am more concerned on prompting these users at the best time without the prompts becoming overly annoying.

    I started with some criteria:

    • Simple for savvy users
    • Do not prompt on a refresh
    • Only prompt once the user has visited the same page twice
    • Prompt should not fire on internal navigation
    And this is what I ended up with: ios-exit.js
    *Nothing is ever complete. There always seems to be something I can tweak to make it a bit better.

    The JS:

    //iOS Exit Offers
    var exitmsg = "Shhh! Don\'t tell anyone, but we\'ll give you a coupon .\n\nCopy your coupon code from the space below.\n\nCoupon Code:";
    var exitcode = "theCouponCode";
    var siteurl = "techsock.com"; //No http:// needed
    
    var iOS = (navigator.userAgent.match(/(iPad|iPhone|iPod)/g) ? true : false);
    
    function setOne() {
      document.cookie = "internal=one;domain=97.74.4.64;path=/";
      console.log('oned');
    }
    
    //Change internal cookie to "one" on internal navigation
    function internalLinks() {
      var elements = document.getElementsByTagName('a');
      for (var i = 0, len = elements.length; i < len; i++) {
        elements[i].setAttribute("onMouseDown", "setOne();");
      }
    }
    internalLinks(); //Add OnClick Event to all Internal Links
    
    function getCookie(c_name) {
      if (document.cookie.length > 0) {
        c_start = document.cookie.indexOf(c_name + "=");
        if (c_start != -1) {
          c_start = c_start + c_name.length + 1;
          c_end = document.cookie.indexOf(";", c_start);
          if (c_end == -1) c_end = document.cookie.length;
          return unescape(document.cookie.substring(c_start, c_end));
        }
      }
      return "";
    }
    
    function setCookie(c_name, value, expiredays) {
      var exdate = new Date();
      exdate.setDate(exdate.getDate() + expiredays);
      document.cookie = c_name + "=" + escape(value) +
        ((expiredays == null) ? "" : ";path=/;expires=" + exdate.toUTCString());
    }
    
    function exitOffer() {
      //Show Coupon Code in Text Field within Prompt for iOS Users
      if (iOS === true) {
        //Check to see if user has been shown coupon before
        couponcode = getCookie('couponcode');
        if (couponcode != null && couponcode !== "") {
    
        } else {
          coup_timer = window.setTimeout(function() {
            var conf = prompt(exitmsg, exitcode);
            if (conf) {
              //User tapped OK
              setCookie('couponcode', 'prompt-yes', 3);
              //Might utilize these cookies at a later date
            } else {
              //User tapped cancel
              setCookie('couponcode', 'prompt-no', 1);
              //Might utilize these cookies at a later date
            }
          }, 700);
        }
      }
    }
    
    function checkInternal() {
      //Check to see if internal link was followed
      internal = getCookie('internal');
      if (internal !== null && internal !== "") {
        if (internal == "zero") {
          exitOffer();
        } else {
          window.setTimeout(function() {
            document.cookie = "internal=zero;domain=" + siteurl + ";path=/";
          }, 500);
          console.log('zeroed');
        }
      } else {
        window.setTimeout(function() {
          document.cookie = "internal=zero;domain=" + siteurl + ";path=/";
        }, 500);
        console.log('zeroed');
      }
    }
    
    var title = document.getElementsByTagName("title")[0].innerHTML;
    var nospacetitle = title.replace(/\W/g, '');
    var cleantitle = nospacetitle.replace(/ /g, '');
    
    function checkCookie() {
      //Fire Exit Offer on Second Time a Page Loads
      pagename = getCookie(cleantitle);
      if (pagename !== null && pagename !== "") {
        lastpage = getCookie('lastpage');
        if (lastpage !== null && lastpage !== "" && lastpage == cleantitle) {
          console.log('samepage-refreshed');
          setCookie('lastpage', cleantitle, 1);
        } else {
          console.log('navigated-from-dif');
          setCookie('lastpage', cleantitle, 1);
          checkInternal();
        }
      } else {
        console.log('no-page-cookies-yet');
        setCookie(cleantitle, 'pagename', 30);
        setCookie('lastpage', cleantitle, 1);
      }
    }
    checkCookie();
    
    //Force iOS to run exit offers on backward navigation
    if (iOS === true) {
      window.onpageshow = function(evt) {
        //If persisted then it is in the page cache, call JS function again.
        if (evt.persisted) {
          checkCookie();
        }
      };
    }
    

    Share this article on
    Author image
    Written by Matt Hopkins
    Ohio