// Miiget application javascript

var Miis = {};
var Positions = [];
var Images = {
  'false': {
	"ar_l_ok": "images/arrow_left_link_ok.gif",
	"ar_r_ok": "images/arrow_right_link_ok.gif",
	"ar_l_ko": "images/arrow_left_link_ko.gif",
	"ar_r_ko": "images/arrow_right_link_ko.gif"
  },
  'true': {
	"ar_l_ok": "images/arrow_left_main_ok.gif",
	"ar_r_ok": "images/arrow_right_main_ok.gif",
	"ar_l_ko": "images/arrow_left_main_ko.gif",
	"ar_r_ko": "images/arrow_right_main_ko.gif"
  }
};
var PositionsSet = [
 [	{y:60,x:-255},
	{y:180,x:-440},
	{y:90,x:-45},
	{y:130,x:175},
	{y:530,x:-165},
	{y:270,x:185},
	{y:420,x:170},
	{y:550,x:65},
	{y:490,x:-385},
	{y:350,x:-435}
  ],[
	{y:60,x:-235},
	{y:90,x:-45},
	{y:40,x:165},
	{y:410,x:-440},
	{y:550,x:-395},
	{y:510,x:-165},
	{y:270,x:185},
	{y:430,x:170},
	{y:550,x:65},
	{y:180,x:-445}
  ],[
	{y:90,x:-405},
	{y:50,x:-175},
	{y:100,x:45},
	{y:230,x:185},
	{y:370,x:170},
	{y:520,x:115},
	{y:530,x:-115},
	{y:500,x:-355},
	{y:230,x:-440},
	{y:390,x:-435}
  ]
];

function resetPositions() {
  Positions = PositionsSet.getRandom().copy();
}

function btnState(elt, over) {
  if (over == true) {
    elt.src = elt.src.replace('out', 'over');
  } else {
	elt.src = elt.src.replace('over', 'out');
  }
}

function showResultPanel(tab, elt) {
  if (!this.show) {
	var h3 = document.body.header.getElementsByTagName('h3');
	for (var i = 0; i < h3.length; i++) {
	  h3[i].style.display = 'none';
	}
	document.body.header.style.height = '165px';
	document.body.results.style.display = 'block';
	tabSelect(tab, elt);
  }
}

function tabSelect(elt, div) {
  if (this.selected) {
	if (this.selected.className == 'active') {
		this.selected.className = '';
	} else {
		this.selected.className = 'active';
	}
	this.selectedDiv.style.display = 'none';
  }
  if (elt.className == 'active') {
    elt.className = '';
  } else {
    elt.className = 'active';
  }
  div.style.display = 'block';
  this.selected = elt;
  this.selectedDiv = div;
}

function toggleResultList(show) {
  if (show) {
	document.body.results.list.style.display = 'block';
	document.body.results.path.style.left = '215px';
  } else {
	document.body.results.list.style.display = 'none';
	document.body.results.path.style.left = '12px';
  }
}

function setRelationZapper(page, max) {
  var results = document.body.results;
  if (page > 1) {
	results.relation_zapper.prev.src = 'images/arrow_left_rel_ok.gif';
	results.relation_zapper.prev.onclick = changeRelations.bind(window);
  } else {
	results.relation_zapper.prev.src = 'images/arrow_left_rel_ko.gif';
	results.relation_zapper.prev.onclick = null;
  }
  if (page < max) {
	results.relation_zapper.next.src = 'images/arrow_right_rel_ok.gif';
	results.relation_zapper.next.onclick = changeRelations.bind(window, true);
  } else {
	results.relation_zapper.next.src = 'images/arrow_right_rel_ko.gif';
	results.relation_zapper.next.onclick = null;
  }
  results.relation_zapper.text.innerHTML = "" + page + " / " + max;
}

function flushMiis(newMiis) {
  toggleRelationDrawer(false);
  for (var id in Miis) {
	if (Miis[id].div) {
	  if (Miis[id].div.relArrow) {
		document.body.results.removeChild(Miis[id].div.relArrow);
	  }
	  document.body.results.removeChild(Miis[id].div);
	}
  }

  Miis = {};
  if (newMiis) {
	for (var i = 0; i < newMiis.length; i++) {
	  Miis[newMiis[i]['_id']] = newMiis[i];
	  Miis[newMiis[i]['_id']]['ctxt'] = 0;
	}
  }
}

function addPath(mii) {
  document.body.results.path.innerHTML += " &gt; <a href='javascript:void(0);'" +
	" onclick='fetchMii("+ mii['_id'] +", 0, true);'>"+mii['firstName']+" "+(mii['lastName'] || '')+"</a>";
}

function toggleRelationDrawer(show) {
  var relDrawer = document.body.results.relation_drawer;
  var style = (show == true ? 'block' : 'none');
  relDrawer.think1.style.display = style;
  relDrawer.think2.style.display = style;
  relDrawer.wrapper.style.display = style;
}

function showRelationContext(show) {
  if (show == true) {
	this.className = "relation_arrow_288";
	if (this.edge == true) {
	  this.style.background = "url(images/go-next-big-edge.png) no-repeat 0px 0px";
	  this.innerHTML = '<div class="relation_arrow_ctxt_edge">' + this.context + '</div>';
	} else {
	  this.style.background = "url(images/go-next-big.png) no-repeat 0px 0px";
	  this.innerHTML = '<div class="relation_arrow_ctxt">' + this.context + '</div>';
	}
	this.style.marginLeft = (this.originalX - 185) + 'px';
	this.style.top = (this.originalY - 40) + 'px';
  } else {
	this.className = "relation_arrow_48";
	if (this.edge == true) {
	  this.style.background = "url(images/go-next-edge.png) no-repeat 0px 0px";
	} else {
	  this.style.background = "url(images/go-next.png) no-repeat 0px 0px";
	}
	this.style.marginLeft = this.originalX + 'px';
	this.style.top = this.originalY + 'px';
	this.innerHTML = '?';
  }
}

function showRelation(json) {
  var search = document.body.search_rel;
  var results = document.body.results;

  showResultPanel(document.body.header.tabs.relation, search);
  toggleResultList(false);
  setRelationZapper(0,0);

  var obj = Json.evaluate(json);
  flushMiis(obj['miis']);
  if (obj['error'] && obj['miis']) { // NO LINK BETWEEN THEM
	showMii(obj['miis'][0], -300, 250, false);
	var div = showMii(obj['miis'][1], 40, 250, false);
	var img = new Element('img');
	img.src = 'images/go-next-borken.png';
	img.className = 'borkenLink';
	div.relArrow = img;
	document.body.results.appendChild(img);
  } else { // OK =)
	var x = [-450, -123, 200];
	var y = 70;
	for (var i = 0; i < obj['path'].length; i++) {
	  if (i > 0 && i % 3 == 0) y += 190;
	  var mii = Miis[obj['path'][i]['id']];
	  addPath(mii);
	  var div = showMii(mii, x[i % 3], y, false);
	  if (i < obj['path'].length - 1) {
		var img = new Element('img', {
		  'styles': {'z-index': '1500'}
		});
		var img = new Element('div');
		img.setStyles({'position': 'absolute', 'z-index': 1500, 'left': '50%'});
		if (i % 3 == 2) {
		  img.edge = true;
		  img.originalX = (x[i % 3] - 210);
		  img.originalY = y + 152;
		} else {
		  img.edge = false;
		  img.originalX = (x[i % 3] + 267);
		  img.originalY = y + 60;
		}
		img.context = obj['path'][i + 1]['ctxt'];

		img.addEvent('mouseenter', showRelationContext.bind(img, true));
		img.addEvent('mouseleave', showRelationContext.bind(img, false));
		showRelationContext.bind(img)(false);
		div.relArrow = img;
		document.body.results.appendChild(img);
	  }
	}
  }
}

function showResults(json) {
  var search = document.body.search_people;
  var results = document.body.results;

  showResultPanel(document.body.header.tabs.people, search);
  toggleResultList(true);

  var obj = Json.evaluate(json);
  if (obj['candidates'].length > 0) {
	var candidates = results.list.candidates;
	candidates.innerHTML = "";
	for (var i = 0; i < obj['candidates'].length; i++) {
	  var candidate = obj['candidates'][i];
	  var div = document.createElement('div');
	  div.className = "candidate";
	  div.innerHTML = "<div class='candidate_links'>" + candidate['links'] + "</div>" +
		"<div class='candidate_name'>" + 
		"<a href='javascript:void(0);' onclick='fetchMii(" + candidate['mii'] + ", 0, true);'>" +
		candidate['name'] + "</a></div>" +
		"<div class='candidate_job'>" + (candidate['job'] || "Unknown") + "</div>";
	  candidates.appendChild(div);
	}
	var currentPage = parseInt((search.offset.value / 10) + 1);
	var maxPage = parseInt((obj['totalCandidates'] / 10) + 1);
	results.list.controls.pages.innerHTML = "" + currentPage + "/" + maxPage;
	results.list.controls.prev.style.display = (currentPage > 1 ? 'block' : 'none');
	results.list.controls.next.style.display = (currentPage < maxPage ? 'block' : 'none');
	results.list.controls.currentPage = currentPage;
	results.list.controls.maxPage = maxPage;
	
	results.list.controls.style.display = (maxPage > 1 ? 'block' : 'none');
	if (!window.ie) {
	  results.list.wrapper.parentNode.style.height = "auto";
	}
  }
  if (obj['match'] != undefined && obj['miis'] && obj['miis'].length > 0) {
	flushMiis(obj['miis']);

	var mii = Miis[obj['match']];
	if (mii) {
	  addPath(mii);
	  mii.linkOffset = obj['matchLinksOffset'];
	  mii.totalLinks = obj['matchTotalLinks'];
	  showMii(mii, -150, 289, true);
	  resetPositions(); // Reset available mii positions
	  if (mii['links'].length > 0) {
		var maxWeight = mii['links'][0]['weight'];
		var minWeight = mii['links'][mii['links'].length - 1]['weight'];
		for (var i = 0; i < mii['links'].length; i++) {
		  var link = mii['links'][i];
		  if (Miis[link['to']]) {
			link['ctxt'] = link['ctxt'].replace(mii['firstName'], '<b>'+mii['firstName']+'</b>');
			link['ctxt'] = link['ctxt'].replace(mii['lastName'], '<b>'+mii['lastName']+'</b>');

			while (true) {
			  var pos = Positions.getRandom();
			  Positions.remove(pos);
			  if (pos) break;
			}

			var div = showMii(Miis[link['to']], (pos.x + (Math.random() * 20) + 20), (pos.y + (Math.random() * 20)), false,
							  link, maxWeight - minWeight, minWeight);
			div.style.left = '50%';
		  }
		}
	  }
	}

	var relationPage = parseInt((obj['matchLinksOffset'] / 10) + 1);
	var relationMaxPage = parseInt((obj['matchTotalLinks'] / 10) + 1);
	setRelationZapper(relationPage, relationMaxPage);
  }
}

/*
 * Builds a mii profile
 */
function showMii(mii, x, y, main, link, maxWeight, minWeight) {
  var div = new Element('div', {
				'class': (main ? 'mainmii' : 'mii'),
				'styles': {'opacity': (link? ((link['weight'] - minWeight) / (maxWeight * 2)) + 0.4 : 1.0)}
			});
  if (link && window.ie) div.style.background = 'url(images/fiche_contact.gif) 0px 0px no-repeat';
  div.id = 'mii_' + mii['_id'];
  div.style.marginLeft = x + 'px';
  div.style.top = y + 'px';
  if (link) { // If it's a link, set a random position
	div.rank = ((link['weight'] - minWeight) / (maxWeight * 2)) + 0.4;
	div.addEvent('mouseenter', showLink.bind(div));
	div.addEvent('mouseleave', hideLink.bind(div));
  } else { // Main mii
	document.body.results.mainmii = div;
  }
  if (mii['ctxts'].length > 0) {
	var face = new Element('img', {'class': 'mii_face'}); // Face
	var src = mii['ctxts'][0]['face'];
	if (src && src !== 'images/johndoe.jpg') {
	  face.src = (window.ie6 ? 'resizer.php?img=' + escape(src) : src);
	} else {
	  face.src = 'images/unknown.jpg';
	}
	if (window.ie) face.style.marginBottom = '-7px';
	div.appendChild(face);

	var h3 = new Element('h3'); // Name
	if (main) {
	  h3.innerHTML = trimText(mii['firstName'] + ' ' + (mii['lastName'] || ""), 18, '..');
	} else {
	  h3.innerHTML = "<a href='javascript:void(0);' onclick='fetchMii(" + mii['_id'] + ", 0, false);'>" +
		trimText(mii['firstName'] + ' ' + (mii['lastName'] || ""), 18, '..') + "</a>";
	}
	div.appendChild(h3);

	if (mii['jobTitle'] || mii['occupation']) {
	  var job = new Element('div', {'class': 'mii_text'}); // Job
	  job.innerHTML = trimText((mii['jobTitle'] || mii['occupation']), 40, '...');
	  div.appendChild(job);
	}

	if (mii['birthDate'] || mii['birthPlace']) { // Birth date/place
	  var born = new Element('div', {'class': 'mii_text'});
	  born.innerHTML = "Born";
	  if (mii['birthDate']) born.innerHTML += " on " + mii['birthDate'];
	  if (mii['birthPlace']) born.innerHTML += " at " + mii['birthPlace'];
	  born.innerHTML += ".";
	  div.appendChild(born);
	}
	if (mii['deathDate'] || mii['deathPlace']) { // Death date/place
	  var dead = new Element('div', {'class': 'mii_text'});
	  dead.className = 'mii_text';
	  dead.innerHTML = "Died";
	  if (mii['deathDate']) dead.innerHTML += " on " + mii['deathDate'];
	  if (mii['deathPlace']) dead.innerHTML += " at " + mii['deathPlace'];
	  dead.innerHTML += ".";
	  div.appendChild(dead);
	}

	var ctxt = new Element('div', {'class': 'ctxt_controller'}); // Top context container

	var ctlLeft = new Element('img', {'class': 'ctxt_ctl_left'}); // Left ctl
	ctlLeft.src = Images[main]['ar_l_ko'];
	ctlLeft.onclick = function() { changeCtxt(this, false); }.bind(ctlLeft);
	ctlLeft.miiId = mii['_id'];

	var ctlRight = new Element('img', {'class': 'ctxt_ctl_right'}); // Right ctl
	ctlRight.className = 'ctxt_ctl_right';
	ctlRight.src = Images[main][(mii['ctxts'].length > 1 ? 'ar_r_ok' : 'ar_r_ko')];
	ctlRight.onclick = function() { changeCtxt(this, true); }.bind(ctlRight);
	ctlRight.miiId = mii['_id'];

	var ctxtText = new Element('div', {'class': 'mii_text'}); // Text
	ctxtText.className = 'mii_ctxt';
	ctxtText.innerHTML = trimText(mii['ctxts'][0]['ctxt'], (main?128:90), '...') +
	  " <a href='"+ mii['ctxts'][0]['referer'] + "' target='blank'>more</a>";

	// Caching
	ctxt.left = ctlLeft;
	ctxt.right = ctlRight;
	ctxt.text = ctxtText;
	div.face = face;
	div.ctxt = ctxt;
	div.link = (link ? link : false);
	div.mii = mii;
	mii.div = div;
	mii.match = main;

	// Packing
	ctxt.appendChild(ctlLeft);
	ctxt.appendChild(ctxtText);
	ctxt.appendChild(ctlRight);
	div.appendChild(ctxt);
  }
  document.body.results.appendChild(div);
  // FIXME if (link) new Drag.Move(div, {limit: {y: [0]}});

  return div;
}

function changeCtxt(elt, next) {
  if (elt.miiId) {
	var mii = Miis[elt.miiId];
	if (mii &&
		((next && mii['ctxt'] < (mii['ctxts'].length - 1)) ||
		 (next == false && mii['ctxt'] > 0))) {
	  mii['ctxt'] += (next ? 1 : -1);
	  var div = elt.parentNode.parentNode;

	  div.ctxt.text.innerHTML = trimText(mii['ctxts'][mii['ctxt']]['ctxt'], (div.link?90:128), '...') +
		" <a href='"+ mii['ctxts'][mii['ctxt']]['referer'] + "' target='blank'>more</a>";
	  div.removeChild(div.face);

	  var face = document.createElement('img');
	  face.className = 'mii_face';
	  var src = mii['ctxts'][mii['ctxt']]['face'];
	  if (src && src !== 'images/johndoe.jpg') {
		face.src = (window.ie6 ? 'resizer.php?img=' + escape(src) : src);
	  } else {
		face.src = 'images/unknown.jpg';
	  }

	  div.insertBefore(face, div.firstChild);
	  div.face = face;

	  adjustCtxtCtl(div, mii);
	}
  }
}

function adjustCtxtCtl(div, mii) {
  if (mii['ctxt'] < (mii['ctxts'].length - 1)) {
	div.ctxt.right.src = Images[mii.match]['ar_r_ok'];
  } else {
	div.ctxt.right.src = Images[mii.match]['ar_r_ko'];
  }
  if (mii['ctxt'] > 0) {
	div.ctxt.left.src = Images[mii.match]['ar_l_ok'];
  } else {
	div.ctxt.left.src = Images[mii.match]['ar_l_ko'];
  }
}

function submitSearch(elt, cb) {
  document.body.results.path.innerHTML = "";
  new Ajax(elt.action, {method: elt.method, data:elt, onComplete: cb}).request();
}

function getResults(nb) {
  var elt = document.body.search_people;
  elt.offset.value = parseInt(elt.offset.value) + nb;
  submitSearch(elt, showResults);
}

function fetchMii(mii, offset, change) {
  if (change === true) {
	document.body.results.path.innerHTML = "";
  }
  new Ajax('/MiiGet/ShowMii',{
	method: 'post',
	data:{'output': 'json', 'mii': mii, 'offset': (offset?offset:0)},
	onComplete:showResults
  }).request();
}

function showLink() {
  var relDrawer = document.body.results.relation_drawer;
  this.setStyles({'opacity': 1, 'z-index': 999});
  var WinWidth = Window.getWidth();
  var WinMid = (WinWidth / 2);
  var Xmid = this.getLeft() + 123;
  var Ymid = this.getTop() - 155 + 73;
  var Xinv = (Xmid < WinMid ? false : true);

  relDrawer.think1.style.top = (Ymid - 80) + 'px';
  relDrawer.think1.style.left = (Xmid - (Xinv ? 110 : 60)) + 'px';
  relDrawer.think2.style.top = (Ymid - 95) + 'px';
  relDrawer.think2.style.left = (Xmid - (Xinv ? 125 : 45)) + 'px';
  relDrawer.wrapper.style.top = (Ymid - 130) + 'px';

  if (Xmid > (WinMid - 150) && Xmid < (WinMid + 150)) { // If we're in the middle area
	relDrawer.wrapper.style.right = (Xinv ? (WinWidth - Xmid + 40) + 'px' : null);
	relDrawer.wrapper.style.left = (Xinv ? null : (Xmid - 25) + 'px');
  } else if (Xinv) { // if we're on the right
	relDrawer.wrapper.style.left = null;
	relDrawer.wrapper.style.right = (WinWidth - Xmid + 85) + 'px';
  } else { // normal case, on the left
	relDrawer.wrapper.style.right = null;
	relDrawer.wrapper.style.left = (Xmid - 30) + 'px';
  }
  relDrawer.text.innerHTML = this.link.ctxt;
  toggleRelationDrawer(true);
}

function changeRelations(next) {
  if (document.body.results.mainmii) {
	var mii = document.body.results.mainmii.mii;
	fetchMii(mii['_id'], mii.linkOffset + (next === true ? 10 : -10), true);
  }
}

function hideLink() {
  this.setStyles({'opacity': this.rank, 'z-index': 0});
  toggleRelationDrawer(false);
}

function setDefaultValues() {
  var search = document.body.search_people;
  if (search.query.value == "name" || search.query.value.length == 0) {
	search.query.value = "name";
	search.query.style.color = "#777";
	search.query.onfocus = function() { if (search.query.value == "name") search.query.value = ""; search.query.style.color = "#000"; };
  }
  if (search.from.value == "from" || search.from.value.length == 0) {
	search.from.value = "from";
	search.from.style.color = "#777";
	search.from.onfocus = function() { if (search.from.value == "from") search.from.value = ""; search.from.style.color = "#000"; };
  }
  if (search.to.value == "to" || search.to.value.length == 0) {
	search.to.value = "to";
	search.to.style.color = "#777";
	search.to.onfocus = function() { if (search.to.value == "to") search.to.value = ""; search.to.style.color = "#000"; };
  }
}

function initAutoCompleters() {
  var body = document.body;
  var autocompleters = {};
  [body.search_people.query, body.search_rel.from, body.search_rel.to].each(function(el) {
	autocompleters[el] = new Autocompleter.Ajax.Json(el, '/MiiGet/SuggestPeople', {
	  postVar: 'query',
	  postData: {'output': 'json'}
	});
  });
  window['autocompleters'] = autocompleters;
}

function bindAccessors() {
  document.body.header = $('header');
  var tabs = $('formTabs');
  tabs.choices = tabs.getElementsByTagName('li');
  tabs.people = tabs.choices[0];
  tabs.relation = tabs.choices[1];
  document.body.header.tabs = tabs;

  var search = $('search_people');
  var search_rel = $('search_relation');
  document.body.search_people = search;
  document.body.search_rel = search_rel;
  if (!window.ie) {
    search.query = $('search_query');
  }
  search.from = $('search_from');
  search.to = $('search_to');

  var results = $('results');
  document.body.results = results;
  results.path = $('browsing_path');
  results.list = $('results_list');
  results.list.candidates = $('candidates');
  results.list.controls = $('result_controls');
  results.list.controls.prev = $('result_controls_prev');
  results.list.controls.next = $('result_controls_next');
  results.list.controls.pages = $('result_controls_pages');
  results.list.wrapper = $('candidates_controls_wrapper');

  results.relation_drawer = {};
  results.relation_drawer.think1 = $('relation_drawer_think1');
  results.relation_drawer.think2 = $('relation_drawer_think2');
  results.relation_drawer.wrapper = $('relation_drawer_text_wrapper');
  results.relation_drawer.text = $('relation_drawer_text');

  results.relation_zapper = $('relation_zapper');
  results.relation_zapper.prev = $('relation_zapper_prev');
  results.relation_zapper.next = $('relation_zapper_next');
  results.relation_zapper.text = $('relation_zapper_text');
}

function fallbackIE6() {
  document.body.style.background = "white";
  document.body.results.relation_drawer.think1.src = 'images/think_1.gif';
  document.body.results.relation_drawer.think2.src = 'images/think_1.gif';
  document.body.results.relation_drawer.text.style.backgroundImage = 'url(images/bulle_middle.gif)';
  var imgs = document.body.results.relation_drawer.wrapper.getElementsByTagName('img');
  imgs[0].src = 'images/bulle_left.gif';
  imgs[1].src = 'images/bulle_right.gif';
}

function trimText(str, length, append) {
  if (str.length > length) {
	str = str.substr(0,length);
	str += append;
  }
  return str;
}