wallynm · September 7, 2016 01:18
diff --git a/base.js b/base.js

 function deepPlain(array, parentKey, controlArray){
    controlArray = _.isUndefined(controlArray) ? [] : controlArray;

    _.each(array, function(item, key){

        if(_.isObject(item)){
            if(!_.isString(key))
                key = undefined;

            deepPlain(item, key, controlArray);
        } else{
            var keyName = (!_.isUndefined(parentKey)) ? parentKey + '_' + key : key;
            var obj = {name: keyName, val: item};

            controlArray.push(obj);
        }

    });
    return controlArray;
 }

 function objcByKey(obj, keyName) {
  var result;

  _.each(obj, function (v) {
    console.warn(v.name === keyName)
    if (v.name === keyName) {
      result = v;
    }
  });

  return result;
 }

 function arrayDiffToHtmlTable( prevArray, currArray) {
    // Couldnt implement prevArray and currArray as exceepted because i had a missunderstood at first
    // I've didn't realize that the json objects was a type of record, and would need a tr for each of them,
    // i thougth that was a tr by each parameter... My fault, at least i've tried to change my code to fix this issue 
    // but couldnt finish with the bold and unique register as needed

    var content   = '';
    var rows      = [];
    var tableHead = [];

    _.each(prevArray, function(item) {
        var data = deepPlain(item);
        var id = objcByKey(data, '_id');
        rows.push({_id: data[0].val, data: data});
    });
    _.each(currArray, function(item) {
        var data = deepPlain(item);
        var id = objcByKey(data, '_id');
        rows.push({_id: data[0].val, data: data});
    });

    // Parse header array
    _.map(rows, function(row){
        _.map(row.data, function (item) {
            // push data
            tableHead.push(item.name);
        });
    });

    rows = _.uniq(rows, false, function(p){ return p._id; });

    // Header keys
    tableHead = _.uniq(tableHead);

    content += '<thead>';
    _.each(tableHead, function(item){
        content+= `<th>${item}</th>`;
    });
    content += '</thead>';


    // Render rows
    _.each(rows, function(cols, key){
        content += '<tr>';

        console.warn(cols)
        _.each(cols.data, function(item) {
            content+= `<td>${item.val}</td>`;
        })

        content += '</tr>';
    });

    return `<table>${content}</table>`;
 }


 var prevArray = [ {_id:1, someKey: "RINGING", meta: { subKey1: 1234, subKey2: 52 } } ];
 var currArray = [ {_id:1, someKey: "HANGUP",  meta: { subKey1: 1234, subKey2: 56 } },
   {_id:2, someKey: "RINGING", meta: { subKey1: 5678, subKey2: 207, subKey3: 52 } } ];


 document.querySelectorAll('.app-sample')[0].innerHTML = arrayDiffToHtmlTable(prevArray, currArray);
diff --git a/index.html b/index.html
 <html>
 <head></head>

 <body>
  <div class="app-sample"></div>
  <script type="text/javascript" src="node_modules/underscore/underscore.js"></script>
  <script type="text/javascript" src="base.js"></script>
 </body>
 </html>
diff --git a/package.json b/package.json
 {
  "name": "tenfold-test",
  "version": "1.0.0",
  "description": "",
  "main": "base.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "underscore": "^1.8.3"
  }
 }

	function deepPlain(array, parentKey, controlArray){
	controlArray = _.isUndefined(controlArray) ? [] : controlArray;

	_.each(array, function(item, key){

	if(_.isObject(item)){
	if(!_.isString(key))
	key = undefined;

	deepPlain(item, key, controlArray);
	} else{
	var keyName = (!_.isUndefined(parentKey)) ? parentKey + '_' + key : key;
	var obj = {name: keyName, val: item};

	controlArray.push(obj);
	}

	});
	return controlArray;
	}

	function objcByKey(obj, keyName) {
	var result;

	_.each(obj, function (v) {
	console.warn(v.name === keyName)
	if (v.name === keyName) {
	result = v;
	}
	});

	return result;
	}

	function arrayDiffToHtmlTable( prevArray, currArray) {
	// Couldnt implement prevArray and currArray as exceepted because i had a missunderstood at first
	// I've didn't realize that the json objects was a type of record, and would need a tr for each of them,
	// i thougth that was a tr by each parameter... My fault, at least i've tried to change my code to fix this issue
	// but couldnt finish with the bold and unique register as needed

	var content = '';
	var rows = [];
	var tableHead = [];

	_.each(prevArray, function(item) {
	var data = deepPlain(item);
	var id = objcByKey(data, '_id');
	rows.push({_id: data[0].val, data: data});
	});
	_.each(currArray, function(item) {
	var data = deepPlain(item);
	var id = objcByKey(data, '_id');
	rows.push({_id: data[0].val, data: data});
	});

	// Parse header array
	_.map(rows, function(row){
	_.map(row.data, function (item) {
	// push data
	tableHead.push(item.name);
	});
	});

	rows = _.uniq(rows, false, function(p){ return p._id; });

	// Header keys
	tableHead = _.uniq(tableHead);

	content += '<thead>';
	_.each(tableHead, function(item){
	content+= `<th>${item}</th>`;
	});
	content += '</thead>';


	// Render rows
	_.each(rows, function(cols, key){
	content += '<tr>';

	console.warn(cols)
	_.each(cols.data, function(item) {
	content+= `<td>${item.val}</td>`;
	})

	content += '</tr>';
	});

	return `<table>${content}</table>`;
	}


	var prevArray = [ {_id:1, someKey: "RINGING", meta: { subKey1: 1234, subKey2: 52 } } ];
	var currArray = [ {_id:1, someKey: "HANGUP", meta: { subKey1: 1234, subKey2: 56 } },
	{_id:2, someKey: "RINGING", meta: { subKey1: 5678, subKey2: 207, subKey3: 52 } } ];


	document.querySelectorAll('.app-sample')[0].innerHTML = arrayDiffToHtmlTable(prevArray, currArray);
	<html>
	<head></head>

	<body>
	<div class="app-sample"></div>
	<script type="text/javascript" src="node_modules/underscore/underscore.js"></script>
	<script type="text/javascript" src="base.js"></script>
	</body>
	</html>
	{
	"name": "tenfold-test",
	"version": "1.0.0",
	"description": "",
	"main": "base.js",
	"scripts": {
	"test": "echo \"Error: no test specified\" && exit 1"
	},
	"author": "",
	"license": "ISC",
	"dependencies": {
	"underscore": "^1.8.3"
	}
	}