<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<!-- 
 ! Copyright (c) 2012-2013 Snowplow Analytics Ltd. All rights reserved.
 !
 ! This program is licensed to you under the Apache License Version 2.0,
 ! and you may not use this file except in compliance with the Apache License Version 2.0.
 ! You may obtain a copy of the Apache License Version 2.0 at http://www.apache.org/licenses/LICENSE-2.0.
 !
 ! Unless required by applicable law or agreed to in writing,
 ! software distributed under the Apache License Version 2.0 is distributed on an
 ! "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 ! See the Apache License Version 2.0 for the specific language governing permissions and limitations there under.
 -->
<html>
<head>
    <title>Medium asynchronous website/webapp examples for snowplow.js</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <!-- Snowplow starts plowing -->
    <script type="text/javascript">

        // Load sp.js
        ;(function(p,l,o,w,i,n,g){if(!p[i]){p.GlobalSnowplowNamespace=p.GlobalSnowplowNamespace||[];
        p.GlobalSnowplowNamespace.push(i);p[i]=function(){(p[i].q=p[i].q||[]).push(arguments)
        };p[i].q=p[i].q||[];n=l.createElement(o);g=l.getElementsByTagName(o)[0];n.async=1;
        n.src=w;g.parentNode.insertBefore(n,g)}}(window,document,"script","//d1fc8wv8zag5ca.cloudfront.net/2.10.0/sp.js","new_name_here"));

        window.new_name_here('newTracker', 'cf', 'd3rkrsqld9gmqf.cloudfront.net', {
          encodeBase64: false,
          appId: 'CFe23a',
          platform: 'mob',
          cookieName: '_cf_3489563', // Cookie names should be unique to prevent mix-ups
          contexts: {
            webPage: true,
            performanceTiming: true
          }
        });

        // This second tracker namespace could have a different collector as its endpoint
        window.new_name_here('newTracker', 'uri', 'collector.acme-company.com', {
          encodeBase64: true,
          appId: '8D4920',
          userFingerprintSeed: 857463967, // Sets a custom seed for the "uri" tracker to generate the user fingerprint; the "cf" tracker will still use the default fingerprint
          cookieName: '_uri_73457324',
        });

        window.new_name_here('setUserId', 'alex 123'); // Business-defined user ID
        //window.new_name_here('setUserIdFromLocation', 'id'); // To test this, reload the page with ?id=xxx
        //window.new_name_here('setUserIdFromCookie', '_sp_id.4209') // Test this using Firefox because Chrome doesn't allow local cookies.
        window.new_name_here('setCustomUrl', '/overridden-url/'); // Override the page URL
        window.new_name_here('enableActivityTracking', 10, 10); // Ping every 10 seconds after 10 seconds
        window.new_name_here('enableLinkClickTracking:cf', {whitelist: ['inbound', 'out']}, true, true); // Track clicks on links whose class is not "barred"
        window.new_name_here('enableLinkClickTracking:uri', {
          filter: function(link){
            return link.id === 'legal';
          }
        }, true);
        // window.new_name_here('trackPageView', 'Async Test'); // Track the page view with custom title
        window.new_name_here('trackPageView', null, [ // Auto-set page title; add page context
          {
            schema: "iglu:com.example_company/page/jsonschema/1-2-1",
            data: {
              pageType: 'test',
              lastUpdated: new Date(2014,1,26)
            }
          },
          {
            schema: "iglu:com.example_company/user/jsonschema/2-0-0",
            data: {
              userType: 'tester',
            }
          }
        ]);

    </script>
    <!-- Snowplow stops plowing -->

    <!-- Example events -->
    <script type="text/javascript">

        function playMix() {
            alert("Playing a DJ mix");

            // No tracker choice is specified, so both trackers will track the Play event
            window.new_name_here('trackStructEvent', 'Mixes', 'Play', 'MRC/fabric-0503-mix', '', '0.0');
        }

        function addProduct() {
            alert("Adding a product to basket");

            // Only the "cf" tracker will tracke the Checkout event
            window.new_name_here('trackStructEvent:cf', 'Checkout', 'Add', 'ASO01043', 'blue:xxl', '2.0', [{
              schema: 'iglu:com.acme_company/user/jsonschema/1-0-0',
              data: { fbUid: '123456 x' }
            }] );
        }

        function viewProduct() {
            alert("Viewing a product");

            // Only the "uri" tracker will track the Viewed Product event
            window.new_name_here('trackUnstructEvent:uri', {
                schema: 'iglu:com.acme_company/viewed_product/jsonschema/5-0-0',
                data: {
                    productId: 'ASO01043',
                    category: 'Dresses',
                    brand: 'ACME',
                    returning: true,
                    price: 49.95,
                    sizes: ['xs', 's', 'l', 'xl', 'xxl'],
                    availableSince: new Date(2013,3,7)
              }
            });
        }

        function addEcommerceTransaction() {
          alert('Adding an ecommerce transaction');

          var orderId = 'order-123';

          // Both trackers will track the transaction due to the ":cf;uri" suffix

          // addTrans sets up the transaction, should be called first.
          window.new_name_here('addTrans:cf;uri',
              orderId,                // order ID - required
              '',                     // affiliation or store name
              '8000',                 // total - required
              '',                     // tax
              '',                     // shipping
              '',                     // city
              '',                     // state or province
              '',                     // country
              'JPY'                   // currency
              );

          // addItem might be called for each item in the shopping cart,
          // or not at all.
          window.new_name_here('addItem:cf;uri',
              orderId,                // order ID - required
              '1001',                 // SKU - required
              'Blue t-shirt',         // product name
              '',                     // category
              '2000',                 // unit price - required
              '2',                    // quantity - required
              'JPY',                  // currency
              [{                      // context
                schema: "iglu:com.example_company/products/jsonschema/1-0-0",
                data: {
                  "launchDate": new Date(2013,3,7)
                }
              }]);

          window.new_name_here('addItem:cf;uri',
              orderId,                // order ID - required
              '1002',                 // SKU - required
              'Red shoes',            // product name
              '',                     // category
              '4000',                 // unit price - required
              '1',                    // quantity - required
              'JPY'                   // currency
              );

          // trackTrans sends the transaction to Snowplow tracking servers.
          // Must be called last to commit the transaction.
          window.new_name_here('trackTrans');

        }
    </script>
</head>

<body>
    <h1>Medium_asynchronous_examples_for_snowplow.js</h1>
    <p>Two tracker namespaces are instantiated on this page.</p>
    <p>Warning: if your browser's Do Not Track feature is enabled and respectDoNotTrack is enabled, all tracking will be prevented.</p>
    <p>If you are viewing the page using a file URL, you must edit the script URL in the Snowplow tag to include an http scheme. Otherwise a file scheme will be inferred and the page will attempt to load sp.js from the local filesystem..</p>
    <p>Press the buttons below to trigger individual tracking events:<br>
        <button type="button" onclick="playMix()">Play a mix</button><br>
        <button type="button" onclick="addProduct()">Add a product</button><br>
        <button type="button" onclick="viewProduct()">View a product</button><br>
        <button type="button" onclick="addEcommerceTransaction()">Add an ecommerce transaction</button>
    </p>
    <a href=http://en.wikipedia.org/wiki/Main_Page id=legal class="link out">Both trackers will track this link</a>
    <br>
    <a href=http://en.wikipedia.org/wiki/Main_Page id=semilegal class="class inbound">Only the cf tracker will track this link</a>
    <br>
    <a href=http://en.wikipedia.org/wiki/Main_Page id=illegal class="class barred">Neither tracker will track this link</a>

</body>

</html>