/* hide/show blocks on profile-page */
var details;

window.addEvent('domready', function() {
	// scroll rankings to position:
	var rankings = $('rankings');
	if(rankings && rankings.getParents('.profile').length>0) {
		var ul = rankings.getElements('ul')[0];
		//alert('My element can scroll to ' + ul.scrollHeight + 'px');
		var li_elts = ul.getElements('li');
		var step = (ul.scrollHeight/li_elts.length).toInt();
		// define position of element with class 'you'
		var you_index = li_elts.indexOf(rankings.getElement('li.you'));
		var nu_pos = (you_index*step)-(2*step) < 0 ? 0 : (you_index*step)-(2*step);
		ul.scrollTo(0, nu_pos);
	}
	//myElement.scrollTo(x, y);
	
	// on-click of ...:
	details = $('personal-details');
	
	if(details){
		details.getElements('a#edit-details').addEvent('click', function(evt){
			if (details.hasClass("edit-mode")) {
				$("form").submit();
			}
			else {
				detailsToggle(this);
			}
			return false;
		});
		details.getElements('a#close-details').addEvent('click', function(evt){
			detailsToggle(details.getElements('a#edit-details'));
			return false;
		});
		
		function setPasswordFormState() {
			if(!$("trigger-password").hasClass('opened')){
				$("trigger-password").set('text', '+ Wachtwoord wijzigen');
				$("change-password").addClass("hide");
				$("change-password").getElements("input[type=password]").set("value", "");
			}else{
				$("trigger-password").set('html', '- Wachtwoord <span style="text-decoration:underline; font-weight:bold; color:#f60;">niet</span> wijzigen');
				$("change-password").removeClass("hide");
			}
		}
		
		if ($("trigger-password")) {
			setPasswordFormState();
		}
		
		details.getElements('a#trigger-password').addEvent('click', function(evt){
			$(this).toggleClass("opened");
			setPasswordFormState();
			return false;
		});
	}

	var pioneerMatchesEl = $('pioneer-matches');
	if (pioneerMatchesEl && location.hash == '#pionier') {
		new Fx.Morph(pioneerMatchesEl.getElement('h3'), { duration : 300 }).start({ 'background-color' : '#f60' });
	}

	var tips = new Tips('.help');
	tips.addEvent('show', function(tip, el) {
		tip.addClass('tooltip')
	})
});

var detailsToggle = function(a){
	if (details.hasClass('edit-mode')) {
  	details.removeClass('edit-mode');
  	a.set('text', 'Bewerken');
	}
	else {
		details.addClass('edit-mode');
		a.set('text', 'Opslaan');
	}	
}