"use strict";

var LinkedTable;

+function($) {
	LinkedTable = function(element, options) {
		this.$element = $(element);
		this.options = $.extend({}, LinkedTable.DEFAULTS, options);
		this.clickHandler = function(event) {
			$(this).addClass('highlight').siblings().removeClass('highlight');
		};
	};

	LinkedTable.DEFAULTS = {
		url: '',  //The absolute or relative path to use to query the data.  Server is expected to respond with a JSON array of objects.
		attr: 'data-key-name',
		selection: 'row'  //Currently only row is supported.
	};

	//TODO
	LinkedTable.prototype.myMethod = function() {

	};

	//A function that will clean and rebuild the table displaying all the users.
	LinkedTable.prototype.refresh = function() {
		var table = this.$element;
		var thead = table.find("thead tr");
		var tbody = table.find("tbody");
		var selection = this.options.selection;
		var attr = this.options.attr;
		var clickHandler = this.clickHandler;

		if(thead.length == 0) {
			return;
		}

		//Empty or Create the table body.
		if(tbody.length != 0) {
			//Remove the row selection handler.
			if(selection == 'row') this.$element.off('click', 'tbody tr', clickHandler);
			//Empty the table of data.
			tbody.empty();
		}
		else {
			tbody = $("<tbody></tbody>");
			tbody.appendTo(table);
		}

		$.getJSON("user-data", function(data) {
			var headers = thead.children();
			var attributes = [];

			//Read the table headers to get the data object keys.
			for(var headerIndex = 0; headerIndex < headers.length; headerIndex++) {
				var nextHeader = headers[headerIndex];

				attributes[headerIndex] = $(nextHeader).attr(attr);
			}

			//Add the table data.
			for(var dataIndex = 0; dataIndex < data.length; dataIndex++) {
				var rowData = data[dataIndex];
				var row = $("<tr></tr>");

				row.appendTo(tbody);

				for(var attributeIndex = 0; attributeIndex < attributes.length; attributeIndex++) {
					var attribute = attributes[attributeIndex];
					var cellData = rowData[attribute];

					row.append("<td>" + cellData + "</td>");
				}
			}

			//Setup the row selection handler.
			if(selection == 'row') table.on('click', 'tbody tr', clickHandler);
		});
	}
}(jQuery);