/* tests:
 *
 * 1. click on children of .text should alert their index - PASS
 * 2. click on other elements should not - PASS
 * 3. if two nodes have the same content, a click on the latter should not return the index of the former - PASS
 */

// how to make it execute after document is loaded?
var content = "<div>a</div><div>e</div><div>t</div><div>7</div><div>1</div><div>a</div>",
    textNodes = document.getElementsByClassName("text")[0];  // what if the server returned json, or content was an array. 

textNodes.innerHTML = content;


function findIndex(node) { // does js have an api for the index?
	var siblings,
		sibling, 
		index;
	
	siblings = node.parentNode.children;
	
	for (index=0; index<siblings.length; index++) {
		if (siblings[index] == node) return index;
	}
	return -1; // no match found, this should not happen
}

function registerEventHandler(node, event, handler) { 
	if (typeof node.addEventListener == "function") {
		node.addEventListener(event, handler, false);
	}
	else {
		node.attachEvent("on" + event, handler);	
	}
}

function normaliseEvent(event) {
  if (!event.stopPropagation) {
    event.stopPropagation = function() {this.cancelBubble = true;};
    event.preventDefault = function() {this.returnValue = false;};
  }
  if (!event.stop) {
    event.stop = function() {
      this.stopPropagation();
      this.preventDefault();
    };
  }

  if (event.srcElement && !event.target)
    event.target = event.srcElement;
  if ((event.toElement || event.fromElement) && !event.relatedTarget)
    event.relatedTarget = event.toElement || event.fromElement;
  if (event.clientX !== undefined && event.pageX === undefined) {
    event.pageX = event.clientX + document.body.scrollLeft;
    event.pageY = event.clientY + document.body.scrollTop;
  }
  if (event.type == "keypress") {
    if (event.charCode === 0 || event.charCode === undefined)
      event.character = String.fromCharCode(event.keyCode);
    else
      event.character = String.fromCharCode(event.charCode);
  }

  return event;
}

function addHandler(node, type, handler) {
  function wrapHandler(event) {
    handler(normaliseEvent(event || window.event));
  }
  registerEventHandler(node, type, wrapHandler);
  return {node: node, type: type, handler: wrapHandler};
}

function removeHandler(object) {
  unregisterEventHandler(object.node, object.type, object.handler);
}

var foo = addHandler(textNodes,"click", function(event) {
  alert(findIndex(event.target));
});