var datalayer_string = "";

// look for datalayer within DOM
window.addEventListener('message', function(e) {
    if (e.data.type && (e.data.type == 'datalayer_config')) {

      datalayer_string = e.data.text;
      var object = window[datalayer_string];

      //only run extension if data layer object was found.
      console.log('Looking for the (' + e.data.text + ') data layer...');
      if (object) {
        init(object);
      } else {
        console.log(e.data.text + ' was not found on this page.')
      }

    }
});

// display Data Layer (called if dataObject found on page)
function init(datalayer) {

  var dl = datalayer;

  //flatten nested object
  function flatten(ob) {
    var toReturn = {};

  	for (var i in ob) {
  		if (!ob.hasOwnProperty(i)) continue;
  		if ((typeof ob[i]) == 'object') {
  			var flatObject = flatten(ob[i]);
  			for (var x in flatObject) {
  				if (!flatObject.hasOwnProperty(x)) continue;
  				toReturn[i + '.' + x] = flatObject[x];
  			}
  		} else {
  			toReturn[i] = ob[i];
  		}
  	}
  	return toReturn;
  };

  // input a flatted data layer object
  // output a sorted data layer array with hierarchy level
  function format(obj) {
    var flatDL = [];
    var width  = 40; //width of left column in console display

    for (var key in obj) {

      var level = (key.split(".").length - 1); //level in hierarchy
      var keyf = key + ' '.repeat(width - key.length) + ': ';
      var value = obj[key];
      var sortablekey = level + '|' + keyf + '|' + value;

      flatDL.push(sortablekey);
    }

    var output = flatDL.sort(); //sort flattened data Layer
    return output;
  }

  // input a sorted and flattened data layer array
  // output a nested format in console
  function output(array) {

    //array value => level|element|value
    var arrayLength = array.length;

    //delineate objects into groups
    // level 1+ => [Child Object]
    var a = [], b = [], prev;
    for (var i = 0; i < arrayLength; i++) {

      var level = array[i].split('|')[0];

      // level 0  => Base
      if (level == 0) {
        level = 'root';
      }

      // level 1+ => [Child Object]
      if (level >= 1) {
        level = array[i].split('|')[1].split('.')[0];
      }

      if (level !== prev) {
        a.push(level);
        b.push(1);
      } else {
        b[b.length-1]++;
      }
      prev = level;

    }

    var groups = {};
    for (var i = 0; i < a.length; i++) {
      groups[a[i]] = b[i];
    }

    //output elements
    console.group('Data Layer View: ' + datalayer_string);
    var groupCount = 0;
    for (var i = 0; i < arrayLength; i++) {
      //extract group identifier from key, based on level
      var level = array[i].split('|')[0];
      if (level == 0) {
        level = 'root';
      }
      if (level >= 1) {
        level = array[i].split('|')[1].split('.')[0];
      }
      //extract element from second part of key
      var element = array[i].split('|')[1];
      //extract value from third part of key and truncate lengthy values
      var value = array[i].split('|')[2];
      if (value.length > 100) { value = value.substring(0,95) + '...'; }

      // group outputs
      groupCount++;

      if (groupCount == 1) { console.group(level); }

      console.log(element + value);

      if (groupCount == groups[level]) {
        console.groupEnd();
        groupCount = 0;
      }

    }
    console.groupEnd();

  }

  //flatten, format, and output the data layer
  //console.group('Data Layer View: ' + datalayer_string);

  output(format(flatten(dl)));

  //console.groupEnd();
  ////////////////////////////////////

};

@@ -1230,16 +1230,24 @@
 = 40; //
+default 
 width of
@@ -1278,16 +1278,16 @@
 display%0A
-
 %0A    for
@@ -1374,16 +1374,117 @@
 ierarchy
+%0A%0A      // output formatting%0A      var whitespace = Math.abs(width - key.length); // to get alignment
 %0A      v
@@ -1511,33 +1511,25 @@
 repeat(w
-idth - key.length
+hitespace
 ) + ': '
@@ -1530,16 +1530,17 @@
 + ': ';%0A
+%0A
       va
@@ -2599,67 +2599,8 @@
 nts%0A
-    console.group('Data Layer View: ' + datalayer_string);%0A
     
@@ -3432,32 +3432,8 @@
    %7D
-%0A    console.groupEnd();
 %0A%0A  
@@ -3541,17 +3541,73 @@
 tring);%0A
+  console.group('Data Layer View: ' + datalayer_string);
 %0A
-
   output
@@ -3629,16 +3629,37 @@
 (dl)));%0A
+  console.groupEnd();
 %0A  //con

fix for long object paths