var PHONE_REGEXP = /^[0-9 \(\)\-\+]+$/;

var numbers = {

	init: function() {
	
		//add handlers
		$$('#numbers div.number').each( function(elm) {
		
			elm.observe( 'click', numbers.choosePlan )
		
		});
	
	},
	
	choosePlan: function(e) {
	
		e.stop();
		
		var elm = e.findElement();
		if( elm.tagName.toUpperCase() != 'DIV' ) elm = elm.up('div');
		
		//don't do anything for numbers already added to basket
		if( elm.hasClassName('number-added') ) return;
		
		numbers.current = elm;
		
		var number = elm.down('span.number').innerHTML;
		var basketLink = $('planBasket');
		var backLink = $('planCancel');
		
		basketLink.stopObserving( 'click' );
		basketLink.observe( 'click', numbers.addToBasket );
		
		backLink.stopObserving( 'click' );
		backLink.observe( 'click', numbers.hidePlan );
		
		$('theNumber').update( number );
		
		//get coords of element and position plan box
		var coords = elm.positionedOffset();
		var t = coords.top - 20;
		var l = coords.left -10;
		$('plan-box').show().setStyle( 'top: ' + t + 'px; left: ' + l + 'px;' );
		cover.show();
	
	},
	
	hidePlan: function() {
	
		$('plan-box').hide();
		cover.hide();
	
	},
	
	addToBasket: function() {

		basketLink = $('planBasket');
		plan = $F('planSelect');
		fwdNumber = $F('planFwdNumber');
		price = numbers.current.down('span.thePrice').innerHTML;
		price =  parseFloat( price.toLowerCase() == 'free' ? 0 : price.replace( '£', '' ) ).toFixed(2); //convert to number
		number = numbers.current.down('span.number').innerHTML;
		
		//fix for iphones which corrupt numbers to number links
		if ( number.match( /^<a/ ) ) number = number.replace( /^<a.+>(.+)<\/a>$/, '$1' );
		
		type = $F('numberType');
		
		//check forwarding number is valid
		if( !fwdNumber.match( PHONE_REGEXP ) ) {
			alert('Please enter a valid telephone number to forward to');
			return;
		}

		basketLink.stopObserving( 'click' );	
		
		//if the plan selected is value then show yet another popup!
		if( plan == 'value_plan' ) {
		
			cover.show();
			
			var pbpo = $('plan-box').positionedOffset();
			
			var valuePlanPopup = new Element('div');
			$('docbody').insert( valuePlanPopup );
			valuePlanPopup.setStyle(
				'width: 150px; padding: 10px; background: #fff; border: 1px solid #ddd; position: absolute; z-index: 11; ' + 
				'top: ' + pbpo.top + 'px; left: ' + pbpo.left + 'px; height: ' + ( $('plan-box').getHeight() - 20 ) + 'px;'
			).update(
				'For all <strong>ADDITIONAL</strong> numbers ordered, please choose the <strong>AGREED RATES</strong> call plan ' + 
				'when selecting your numbers. <br /><br /><a href="#" class="pink">Continue &gt;</a>'
			);
			
			//when continue is clicked....
			valuePlanPopup.down('a').observe( 'click', function(e) {
			
				e.stop();
				
				//...remove popup and continue adding to basket
				valuePlanPopup.remove();
				numbers.addToBasket2();
			
			} );
		
		//otherwise continue adding to basket
		} else {
		
			numbers.addToBasket2();
		
		}
		
	},
	
	addToBasket2: function() {
		
		$('plan-box').hide();
		$('popupCover').setStyle( 'background: #999 url(images/loading.gif) center no-repeat' );
		
		//update basket via AJAX
		new Ajax.Request( 'addToBasket.php', {
			method: 'get',
			parameters: 'number=' + number + '&type=' + type + '&plan=' + plan + '&price=' + price + '&fwdNumber=' + fwdNumber,
			onSuccess: function(t) {
			
				if( t.responseText == 'FAIL' ) {
					alert('Sorry there was an error, please try again.')
					return;
				}
				
				//if basket is empty clear empty msg and show totals
				if( $('basketEmptyMsg') ) {
					$('basketEmptyMsg').hide();
					$('basketTotals').show();
					$('checkoutBtn').show();
				}

				//add to basket via JS (get HTML from AJAX script)
				var newLine = new Element( 'div', { className: 'basketitem' } ).update( t.responseText );
				$('basketItems').insert( newLine );
				
				numbers.hidePlan();
				numbers.reserve();
				
				//dont carry on if agreed rates
				if( plan != 'agreed_rates' ) {
				
					//update totals
					var basketTotalSetup = parseFloat( $('basketTotalSetup').innerHTML.replace( /£/, '' ) );
					var basketTotalMonthly = parseFloat( $('basketTotalMonthly').innerHTML.replace( /£/, '' ) );
					
					var allBasketItems = $$('#basketItems .basketitem');
					var lastItem = allBasketItems[ allBasketItems.length - 1 ];
					
					var setupCost = lastItem.down('.b_setup').innerHTML;
					var monthlyCost = lastItem.down('.b_monthly').innerHTML;
					var setupCost = parseFloat( setupCost.toLowerCase() == 'free' ? 0 : setupCost.replace( /£/, '' ) );
					var monthlyCost = parseFloat( monthlyCost.toLowerCase() == 'free' ? 0 : monthlyCost.replace( /£/, '' ) );
					
					$('basketTotalSetup').update( '£' + ( basketTotalSetup + setupCost ).toFixed(2).toString() );
					$('basketTotalMonthly').update( '£' + ( basketTotalMonthly + monthlyCost ).toFixed(2).toString() );
				
				}
				
				//show options
				callOptions.edit( number, newLine.down('.basketLinks').down('a',1) );
				
			}
		});
	
		return;
	
	},

	removeFromBasket: function( number, elm ) {
	
		if( !confirm( 'Really remove this number?' ) ) return;
		
		var basketItem = elm.up('basketitem');
		
		//update basket via AJAX
		new Ajax.Request( 'removeFromBasket.php', {
			method: 'get',
			parameters: 'number=' + number,
			onSuccess: function(t) {
			
				if( t.responseText == 'FAIL' ) {
					alert('Sorry there was an error, please try again.')
					return;
				}

				//reload page
				location.reload();
				
			}
		});
	
	},
	
	reserve: function() {
	
		numbers.current.addClassName('number-added');
		numbers.current.down('.price').update('This is in your basket');
	
	}

}

document.observe( 'dom:loaded', numbers.init );


//options functions

var callOptions = {
	
	edit: function( number, elm ) {
	
		var updateLink = $('optionsUpdate');
		var backLink = $('optionsCancel');
		numbers.currentOptionNumber = number;
		
		updateLink.stopObserving( 'click' );
		updateLink.observe( 'click', callOptions.update );
		
		backLink.stopObserving( 'click' );
		backLink.observe( 'click', callOptions.hide );
		
		$('theNumber2').update( number );
		
		callOptions.place(true);
		Event.observe( window, 'resize', function() { callOptions.place(false) } );
		Event.observe( window, 'scroll', function() { callOptions.place(false) } );
		
		
		//get current options via AJAX
		new Ajax.Request( 'getOptions.php', {
			method: 'get',
			parameters: 'number=' + number,
			onSuccess: function(t) {
			
				if( t.responseText == 'FAIL' ) {
					alert('Sorry there was an error, please try again.')
					numbers.hidePlan();
					return;
				}
					
				//clear checkboxes
				$$('#solutions-box input[type=checkbox]').each( function(checkbox) {
					checkbox.checked = false;
				});

				if( t.responseText != '' ) {
					
					var currentOptions = t.responseText.split(',');
					
					//populate checkboxes
					currentOptions.each( function(option_id) {
						if( $( 'option' + option_id ) )	$( 'option' + option_id ).checked = true;
					});
				
				}
								
				//show solution box		
				$('solutions-box').show();
				cover.show();
				
			}
		});	
		
	},
	
	place: function(init) {
	
		if( !$('solutions-box') ) return;
	
		//get coords of element and position plan box
		var vd = document.viewport.getDimensions();
		var vo = document.viewport.getScrollOffsets()
		var t = ( vd.height / 2 ) + vo.top - ( $('solutions-box').getHeight() / 2 );
		var l = ( vd.width / 2 ) - 150;
		
		setTimeout( function() {
			$('solutions-box').setStyle( 'top: ' + t + 'px; left: ' + l + 'px;' );
		}, init ? 0 : 200 );
	
	},
	
	update: function() {

		var updateLink = $('optionsUpdate');
		updateLink.stopObserving( 'click' );
	
		//get selected options
		var options = [];
		$$('#solutions-box input[type=checkbox]').each( function(checkbox) {
			if( checkbox.checked ) options.push( $F(checkbox) );
		});
		options = options.join(',');
	
		//update current options via AJAX
		new Ajax.Request( 'updateOptions.php', {
			method: 'get',
			parameters: 'number=' + numbers.currentOptionNumber + '&options=' + options,
			onSuccess: function(t) {
			
				if( t.responseText == 'FAIL' ) {
					alert('Sorry there was an error, please try again.')
					return;
				}
				
				location.reload();
				
			}
		});		
	
	},
	
	hide: function() {
	
		$('solutions-box').hide();
		cover.hide();
	
	}

}


//cover functions
var cover = {
	
	show: function() {
	
		var popupCover = new Element( 'div', { id: 'popupCover', style: 'position: absolute; top: 0; left: 0; background: #999;' } );
		$('docbody').insert( popupCover );
	
		popupCover.setOpacity(0.6);
		cover.size();
		Event.observe( window, 'resize', cover.size );
		Event.observe( window, 'scroll', cover.size );
		
	},
	
	hide: function() {
	
		Event.stopObserving( window, 'resize', cover.size );
		Event.stopObserving( window, 'scroll', cover.size );
		$('popupCover').remove();
	
	},
	
	size: function() {
	
		if( !$('popupCover') ) return;
	
		var vp = document.viewport.getDimensions();
		var db = $('docbody').getDimensions();
		var w = Math.max( vp.width, db.width );
		var h = Math.max( vp.height, db.height + 20 ); //not sure why the 20 is needed, extra padding/margin coming from somewhere though
		
		$('popupCover').setStyle( 'width: ' + w + 'px; height: ' + h + 'px;' )
	
	}

}




//make sure basket is always in view
if( location.href.match(/numbers(\?.+)?$/ ) ) {
	document.observe( 'dom:loaded', function() { moveBasket(true) } );
	Event.observe( window, 'resize', function() { moveBasket(false) } );
	Event.observe( window, 'scroll', function() { moveBasket(false) } );
}

function moveBasket(init) {

	var vo = document.viewport.getScrollOffsets();
	var newtop = vo.top - 540;
	var basketh = $('basket').getHeight();
	var bodyh = $('lhc').getHeight();
	var marginh = parseInt( $('basket').getStyle( 'margin-top' ), 10 );
	
	if( newtop + basketh < bodyh - 50 || init ) {
		scrollBasket = setTimeout( function() {
			$('basket').setStyle( 'top: ' + ( newtop > 0 ? newtop : 0 ) + 'px' );
		}, 200 );
	}

}


//green i info popup
function showTableInfo() {

	cover.show();
	$('table_info').show();
	$('popupCover').observe( 'click', hideTableInfo );

}

function hideTableInfo() {

	$('table_info').hide();
	$('popupCover').stopObserving( 'click', hideTableInfo );
	cover.hide();

}


//green buttons
function toggleWhichPlan(elm) {

	if( $('uses-and-benefits').getStyle( 'display' ) == 'block' ) {
	
		$('uses-and-benefits').hide();
		$('uabBtn').down().src = 'images/buttons/uses-and-benefits.png';
	
	} else {
	
		$('uses-and-benefits').show();
		$('uabBtn').down().src = 'images/buttons/uses-and-benefits-close.png';
		
		$('which-plan').hide()
		$('wpBtn').down().src = 'images/buttons/which-plan.png';
	
	}

}

function toggleUsesAndBenefits(elm) {

	if( $('which-plan').getStyle( 'display' ) == 'block' ) {

		$('which-plan').hide()
		$('wpBtn').down().src = 'images/buttons/which-plan.png';
		
	} else {
	
		$('which-plan').show()
		$('wpBtn').down().src = 'images/buttons/which-plan-close.png';
		
		$('uses-and-benefits').hide();
		$('uabBtn').down().src = 'images/buttons/uses-and-benefits.png';
		
	}
	
}
	
	

