var imgOn='/i/checked.png';
    var imgOff='/i/unchecked.png';
    
    $(function(){
    // swap checkboxes for imgs
    $("input:checkbox").each(function(){            
    		$(this).css("display","none");
    		if($(this).is(":checked")){ 
     		   $(this).after($(document.createElement("img"))
     		   .attr({ src:imgOn,title:'Checkbox',id:$(this).attr("id") })
    		        .addClass("chkBoxImg"));
  		  }else{
    		    $(this).after($(document.createElement("img"))
      		  .attr({ src:imgOff, title:'Checkbox',id:$(this).attr("id") })
      		  .addClass("chkBoxImg"));
    }});
    // swap radio buttons for imgs
    $("input:radio").each(function(){            
    	$(this).css("display","none");
    	if($(this).is(":checked")){ 
     		   $(this).after($(document.createElement("img"))
     		   .attr({ src:imgOn,title:'Checkbox',id:$(this).attr("id") })
    		        .addClass("chkBoxImg").addClass($(this).attr('name')));
  		}else{
    		    $(this).after($(document.createElement("img"))
      		  .attr({ src:imgOff, title:'Checkbox',id:$(this).attr("id") })
      		  .addClass("chkBoxImg").addClass($(this).attr('name')));
    }});
    
    $("input.calc").keyup(function () {
    		//alert($(this).val());
			var i = "input#"+$(this).attr("id");
			var s = $(this).attr("src");
			var name=$(i).attr('name');
			var v = $(i).val();
			var package = $('#package_number').val();
			var item = $('#item').val();
			var id = $(this).attr("id");
			
			var totalcost = '#totalcost';
			var div = 'ul.total div.total';
			
			var last_id = 'last_' + $(this).attr('id');
			
			// add class oneoff to input box to isolate one off charges.
			if($(i).hasClass('oneoff')) {
				div = 'ul.oneoff div.total';
				var totalcost = '#oneoff';
			}
		
			$.post('/do/getcost/?i='+item+'&d='+id+'&p='+package, function(data){
				// subtract old value from total cost
				updateCost(div, package, item, id, totalcost, false, $('#'+last_id).val());
				// add new value to total cost.
				updateCost(div, package, item, id, totalcost, true, v);
				
				$('#' + last_id).val(v);
				
			});
    	}
    );
    
    // click behaviour for selection imgs
    $("img.chkBoxImg").click(function(){
        var i = "input#"+$(this).attr("id");
        var s = $(this).attr("src");
		var name=$(i).attr('name');
		var v = $(i).val();
		var package = $('#package_number').val();
		var item = $('#item').val();
		
		
		var totalcost = '#totalcost';
		var div = 'ul.total div.total';
		
		/* need to deal with oneoff charges properly, hacking for now */
		if( $(i).hasClass("oneoff") || ( $(this).attr("id") == 'WAG160N' ) ) {
			totalcost = '#oneoff';
			div = 'ul.oneoff div.total';
			
			//alert('is one off');
		}
		
		// if radio get last radio button selection
		if ($(i+':radio').val())
			var last_id = 'last_' + $(this).attr('id').substring($(this).attr('id').indexOf('_') + 1);
			
		// if the input is disabled dont swap img       
        if($(i).is(':not(:disabled)')) {
        	// turn off all other radio button imgs
	        if($(i).is(":radio"))
	        	$('img.'+name).not('img#'+$(this).attr('id') ).attr("src",imgOff);
	        		
	       	// toggle clicked img
    		if(s==imgOff) {
    			$(this).attr("src",imgOn);
    			$(i).attr("checked",true);

    			// img now on, if is radio, check previous selection and subtract from total 
    			if ($(i+':radio').val()) {
					var last_selection = $('#'+last_id).val();
					$('#'+last_id).val($(this).attr('id'));

					// if the last selection exists subtract that from the total cost
					if (last_selection)
						updateCost(div, package, item, last_selection, totalcost, false);
				}	
				updateCost(div, package, item, v, totalcost, true);
				
    		} else {
    			$(this).attr("src",imgOff);
    			$(i).attr("checked",false);	
    			
    			if($(i+':radio').val()) {
					$('#'+last_id).val('');
				}
				updateCost(div, package, item, v, totalcost, false);
				
	   		}
	    }
    });
});

function formatTitle(name) {
	//var name = $(this).attr("name");
    return '<div id=\"fancybox-title-over\">' + name + '</div>';
}

$(document).ready(function() {
	$("a.fancybox").not('.personbox').fancybox({
		
		'opacity'		: false,
		'overlayShow'	: true,
		'transitionIn'	: 'elastic',
		'transitionOut'	: 'elastic',
		'modal'			: false,
		'showCloseButton' : ($(this).hasClass('showClose') == true) ? true : false,
		'overlayColor'  : '#333',
		'titlePosition' : 'over',
		'padding'		: '18',
		'onStart'		:	function() {
			setTimeout("Cufon.replace('.cufon')", 100);
		},
		'onComplete'	:	function(){
			Cufon.replace('td.cost');
			Cufon.replace('h2');
			//alert('loaded');
			var options = {
				script:"/do/naked/density?json=true&limit=6&",
				varname:"input",
				json:true,
				maxresults:6,
				delay:10,
				timeout:10000,
				minchars:3,
				cache:false,
				callback: function (obj) { document.getElementById('densityValue').value = obj.info; }
			};
			
			var as_json = new bsn.AutoSuggest('densityInput', options);
		}
	});
	
	$("a.fancybox.personbox").fancybox({
		
		'opacity'		: false,
		'overlayShow'	: true,
		'transitionIn'	: 'elastic',
		'transitionOut'	: 'elastic',
		'modal'			: false,
		'showCloseButton' : ($(this).hasClass('showClose') == true) ? true : false,
		'overlayColor'  : '#333',
		'titlePosition' : 'over',
		'padding'		: '18',
		'titleFormat'	: function(title, currentArray, currentIndex, currentOpts) {
			var name		= currentArray[currentIndex]['attributes']['name'].value;
			var position	= currentArray[currentIndex]['attributes']['position'].value;
			var profile		= currentArray[currentIndex]['attributes']['profile'].value;
			return "<div id=\"fancybox-title-over\"><span class='name'>"+name+"</span><br class='clear'><span class='position'>"+position+"</span><br>"+profile+"</div>";
		}
	});
});


/* selector: totalcost div to update
 * item: item type to be price checked (router, data etc)
 * detail: extra item info
 * totalcost: totalcost hidden input selector
 */
function updateCost(selector, package, item, detail, totalcost, add, multipler) {
	// graps item cost
	//alert('selector: ' + selector + '\n' + 'package: ' + package + '\n' + 'item: ' + item + '\n' + 'detail: ' + detail + '\n' + 'totalcost: ' + totalcost + '\n' + 'add: ' + add + '\n' + 'multipler: ' + multipler);
	if (typeof multipler == "undefined") {
		multipler = 1;
	}
	
	$.post('/do/getcost/?i='+item+'&d='+detail+'&p='+package, function(data){
		
		if(add)
			total = (parseFloat($(totalcost).val(),2) + parseFloat(data*multipler,2));
		else
			total = (parseFloat($(totalcost).val(),2) - parseFloat(data*multipler,2));
			
		//alert('totalcost: ' + $(totalcost).val() + '\ndata: ' + data + '\ntotal: ' + total);
		$(selector).text('$'+total.toFixed(2));
		$(totalcost).val(total);
	});
}