// Kindly borrowed from the awsum dudes at a certain massive vc site
// -- VoucherInit --
// Insert the 'What Just Happened' Text
// We insert this with Javascript so it's no cluttering up the HTML
// as it's repeated so many times on the page
(function($) {
	$.fn.extend({
		voucherInit: function(config) {	
		
			return this.each(function() {
			
				var theObject = $(this);
				var theCodeBox = theObject.parent().find('.code-box');
				var merchantName = theCodeBox.parent().parent().parent().attr('name');
				var voucherCode = theCodeBox.find('strong').text();
				var link = theCodeBox.attr('href');
			
			
				// If the code is over 18 characters, we need to reduce the font size
				if (voucherCode.length > 8) {
					theCodeBox.addClass('small')
				}
						
				var whatJustHappened = '<div class="what-just-happened"><h4>What just happened?</h4><p>The ' + merchantName + ' web site has been been opened in a new window ready for you to shop, it is underneath the current one. To redeem the discount, enter the code <strong>' + voucherCode + '</strong> when you reach the checkout.</p><p>If the website did not open <a href="' + link + '" target="_blank">please click here</a>.</p></div>';
			
				theObject.parent().parent().find('.code-wrapper').after(whatJustHappened);
			
			}) // end this.each function
			
		} // end function(config)
	}) // end $.fn.extend
}) (jQuery);

// -- VoucherClick --
// This baby does the funky stuff when the user clicks to reveal the voucher code
(function($) {
	$.fn.extend({
		voucherClick: function(config) {	
		
			return this.each(function() {
			
				// What is the objects parent?
				var theObject = $(this);				
				var theParent = theObject.parent().parent();
				
				theObject.click(function() {
								
					// Revealed codes have a light yellow background
					// First we remove the background of any currently selected vouchers			
					$('.selected-voucher').css('backgroundColor','#fff').removeClass('selected-voucher');		
					
					// Now we add the yellow background. We have to check what was clicked as it affects
					// how far up the DOM tree the voucher DIV starts
					if ($(this).hasClass('the-image')) {	
						// We also must check if we are on an indiviual page with an expired voucher,
						// because the yellow background can overlap the left hand edge of the voucher
						if (theParent.parent().hasClass('individual-expired')) {						
						} else {														
						theParent.css('backgroundColor','#ffffee').addClass('selected-voucher');
						}
					// Same again, if it's not an image
					} else {
						if (theParent.parent().parent().hasClass('individual-expired')) {						
						} else {														
						theParent.parent().css('backgroundColor','#ffffee').addClass('selected-voucher');													
						}
					}
					
					// Check to see if the voucher has alread been revealed - we only want to run this
					// if it hasn't yet been clicked				
					if (!theParent.data('voucherRevealved')) {	

						// Make a note that this voucher has been clicked
						theParent.data('voucherRevealved', true)
						
						// Make a note of the voucher code and create the revealed code module			
						var thisCode = theParent.find('strong').html();
						
						// If the code is over 18 characters, we need to reduce the font size
						if (thisCode.length > 8) {
							thisCode = '<span class="revealedVoucherCode small">' + thisCode + '</span>';
						} else {
							thisCode = '<span class="revealedVoucherCode">' + thisCode + '</span>';						
						}
						
						// Fade out the initial module and fade in the revealed voucher module
						theParent.find('.code-wrapper').fadeOut('normal', function() {
							// If it's an individual page there is no H3
							if (theParent.find('h3').length == 0){
								// So we add the revealed module after the dates
								theParent.find('.dates').after('<div class="revealedVoucher">' + thisCode + '</div>');
							} else {
								theParent.find('h3').after('<div class="revealedVoucher">' + thisCode + '</div>');
							}
							theParent.find('.revealedVoucher').fadeIn();
						})
					}
					
					// Open the merchant link in a new window
					var mer_window = window.open(theObject.attr('href'), '_blank', 'toolbar=1,location=1,directories=1,scrollbars=1,resizable=1,status=1,menubar=1');
					
					// Where browsers support it, let's pop this new window BEHIND the current window
					if (typeof mer_window === "object")	{
						mer_window.blur();
					}
					
					// Reveal the What Just Happened Text, which was set up in the VoucherInit function
					theParent.find('.what-just-happened').slideDown();
					
					// Don't open the link in this current window
					return false;
		
				}); // end theObject click function
			}) // end this.each function
		
		} // end function(config)
	}) // end $.fn.extend

}) (jQuery);

$(function () {

	// Let the DOM know we're using Javascript
	$('body').addClass('js');

	function elementSupportsAttribute(element,attribute) {
		var test = document.createElement(element);
		if (attribute in test) {
			return true;
		} else {
			return false;
		}
	}

	// Make those voucher buttons work :)
	$('.revealbutton').voucherInit();
	$('.click-reveal').voucherClick();
	
	// Add in our nice 'Exclusive' sash on images
	var exclusiveSash = '<span class="exclusive-sash"></span>';
	$('.exclusive').before(exclusiveSash);
});
