/* 
Javascript required for every page on the site.

GUIDELINES
- When referring to a model in JavaScript always use the complete name, e.g 
  traderAdvert not advert (this is also true for CSS classes).
- When sending IDs in parameters omit the ID portion of the parameter name, 
  e.g trade not trade_id or trade_adverts not trade_advert_ids. Parameters 
  should be sent in Python format (underscores seperate words).
*/

var onReadyEvent = jQuery.Event('onready');
var afterReadyEvent = jQuery.Event('afterready');
var afterLightboxOpenEvent = jQuery.Event('afterlightboxopen');
var afterLightboxCloseEvent = jQuery.Event('afterlightboxclose');

function initiate_geolocation() {
	navigator.geolocation.getCurrentPosition(handle_geolocation_query, handle_errors);
}

function handle_errors(error) {  
	switch(error.code) {  
		case error.PERMISSION_DENIED:
		$('#near').val('');
		if ($("#location-error").length > 0){
			$('#location-error').show();
	    } else {
			$('#near').parent().append('<span id="location-error">Sorry, we can\'t find you</span>');
	    };
		$('#current-location').remove();
		$('#use_users_location').val('False');
		$('#users_location').val('');
		break;

		case error.POSITION_UNAVAILABLE:
		$('#near').val('');
		if ($("#location-error").length > 0){
			$('#location-error').show();
	    } else {
			$('#near').parent().append('<span id="location-error">Sorry, we can\'t find you</span>');
	    };
		$('#current-location').remove();
		$('#use_users_location').val('False');
		$('#users_location').val('');
		break;

		case error.TIMEOUT:
		$('#near').val('');
		if ($("#location-error").length > 0){
			$('#location-error').show();
	    } else {
			$('#near').parent().append('<span id="location-error">Sorry, we can\'t find you</span>');
	    };
		$('#current-location').remove();
		$('#use_users_location').val('False');
		$('#users_location').val('');
		break;

		default:
		$('#near').val('');
		if ($("#location-error").length > 0){
			$('#location-error').show();
	    } else {
			$('#near').parent().append('<span id="location-error">Sorry, we can\'t find you</span>');
	    };
		$('#current-location').remove();
		$('#use_users_location').val('False');
		$('#users_location').val('');
		break;
	}  
}

function handle_geolocation_query(position){
	var lat = position.coords.latitude;
	var lon = position.coords.longitude;
	$('#near').val('Using your location');
	$('#use_users_location').val('True');
	$('#users_location').val(lat + ',' + lon);
}

$(document).ready(function (ev) {
	var i = 0;
	var j = 0;
	
	// Trigger events that occur before the site defaults
	$(document).trigger(onReadyEvent);
	
	// Default events
	
	// Set-up the auto-complete
	var selected_trade = $("#trade option:selected");
	$('#trade').hide();
	
	// Build a list of trades for the auto-complete
	var tradeOptions = $('#trade option');
	var trades = [];
	var trades_lookup = {};
	for (var i = 0; i < tradeOptions.length; i++) {
		var tradeOption = $(tradeOptions[i]);
		if (tradeOption.attr('value')) {
			trades.push({
				label: tradeOption.html(),
				value: tradeOption.attr('value')
			});
			trades_lookup[tradeOption.html().toLowerCase()] = tradeOption.attr('value');
		}
	}
	
	// Sort the results for 
	function tradeSort(a, b) {
		if (a.label > b.label) { return 1; }
		return -1;
	} 
	trades.sort(tradeSort);
	
	// Remove the trade drop-down in favour of an auto-complete input
	var trade_id = $('#trade').val();
	var tradeParent = $('#trade').parent();
	$('#trade').remove();
	
	// Add a hidden field that will hold the trade ID
	tradeParent.append('<input type="hidden" id="trade" name="trade" />');
	tradeParent.parent().append('<a id="search-by-name" tabindex="2" href="/search-by-name/">Search by trader name instead?</a>');
	// Add the auto-complete input
	tradeParent.append('<input id="trade_keywords" type="text" name="trade_keywords" placeholder="Heating Engineers, Computer repair, Garages..." />');
	$("#trade_keywords").change(function (ev) {
		$("#trade").val('');
	});
	$("#trade_keywords").autocomplete(trades, {
		//autoFill: true,
		formatItem: function(item) {
			return item.label.replace('&amp;', '&');
		},
		matchContains: true,
		minChars: 2,
		width: 370
	}).result(function (ev, item) {
		$('#trade').attr('value', item.value);
	});
	
	$('#search').submit(function (ev) {
        var submitting_trade_id = $('#trade').val();
        if (!submitting_trade_id) {
            $('#trade').val(trades_lookup[$.trim($("#trade_keywords").val().toLowerCase())]);
        }
    });
	
	// If available, set the selected trade value
	if ($(selected_trade).val()) {
		$('#trade').val($(selected_trade).val());
		$('#trade_keywords').val($(selected_trade).html().replace('&amp;', '&'));
	}
	 
	// Point the trade label at trade_keywords field
	$('label[for="trade"]').attr('for', 'trade_keywords');
	
	// HTML5 placeholder support
	$('input').placeholder();
	
	// Find current location for search box
	if (navigator.geolocation) {
		$('#near').focus(function() {
			if ($("#location-error").length > 0){
				
		    } else {
				if ($("#current-location").length > 0){
					$('#current-location').show();
			    } else {
					$(this).parent().append('<a id="current-location" href="#">Click to use my location</a>');
			    };
		    };
			
			$('#current-location').bind('mousedown.trustatrader', function (ev) {
				ev.preventDefault();
				initiate_geolocation();
				$('#current-location').remove();
			});
		});
		$('#near').focusout(function() {
			$('#current-location').remove();
		});
		
		$('#near').keypress(function() {
			$('#current-location').remove();
			$('#use_users_location').val('False');
			$('#users_location').val('');
		});
		
		$('#near').bind('click.trustatrader', function (ev) {
			if ($('#use_users_location').val() == 'True') {
				$('#near').val('');
				$('#use_users_location').val('False');
				$('#users_location').val('');
			}
		});
	}
	// Set-up any banners for the page
	
	// Banner template
	var bannerTemplate = tmpl(' \
		<li id="banner-<%=id%>" class="banner"> \
			<p class="image"><a href="<%=website_url%>" rel="no-follow"><img src="/<%=image_path%>" alt="Advertisment"></a></p> \
			<p class="caption"><%=caption%></p> \
		</li>');
	
	// Find all the slots on the page
	var slots = $('.banner-slot');
	for (i = 0; i < slots.length; i++) {
		// Request the banners for this slot
		slot = $(slots[i]);
		
		// Extract the slot information
		var pageName = slot.attr('data-page');
		var slotName = slot.attr('data-banner-slot');
		var trade = slot.attr('data-trade');
		var lat = slot.attr('data-lat');
		var lon = slot.attr('data-lon');
		
		// Build the URL to request the banner information
		var data = {'page': pageName, 'slot': slotName};
		if (trade !== null & lat !== null & lon !== null) {
			data['trade'] = trade;
			data['lat'] = lat;
			data['lon'] = lon;
		}
		
		// Request the banner information
		$.ajax({url: '/json/banners/', 
				cache: false, 
				context: slot, 
				data: data, 
				dataType: 'json', 
				success: function (banners) {
			
			// Generate the HTML for the banners
			var bannerHTML = '';
			for (i = 0; i < banners.length; i++) {
				bannerHTML += bannerTemplate(banners[i]);
			}
			
			// Insert the banners in to the page
			$(this).append(bannerHTML);
			
			// Add click tracking to the banners
			for (var i = 0; i < banners.length; i++) {
				var bannerId = banners[i].id;
				var banner = $('#banner-' + bannerId);
				
				$(banner).find('a').bind('click.trustatrader', function (ev) {
					ev.preventDefault();
					
					var slot = $(this).closest('.banner-slot');
					var lat = slot.attr('data-lat');
					var lon = slot.attr('data-lon');		  
					var page_name = slot.attr('data-page');
					var slot_name = slot.attr('data-banner-slot');
					var trade = slot.attr('data-trade');
					var data = {'banner': bannerId, 'page': pageName, 'slot': slotName};
					if (trade !== null & lat !== null & lon !== null) {
						data['trade'] = trade;
						data['lat'] = lat;
						data['lon'] = lon;
					}					 
					
					// Track the click
					$.ajax({url: '/json/track-banner-clicks/', 
							cache: false, 
							context: this,
							data: data,
							dataType: 'json', 
							success: function (result) {
						
						// Forward the visitor to their location
						location = $(this).attr('href');   
					}});
				});
			}
		}});
	}
	
	// Add click tracking to trader advert
	var traderAdvertWebsiteLinks = $('.trader-advert-website-link');
	for (i = 0; i < traderAdvertWebsiteLinks.length; i++) {
		var traderAdvertWebsiteLink = $(traderAdvertWebsiteLinks[i]);
				
		$(traderAdvertWebsiteLink).bind('click.trustatrader', function (ev) {
			ev.preventDefault();
			
			var traderAdvertId = $(this).attr('data-trader-advert-id');
			var view = $(this).attr('data-view');

			// Track the click
			$.ajax({url: '/json/track-advert-website-referrals/', 
					cache: false, 
					context: this,
					data: {'trader_advert': traderAdvertId, 'view': view},
					dataType: 'json', 
					success: function (result) {
				
				// Forward the visitor to their location
				location = $(this).attr('href');   
			}});
		});
	}
	
	// Text A Trader Lightbox
	$('li.sms > a').bind('click.trustatrader', function (ev) {
        ev.preventDefault();
        if ($(document).data('textTraderActive.trustatrader')) {
            return;
        }
        $(document).data('textTraderActive.trustatrader', true);
        
        // Check if #modal-screen and #modal exist, if not create them
        if ($("#modal-screen, #modal").length > 0){
		    $('#modal-screen, #modal').show();
	    } else {
		    $('body').append('<div id="modal-screen"></div><div id="modal"></div>');
	    };
	  
	    // Set the Trader Advert ID and Company Name values
	    $('#modal').data('traderAdvertId.trustatrader', $(this).attr('data-trader-advert-id'));
	    $('#modal').data('companyName.trustatrader', $(this).attr('data-company-name'));
	    $('#text-trader').remove();

	    $('#modal').load('/media/html/modal-text-trader.html', function() {
            // Assign tradver advert ID and company name to variables and add them to the HTML
		    var companyName = $(this).data('companyName.trustatrader');
		    var traderAdvertId = $(this).data('traderAdvertId.trustatrader');
		    $('#lightbox-company-name').text(companyName);
			
			// Populate form with localStorage if exists, else use cookies
			if(window['localStorage']){
				if(localStorage['name']){
					$('#text-trader input[name="name"]').val(localStorage.getItem('name'));
				}
				if(localStorage['telephone']){
					$('#text-trader input[name="telephone"]').val(localStorage.getItem('telephone'));
				}
				if(localStorage['city']){
					$('#text-trader input[name="city"]').val(localStorage.getItem('city'));
				}
				if(localStorage['postcode']){
					$('#text-trader input[name="postcode"]').val(localStorage.getItem('postcode'));
				}
				if(localStorage['message']){
					$('#text-trader textarea[name="message"]').val(localStorage.getItem('message'));
				}
			} else {
				function readCookie(name) {
					var nameEQ = name + "=";
					var ca = document.cookie.split(';');
					for(var i=0;i < ca.length;i++) {
						var c = ca[i];
						while (c.charAt(0)==' ') c = c.substring(1,c.length);
						if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
					}
					return null;
				}
				var cookieName = readCookie('name')
				if (cookieName) {
					$('#text-trader input[name="name"]').val(cookieName);
				}
				var cookieTelephone = readCookie('telephone')
				if (cookieTelephone) {
					$('#text-trader input[name="telephone"]').val(cookieTelephone);
				}
				var cookieCity = readCookie('city')
				if (cookieCity) {
					$('#text-trader input[name="city"]').val(cookieCity);
				}
				var cookiePostcode = readCookie('postcode')
				if (cookiePostcode) {
					$('#text-trader input[name="postcode"]').val(cookiePostcode);
				}
				var cookieMessage = readCookie('message')
				if (cookieMessage) {
					$('#text-trader textarea[name="message"]').val(cookieMessage);
				}
			}
			
		    $('#text-trader input[name="trader_advert"]').val(traderAdvertId);
		    $('#sending').css('display', 'none');
		        // Create captcha
		        Recaptcha.create('6LdQp8YSAAAAALY0QBXrmuqGmt6tfu3bvdbehu6I',
			    'recaptcha_widget',
			    {theme: 'custom'}
			);
		    $(document).trigger(afterLightboxOpenEvent);
		  
		    // Setup binding for close link
		    $('.close > a').bind('click.trustatrader', function (ev) {
			    ev.preventDefault();
			    $('#modal-screen, #modal').fadeOut(500);
				Recaptcha.destroy();
			    // Kills miscillaneous iframe generated by reCaptcha
			    if ($('iframe').length > 0) {
			        $($('iframe')[$('iframe').length - 1]).remove();
			    }
		        $(document).data('textTraderActive.trustatrader', false);
		        $(document).trigger(afterLightboxCloseEvent);
		    });
		
		    // Form submitting
		    $('#text-trader form').bind('submit.trustatrader', function (ev) {
		        ev.preventDefault();
		        if ($(document).data('textTraderNoSubmit.trustatrader')) {
	                return;
	            }
		        $(document).data('textTraderNoSubmit.trustatrader', true);
		        
	            $('#sending').show();
		        $('#send').hide();
		        $('#text-trader > h1').html('Text trader <span>-  There is no charge for using this servic</span>');
			    $('#text-trader > h1').removeClass('error');
			    
				// Set localStorage for form values if browser supports localStorage, else use cookies
				var nameVal = $('#text-trader input[name="name"]').val();
				var telephoneVal = $('#text-trader input[name="telephone"]').val();
				var cityVal = $('#text-trader input[name="city"]').val();
				var postcodeVal = $('#text-trader input[name="postcode"]').val();
				var messageVal = $('#text-trader textarea[name="message"]').val();
				
				if(window['localStorage']){
					localStorage.setItem('name', nameVal);
					localStorage.setItem('telephone', telephoneVal);
					localStorage.setItem('city', cityVal);
					localStorage.setItem('postcode', postcodeVal);
					localStorage.setItem('message', messageVal);
				} else {
					function createCookie(name,value,days) {
						if (days) {
							var date = new Date();
							date.setTime(date.getTime()+(days*24*60*60*1000));
							var expires = "; expires="+date.toGMTString();
						}
						else var expires = "";
						document.cookie = name+"="+value+expires+"; path=/";
					}
					createCookie('name',nameVal,365)
					createCookie('telephone',telephoneVal,365)
					createCookie('city',cityVal,365)
					createCookie('postcode',postcodeVal,365)
					createCookie('message',messageVal,365)
				}
				
			    var formData = {
	                'trader_advert': $('#text-trader input[name="trader_advert"]').val(), 
			        'name' : $('#text-trader input[name="name"]').val(),
			        'telephone' : $('#text-trader input[name="telephone"]').val(),
				    'city' : $('#text-trader input[name="city"]').val(),
				    'postcode' : $('#text-trader input[name="postcode"]').val(),
				    'message' : $('#text-trader textarea[name="message"]').val(),
				    recaptcha_challenge_field: Recaptcha.get_challenge(),
				    recaptcha_response_field: Recaptcha.get_response(),
				    json: 1
			    }
			    
			    $.ajax({
			        type: 'POST',
			        cache: false,
			        url: '/text-trader/',
			        data: formData,
			        dataType: 'json',
			        success: function (data) {
			            if (data.status === 'success') {
				            // Sent
					        $(document).data('textTraderActive.trustatrader', false);
					        $('#text-trader > h1').addClass('success');
					        $('#text-trader > h1').html('Success <span>- Your message has been sent</span>');
					        $('#modal').oneTime(3000, 'text-trader-success', function (event) {
			                    $('#modal-screen, #modal').fadeOut(500);
			                    $(document).data('textTraderNoSubmit.trustatrader', false);
					        });
				        } else {
            	            $('#sending').hide();
            		        $('#send').show();
			    
					        $('#text-trader form').unbind('submit.nosubmit.trustatrader');
					        $('#text-trader > h1').addClass('error');
					        $('#text-trader > h1').html('Error <span>- Your message has not been sent</span>');
					        Recaptcha.destroy();
					        Recaptcha.create('6LdT7MISAAAAAJ66L9m34fC-Dff9XRmNz1_1DYRD',
						        'recaptcha_widget',
						        {theme: 'custom'}
						    );
					        if (data.field_name == 'captcha') {
						        $('#recaptcha_widget').addClass('error');
					        } else {
						        $('#text-trader input[name="' + data.field_name + '"], #text-trader textarea[name="' + data.field_name + '"]').closest('.field').addClass('error');
					        }
					        $(document).data('textTraderNoSubmit.trustatrader', false);
				        }
			        }
			    });
		    });
	    });
	});

	// Trigger events that occur after the site defaults
	$(document).trigger(afterReadyEvent);
});
