/*
 *	Class: phone.top
 *	Handles everything inside the top of the phone
 */
phone.top = {};


/*
 *	Function: setup
 *	Initilizes the top of the phone. Sets vars, events, etc
 */
phone.top.setup = function() {
	phone.top.$container	= $("#phone_top");
	
	phone.top.$number				= phone.top.$container.find('.display.number');
	phone.top.$number_input	= phone.top.$container.find('.display.number input').first();

	phone.top.$clock			= phone.top.$container.find('.display.number .clock').hide();
	phone.top.$credit			= phone.top.$container.find('.display.credit').button(function(){ if(user.current) { phone.showSection('credit') }});
	
	//Events
	phone.top.$number.hover(phone.top.showNumber, phone.top.hideNumber);
	phone.top.$number.find('.highlight').hover(phone.top.showNumber);
	phone.top.$number.find('input.phone').keyup(function() {
		if(this.value != $(this).attr('title')) {
			phone.call.setOwner(this.value);
		} else {
			phone.call.setOwner(false);
		}
	}).show();
	phone.top.$number.find('input').focus(function() {
		clearTimeout(phone.keypad.focus_timeout);
/* 		phone.keypad.focus = 'OWNER'; */
	}).blur(function() {
		phone.keypad.focus_timeout = setTimeout(function() {
			phone.keypad.focus = 'TARGET';	
		}, 100);
	});
		
	//Buttons
	phone.top.$active				= phone.top.$container.find('nav .active');
	phone.top.$keypad				= phone.top.$container.find('nav .keypad').button(function() 		{ if(user.current) { phone.showSection('keypad') }});
	phone.top.$contacts			= phone.top.$container.find('nav .contacts').button(function() 	{ if(user.current) { phone.showSection('contacts') }});
	phone.top.$history			= phone.top.$container.find('nav .history').button(function() 	{ if(user.current) { phone.showSection('history') }});
	
	//Unknown user
	if(!user.current) {
		phone.top.$number.find('.unknown_user').button(phone.register.hide).show();
	} else {
		phone.top.$number.find('.unknown_user').hide();
	}
};

/*
 *	Function: populate
 *	Set userdata to their fields.
 *
 *	Parameters:
 *		object user - Data to populate fields with
 */
phone.top.populate = function(user) {
	
	if(user.phoneNumber) {
		phone.top.$number.find('input.phone').val($.format.phone(user.phoneNumber));
	}
	
	if(user.credit) {
		phone.top.updateCredit(user.credit);
	} else {
		phone.top.updateCredit(0);
	}

} 

/*
 *	Function: showNumber
 *	Hides the highlight so the input is usable
 */
phone.top.showNumber = function() {
	phone.top.$number.find('input').css('z-index',4);
};

/*
 *	Function: hideNumber
 *	Sets the input back behind the highlight 
 */
phone.top.hideNumber = function() {
	phone.top.$number.find('input').css('z-index',2);
};

/*
 *	Function: showClock
 *	Show the clock, ment for during a call
 */
phone.top.showClock = function() {
	phone.top.$number.find('input').hide();
	phone.top.$clock.show();
};

/*
 *	Function: hideClock
 *	Hide the clock, bringing the display back to its normal state
 */
phone.top.hideClock = function() {
	clearInterval(phone.top.clockInterval);
	phone.top.$number.find('input.phone').show();
	phone.top.$clock.hide().html($.format.clock(0));
};

/*
 *	Function: updateClock
 *	Set the clock to a new amount of seconds and let it count from there
 *
 *	Parameters:	
 *		integer duration - amount of seconds
 *
 *	See Also:
 *		<phone.call.getStatus>
 */
phone.top.updateClock = function(duration) {
	console.log('phone.top.updateClock('+duration+')');
	clearInterval(phone.top.clockInterval);
	phone.top.clockInterval = setInterval(function() {
		phone.top.$clock.html($.format.clock(duration));
		duration ++;
	}, 1000);	
};

/*
 *	Function: updateCredit
 *	Update the amount of credit in the credit-display 
 *
 *	Parameters:
 *		integer value - amount of credit in cents
 *
 *	See Also:
 *		<phone.call.getStatus>
 */
phone.top.updateCredit = function(value) {
	console.log('phone.top.updateCredit('+value+')');
	var credit = $.format.money(value/100);
	phone.top.$credit.find('p').html(credit);
};