Web beacon JavaScript library

This topic presents an example of the JavaScript code with which you must instrument your web applications.

The web beacon JavaScript library accomplishes the following actions:

  • Verifies the browser type (variations in browser implementation require different methods, depending on the browser type)
  • Adds a reference to a function (the system's call-back function) into the event queue that the browser executes when the page finishes loading (window.onLoad event).
  • When the page finishes rendering, the call-back function runs and results in a GET request, which is sent to the origin server, where it is intercepted and used to derive timing information. This URL contains a randomly generated query parameter to prevent browser caching.

Obtain the web beacon JavaScript from the RIA Visability toolkit on the PDFs page, or contact your BMC Customer Support representative.

Web beacon JavaScript library code

/* tsedge_instr-min.js - Minified version - v0.9.5.4 */
if(typeof tsedge == "undefined"){
   var tsedge = {};
    tsedge.instr = {
        PL_GO_IMG: "crd_prm_go",    /* name for PRM GO file name */
        onLoadEventAttached: false,
        prmSent: false,                /* has the PageRenderMarker been sent? */
        random: Math.floor(Math.random() * 1000000),
        pagestart_ts : new Date().getTime(),
        pageend_ts: 0,
        counter: 0.00,
        url: null,
        version: '0.9.5',
        bind: function(fct, context){ /* allow execution of a function controlling its context */
           if (arguments.length < 2 && Object.isUndefined(arguments[0])) return this;
           return function() {
             return fct.apply(context);
            }
        },
        getCounter: function(){
           return (this.counter.toString().indexOf(".") >= 0) ? this.counter.toString() : this.counter.toString() + '.00';
        },
        getHost: function(markerName){
           var host = "";
           var rxp = new RegExp("http[s]?://([^/]*)/(.*)");
           if(rxp.exec(markerName)){ /* PL_GO_IMG is already full path, use it directly */
                host = markerName;
            }else{
               var pageLoc = rxp.exec(window.location);
               var fsPos = markerName.indexOf("/");
               /* build the protocol + domain */
                host = location.protocol + "//" + location.host;
               if(fsPos == 0){ /* leading / */
                   /* If GO is relative to the domain, just add the GO */
                    host = host + markerName;
                }else { /* no leading / */
                   /* If GO is relative to the actual page, build the path and add the GO */
                    host = host + location.pathname.substring(0, location.pathname.lastIndexOf('/')+1) + markerName;
                }
            }
           return host;
        },
        sendPageRenderMarker: function(){
           if(!this.prmSent){
               this.pageend_ts = new Date().getTime();
               this.counter += 0.01;
               this.host = tsedge.instr.getHost(this.PL_GO_IMG);
               var markerURL = [];
                markerURL.push(this.host);
                markerURL.push("?crd_ver=");markerURL.push(this.version); /* random unique page id */
                markerURL.push("&crd_rnd=");markerURL.push(this.random); /* random unique page id */
                markerURL.push("&crd_cnt=");markerURL.push(this.getCounter()); /* counter */
               if(this.pageend_ts > 0) {
                    markerURL.push("&crd_tpb=");markerURL.push(this.pagestart_ts); /* page start timestamp */
                    markerURL.push("&crd_olt=");markerURL.push(this.pageend_ts - this.pagestart_ts); /* page load time */
                }
               this.url = markerURL.join("");
               var markerImg = new Image();
                markerImg.src = this.url;
               this.prmSent = true;
            }
        },
        attachOnLoadPageRenderMarker: function(){
           if(this.onLoadEventAttached) { return; } /* attach only once */
           try{
               this._sendPageRenderMarker = tsedge.instr.bind(tsedge.instr.sendPageRenderMarker, this);
               if(window.attachEvent){ /* IE */
                   window.attachEvent("onload", this._sendPageRenderMarker );
                }else
               if( window.addEventListener){ /* FF, Opera, Safari... */
                   window.addEventListener("load", this._sendPageRenderMarker , false);
                }else
               if( document.addEventListener){ /* FF, Opera, Safari... when window is not set */
                   document.addEventListener("load", this._sendPageRenderMarker , false);
                }
               this.onLoadEventAttached = true;
            }catch(e){ /* */ }
        }
    };
    tsedge.instr.attachOnLoadPageRenderMarker();
}

Example of the proper script placement

<html>
<head>
<!--Insert Web beacon JavaScript at the beginning of the
head section-->
<script language="javascript" src="tsedge_instr-min.js"></script>
<!--Insert existing head section content-->
...
</head>
<body>
<!--No changes needed in body section-->
...
</body>
</html>
Warning

Placing the script element in other parts of the page can result in inaccurate timing.

 

Tip: For faster searching, add an asterisk to the end of your partial query. Example: cert*