if(typeof Z1RHELMETS == 'undefined') {
	Z1RHELMETS = {};
}

/**
 * View
 * @author Ebobbitt
 * @classDescription This is the View class for the Z1R Helmets site.
 */
(function() {
	// VIEW CONTRUCTOR
	Z1RHELMETS.View = function() {
		
	};
	
	// PROTOTYPE REFERENCES
	// Setup Prototype Object Reference
	var View = Z1RHELMETS.View.prototype;
	
	
	// MODAL PROPERTIES
	View.mask_status = false;
	View.modal_status = false;
	
	
	// CLEAR INPUT VALUE
	View.clearInput = function(el) {
		$(el)[0].value = '';
	};
	
	
	// VIEWPORT CONTROL
	// Centers an element on the screen
	View.center = function(el) {
		el.style.position = 'absolute';
		if(el.offsetWidth || el.offsetHeight) {
			if (el.style.display == 'block') {
				el.style.left = (($(window).width() / 2) - (el.offsetWidth / 2)) + 'px';
				el.style.top = (($(window).scrollTop()) + ($(window).height() / 2) - (el.offsetHeight / 2)) + 'px';
			}
		} else {
			if (el.style.display == 'block') {
				el.style.left = (($(window).width() / 2) - ($(el).width() / 2)) + 'px';
				el.style.top = (($(window).scrollTop()) + ($(window).height() / 2) - ($(el).height() / 2)) + 'px';
			}
		}
	};
	
	// BUILD MODAL MASK
	// Display a mask over the site contents. Useful for modal boxes and disabling content.
	View.mask = function(options) {
		var mask = $('#mask')[0];
		
		// Setup default styling
		mask.style.display = 'block';
		mask.style.width = $(document).width() + 'px';
		mask.style.height = $(document).height() + 'px';
			
		// Override with options
		if (options) {
			if (options.color) {
				mask.style.backgroundColor = options.color;
			}
			if (options.opacity) {
				$(mask).css('opacity', options.opacity);
			}
		}
		this.mask_status = true;
	};
	
	
	// SCALE MODAL MASK
	// Scale the mask, useful for resize scenarios
	View.scale_mask = function() {
		if (this.mask_status === true) {
			var mask = $('#mask')[0];
			mask.style.width = $(document).width() + 'px';
			mask.style.height = $(document).height() + 'px';
		}
	};
	
	
	// HIDE MODAL MASK
	// Hide the mask, useful when close button is clicked
	View.hide_mask = function() {
		var mask = $('#mask')[0];
		var post_mask = $('#post_mask')[0];
		var modal = $('#modal')[0];
		mask.style.display = 'none';
		$(post_mask).empty();
		post_mask.style.display = 'none';
		modal.style.display = 'none';
		this.modal_status = false;
		this.mask_status = false;
	}
	
	// HIDE MODAL LOADING FEEDBACK
	// Hide the modal loading graphic, useful after ajax call has data
	View.hide_modal_loading = function() {
		var post_mask = $('#post_mask')[0];
		$(post_mask).empty();
		post_mask.style.display = 'none';
	}
	
	
	// MODAL FUNCTIONALITY
	// Build modal, set properties, request content
	View.modal = function(options) {
		var modal = $('#modal')[0];
		var v = this;
		var updateCallback = null;
		
		// Prepare modal properties
		if(options.width) {
			modal.style.width = options.width;
		}
		if(options.height) {
			modal.style.height = options.height;
		}
		if(options.style) {
			$(modal).attr('class', '');
			$(modal).addClass(options.style);
		}
		if(options.callback) {
			updateCallback = options.callback;
		}
		
		// Request modal content -- handle response.
		$.ajax({
			type: 'post',
			url: options.url,
			data: options.params,
			before: v.modal_loading(),
			success: function(o) { v.display_modal(o, updateCallback); },
			error: function(o) { v.message('Sorry there was an error.', 3); v.hide_mask(); },
			complete: function(o) { v.hide_modal_loading(); }
		});
		
	};
	
	//DISPLAY MODAL
	/* 	
	 	When a modal receives content it is passed to this function. The
	 	modal content is passed into the modal, centered, and displayed to 
	 	the user. If the content contains an element with an id of 'close_modal'
	 	a click event listener will be bound to that element -- this allows the
	 	user to close the modal and return to the normal page content.
	*/
	View.display_modal = function(o, callback) {
		var modal = $('#modal')[0];
		$(modal).html(o);
		modal.style.display = 'block';
		this.center(modal);
		this.modal_status = true;
		var v = this;
		if($('#close_modal')[0]) {
			$('#close_modal').bind('click', this, function(e){
				e.preventDefault();
				v.hide_mask();
				v.modal_status = false;
			});
		}
		
		if(callback) {
			callback();
		}
	};
	
	
	// DISPLAY MODAL MASK
	// Displays a mask to the user and shows a loading icon.
	View.modal_loading = function() {
		var post_mask = $('#post_mask')[0];
		$(post_mask).html("<span class='modalLoadingIcon'></span>");
		post_mask.style.display = 'block';
		this.center(post_mask);
		this.mask();
	};
	
	
	// DISPLAY MODAL MESSAGE
	// Display a message to the user (useful for error/success feedback)
	View.message = function(msg, time) {
		var messages = $('#messages')[0];
		time = time * 1000;
		messages.style.display = 'block';
		messages.style.opacity = 0;
		$(messages).html('<p>' + msg + '</p>');
		this.center(messages);
		
		var fade = function() {
			$(messages).animate({
				opacity: 0
			}, 'slow', 'swing', function() { 
				messages.style.display = 'none'; 
			});
		};
		
		// Callback to fade out message after x amount of time.
		var callback = function(e) {
			setTimeout(fade, time);
		};
		
		$(messages).animate({
			'opacity': 1
		}, 'slow', 'swing', callback);
	};
	
	
	// NEWSLETTER SUBMIT FEEDBACK
	View.processing_newsletter = function() {
		var div = $('#newsletterLoading')[0];
		$(div).html("<img src='http://assets-static.lemansnet.com/sites/z1rhelmets/assets/img/graphics/icons/loading.gif' />");
	};
	View.update_newsletter = function(o) {
		var div = $('#newsletterLoading')[0];
		$(div).html(o);
	};
	
	
	// DEALER SEARCH SUBMIT FEEDBACK
	View.loading_dealers = function(o) {
		var div = $('#dealerLoading')[0];
		$(div).html("<img src='http://assets-static.lemansnet.com/sites/z1rhelmets/assets/img/graphics/icons/loading.gif' />");
	};
	View.update_dealers = function(o) {
		this.clear_loading_dealers();
		var div = $('#dealerResults')[0];
		$(div).html(o);
	};
	View.dealers_error = function(o) {
		this.clear_loading_dealers();
		this.message('Sorry, but an error has occured', 2);
	};
	View.clear_loading_dealers = function() {
		var div = $('#dealerLoading')[0];
		$(div).empty();
	};
	
	/*
	 * $('.colorway').bind('mouseover', this, this.show_color); 
		$('.colorway').bind('mouseout', this, this.show_default_color);
	 *
	 *
	 */
	View.show_color = function(color) {
		$('#colorwayName').html(color);
	};
	
	View.show_default_color = function() {
		var color = $('#colorwayCurrent').html();
		$('#colorwayName').html(color);
	};
	
	// PRODUCT DETAILS COLORWAY CONTROLLER
	View.swap_colorway = function(target, rank) {
		var v = this;
		var product_id = $('#parameters .product_id')[0];
		var div = $('#fullImage')[0];
		var graphic = $('#product_graphic')[0];
		
		$('a.colorway').each(function() {
			$(this).removeClass('active');
		});
		$(target).addClass('active');
		$(div).css('height', $(div).height() + 'px');
		$(div).addClass('loading');
		$(graphic).animate({
			opacity: 0
		}, 'slow', 'swing', function() {
			var callback = function(src) {
				$(graphic).attr('src', src);
				$(div).css('height', 'auto');
				$(div).removeClass('loading');
				$(graphic).animate({
					opacity: 1
				}, 'slow', 'swing');
			};
			v.update_graphic(graphic, '/assets/inc/nav/showImage.jsp?image_type=fullsize&rank=' + rank + '&class_id=' + $(product_id).html(), callback);
		});
		 
		 if ($(target).attr('title') != '') {
		 	$('#colorwayCurrent').html($(target).attr('title'));
		 	v.show_default_color();
		 }
	};
	
	View.update_graphic = function(el, src, callback) {
		var image = new Image();
		image.onload = function(){
			callback(src);
		};
		image.src = src;
	};
	
	
	// SHOW PRODUCTS SUB-NAV
	// TODO: This function needs to be re-factored since side nav has been re-factored
	View.toggle_navigation = function(el) {
		$(el).toggleClass('sub_visible');
	};
	
	
	// FIX PNG GRAPHICS
	View.update_title = function(e) {
		var title = $('#z1rPageTitlePNG')[0];
		var style = $(title).css('backgroundImage');
		var src = null;
		try {
			src = style.match(/(.*)(assets\/.*)("\))/)[2];
		} catch(e) {
			try {
				src = style.substring(4, style.length - 1);
			} catch(e) {}
		}
		if (src) {
			title.style.backgroundImage = 'none';
			title.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='crop');";
		}	
	};
	
	View.update_png_crop = function(e) {
		var images = $('.z1rPNG');
		for(var i=0; i<images.length; i++) {
			var img = images[i];
			var style = $(img).css('backgroundImage');
			var src = null;
			try {
				src = style.match(/(.*)(assets\/.*)("\))/)[2];
			} catch(e) {}
			if (src) {
				img.style.backgroundImage = 'none';
				img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='crop');";
			}
		}	
	};
	
	View.update_fit_graphic = function(e) {
		var img = $('#fcLink img')[0];
		var src = img.src;
		if (src) {
			var link = $(img).parent()[0];
			try {
				src = src.match(/(.*)(assets\/.*)("\))/)[2];
			} catch(e) {
				try {
					src = style.substring(4, style.length - 1);
				} catch(e) {}
			}
			img.style.display = 'none';
			link.style.cursor = 'pointer';
			link.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='crop');";
		}	
	};
	
	View.update_fit_modal = function(e) {
		var img = $('#fit_content img')[0];
		var src = img.src;
		if (src) {
			var link = $(img).parent()[0];
			try {
				src = src.match(/(.*)(assets\/.*)("\))/)[2];
			} catch(e) {
				try {
					src = style.substring(4, style.length - 1);
				} catch(e) {}
			}
			img.style.display = 'none';
			link.style.height = '69px';
			link.style.cursor = 'pointer';
			link.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='crop');";
		}	
	};
	
	View.update_png_scale = function(e) {
		var images = $('.z1rPNG_scale');
		for(var i=0; i<images.length; i++) {
			var img = images[i];
			var style = $(img).css('backgroundImage');
			var src = null;
			try {
				src = style.match(/(.*)(assets\/.*)("\))/)[2];
			} catch(e) {}
			if (src) {
				img.style.backgroundImage = 'none';
				img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='scale');";
			}	
		}		
	};
	
})();