jQuery(document).ready(function($){ 
	//Cliparts
	var inputId;
	var ua = navigator.userAgent;
	var isMobile = ~ua.indexOf('Mobile');
	var clipartWindowId = 'clipart-window';
	var clipartCategories = '<select  style="background-color:#FFFFCC; border-width:thin; border-color:#FF0000; color:#0000FF;  font-weight:bold;  margin-left:220px; border-style:solid" id="clipartCategories">'+
	'<option data-href="/clipart/celebration.html">Holiday & Celebration</option>'+
	'<option data-href="/clipart/love.html">Love / Wedding / Prom</option>'+
	'<option data-href="/clipart/animals.html" data-default="true">Animals</option>'+
	'<option data-href="/clipart/religious.html">Religious & Patriotic</option>'+
	'<option data-href="/clipart/awards.html">Awards & Banners</option>'+
	'<option data-href="/clipart/sports.html">Sports & Recreation</option>'+
	'<option data-href="/clipart/transportation.html">Transportation</option>'+
	'<option data-href="/clipart/education.html">Education & Graduation</option>'+
	'<option data-href="/clipart/flowers.html">Trees / Flowers / Scenery</option>'+
	'<option data-href="/clipart/zodiac.html">Weather & Zodiac</option>'+
	'<option data-href="/clipart/mascots.html">People & Mascots</option>'+
	'</select>';
	
	var iframeEventHandler = function() { 
		$(this).contents().find('img').click(function(){
			
			var parentTable = $(this).parents('table')[0];
			clipartName = $(parentTable).find('.thumbnail').text();
			clipartImage = $(this).attr('src');
			$('#' + inputId).val(trim(clipartName));
			$('#forimage-' + inputId).val(clipartImage);
			$('#clipart-' + inputId).attr('src', clipartImage).load().show();
			$.bdPopupClose(clipartWindowId, 'fadeOut', 300);
			return false;
		}).css('cursor','pointer');//.end().find('a,div').hide();	
	}
	
	$('.forclipart').each(function(){
		var forImage = $(this).data('forimage');
		var val = $(this).val();
		if (val) {
			$('#clipart-' + forImage).attr('src', val).show();
		}
	});
	
	$('a.cliparts, input.cliparts, button.cliparts').click(function(){
		var clipartName;
		inputId = $(this).data('forid');
		$.bdPopup({		 
			setCookie: 'blank', 
			cookieExpires: 9999, 
			width: 650, 
			height: $(window).height() - 40, 
			top: 10 + getClientSTop(), 
			offset: 0, 
			loadUrl: '/clipart/celebration.html', 
			autoClose: false, 
			autoCloseTime: 5, 
			openDelay: false, 
			openDelayTime: 60, 
			titleBarText: clipartCategories,
			blockId: clipartWindowId,
			showEffect: 'fadeIn',
			showDuration: 300,
			closeEffect: ['fadeOut', 'slideUp'],
			closeDuration: 100
		});
		$('#' + clipartWindowId).find('iframe').load(iframeEventHandler);
		return false;
	});
	
	$('#clipartCategories').live('change', function(){
		var src = $(this).find(':selected').data('href');
		$('#' + clipartWindowId).find('iframe').attr('src', src).load(iframeEventHandler);
	});
	
	//Fonts
	$('div.fonts-container').each(function(){
		var currentFontId = $(this).find('input.current-font-selected-id').val();
		var thisId = parseId(this.id, 'font-container');
		if (currentFontId) {
			$(this).find('#font-image-' + thisId + '-id-' + currentFontId).addClass('current');
		}
	});
	
	$('body').click(function(event){
		//alert($(event.target).attr('class'))
		if (!/fonts-/.test($(event.target).attr('class'))) {
			$('.fonts-container').removeClass('active');
			$('.fonts-container').find('img.font-image').not('.current').hide();
		}
	})
	
	$('div.fonts-controller').click(function(){
		var $fontsContainer = $(this).parents('.fonts-container');
		$fontsContainer.toggleClass('active');
		if ($fontsContainer.hasClass('active')) {
			$fontsContainer.find('img.font-image').show();
		} else {
			$fontsContainer.find('img.font-image').not('.current').hide();
		}
	});

	$('img.font-image').click(function(){
		var $fontsContainer = $(this).parents('.fonts-container');
		var containerId = parseId( $fontsContainer.attr('id'), 'font-container');
		var fontId = parseId( parseId(this.id, 'font-image'),  containerId + '-id');
		$fontsContainer.toggleClass('active');
		if ($fontsContainer.hasClass('active')) {
			$fontsContainer.find('img.font-image').show();
		} else {
			$fontsContainer.find('img.font-image.current').removeClass('current');
			$('#' + containerId).val( this.title );
			$('#current-font-selected-id-' + containerId).val( fontId );
			$(this).addClass('current');
			$fontsContainer.find('img.font-image').not('.current').hide();
		}
	});
	
	//Product Popup
	$('.contentItem').mousemove(function(e){
		if(isMobile) return false;
		var id = parseId (this.id, 'visible');
		var $invisible = $('#invisible-' + id);
		var invWidth = $invisible.width();
		var winWidth = $(window).width() - 10; // minus scrollbar width
		if (invWidth + e.pageX > winWidth) {
			//$invisible.css('background-color','blue');
			$invisible.css({left: winWidth - invWidth, top:e.pageY+5});
		} else {
			//$invisible.css('background-color','orange');
			$invisible.css({left:e.pageX+5, top:e.pageY+5});
		}
		$invisible.show();
		$invisible.find('.popup_images_products').width( $invisible.find('.popup_price_table').width() );
	}).mouseout(function(){
		if(isMobile) return false;
		var id = parseId (this.id, 'visible');
		$('#invisible-' + id).hide();
	});
	
	
	
});

function getClientSTop(){
	return self.pageYOffset || (document.documentElement && document.documentElement.scrollTop) || (document.body && document.body.scrollTop)
}

function trim(string)
{
	return string.replace(/(^\s+)|(\s+$)/g, "");
}

function parseId(string, prefix)
{
	return string.replace(prefix + '-', '');
}