Learn how to use jQuery at the Blog

Jolet Beachwear « visit

  • Added 7 months ago
  • 396 Lines of Code shown
  • 2 Links of Interest
http://jolet.eu
This is my Source Code and I don't want to show it here
View Source Code only (as overlay)
// That code snippet belongs to Jolet  Beachwear - http://jolet.eu

//catch all alerts an do them later...
var foundOnloadAlerts = new Array();
var alert = function(str){
	foundOnloadAlerts[foundOnloadAlerts.length] = str;
}

//uniqid
var uid = (
	function(){
		var id=0;
		return function(){
			return id++ ;
		};
	}
)();

//emulate popup function...
var popWindow = function(u,w,h){
	e = u.substring(u.lastIndexOf('.')+1).toLowerCase();
	if(e == 'png' || e == 'gif' || e == 'jpg')
		popEl = $("<div class=\"popWindowDiv clear\" style=\"display:block;\"><img src=\""+ u +"\" width=\"" + w + "\" height=\"" + h + "\" border=\"0\" /></div>",{overlay:20});
	else
		popEl = $("<div class=\"popWindowDiv clear\" style=\"display:block;\"><iframe src=\""+ u +"\"  width=\"" + w + "\" height=\"" + h + "\" border=\"0\" frameborder=\"0\"></iframe></div>",{overlay:20});
	popEl.modal({
		onOpen: function (dialog) {
					dialog.overlay.fadeIn('slow', function () {
						dialog.container.slideDown('slow', function () {
							dialog.data.fadeIn('slow'); // See Other Notes below regarding
													   // data display property and
													   // iframe details
						});
					});
				},
		onClose: function (dialog) {
					dialog.data.fadeOut('slow', function () {
					  dialog.container.slideUp('slow', function () {
						dialog.overlay.fadeOut('slow', function () {
						  $.modal.close(); // must call this to have SimpleModal
										   // re-insert the data correctly and
										   // clean up the dialog elements
						});
					  });
					});
				}
	});
	$("#modalContainer").css('height',h).css('width',w).css('margin-left',(w / 2) * -1);
}


//init scripts
$(document).ready(function(){

	//include function to the global scoop
	$('head').append('<script src="/domains/jolet.eu/js/alert.js" type="text/javascript"></' + 'script>');
	
	//show all found alerts
	if(foundOnloadAlerts.length > 0){
		$.each(foundOnloadAlerts,function(){
			alert(this);
		});
	}
});



/**
* All common JS for JOLET frond-end
*	by: me@daantje.nl
*
* Please note; this is my first jquery test... so the source is a little bit messy...
*/

var backgrImg = new Array();
var backgrImgPos = 0;
var doDrawup = false;
var backgrImgActive = 'down';
var backgrImgTimeout = null;
var loadingContent = false;
var screensaverTimeout = 100000;
var lastContentPath = '';
var mycarousel_itemList = [{}];
var fadedThumbs = '';
var selectedWidth = '';
var selectedLength = '';
var myIDs = new Array();
var collectionButtonID = 0;
var history_hrefs = new Array(); 

//javascript is missing the trim method?!
String.prototype.trim = function(){
	return this.replace(/^\s*(\S*(\s+\S+)*)\s*$/,"$1");
}



//draw up ui
$(document).ready(function(){


    // run this when the HTML is done downloading
	$("#content").before("<div id=\"loading\"><img src=\"/domains/jolet.eu/images/loader.gif\" width=\"220\" height=\"19\" alt=\"\" /><br />Please wait while loading...</div>");

	//restart anim when top logo is clicked
	$("#logo").click(function(){
		if(!$("#content_back").hasClass('active')){
			resetBackgroundFader(300);
		}
	});

	/**
    *	MENU STUFF
	*/
	//hide all submenus
	$("#menu ul li ul").hide();


    /**
    * DRAW UP ANIMATION
    */


	changeLayout();

});


//fade in/out all items that are in wizard our selection
function selectMyCollection(myIDs){
	//do something
	$(".collection_module .collItem_border").each(
		function(){
			//fade items...
			i = $(this).attr('id').replace('Row','');
			$(".collection_module ." + i).not($(".collection_module_moreInfo ." + i)).fadeTo('fast',myIDs[i] ? 1.0 : 0.2); //module listing items
		}
	);
}

//load content
function loadContent(url){
	if(loadingContent == false){
		loadingContent = true;
		lastContentPath = url;

		//check if background fader is running... If so, kill it.
		if($("#content_back").hasClass('active')){
			$(backgrImgActive == 'up' ? "#content_back" : "#content_back_copy").fadeOut(2000,function(){
	        	//$("#content_front").show();
				$("#content_back, #content_back_copy").removeClass('active').css('background-image','none');
			});
		}

		//get next page with nice fades and preload screen...
		$("#content_back").removeClass('active');
		$("#content").css('height','528px');
		$("#content_front").css('height','528px').css("overflow","hidden").show(0);
//		$("#content").fadeOut(2000,function(){
			$("#loading").fadeIn(500,function(){
/*				$.get("/domains/jolet.eu/content.php?path=" + url,function(data){
                  	$("#content").html(data);*/
				$("#content").load("/domains/jolet.eu/content.php?",{path:url},function(){
					changeLayout();

				    //fade in new content
// 					$("#content").css('height','528px').fadeIn("fast");
					$("#loading").fadeOut("fast",function(){
			        	$("#content_front").show();
						if(document.all)
							$("#content").css("overflow","auto");
						else
							$("#content_front").css("overflow-y","auto");
						//$("#content").fadeTo("fast",1.0);
						loadingContent = false;
					});
				});
			});
		//});
	}
	return false;
}

function changeLayout(){
	//change collection module when loaded...
	if($(".collection_module").html() || $(".shoppingcart_module").html()){
		//nice round corners...
		$(".collection_module .collItem,.shoppingcart_module .collItem").corner("round 5px").parent().css("padding",'1px').corner("round 6px");

		//shipping address
		$("input#billing_same_address").click(function(){
			if($(this).is(':checked'))
				$(".shoppingcart_module .shipping_address").css('display','none');
			else
				$(".shoppingcart_module .shipping_address").css('display','block');
		});
		if($("input#billing_same_address").is(':checked'))
			$(".shoppingcart_module .shipping_address").css('display','none');
		else
			$(".shoppingcart_module .shipping_address").css('display','block');
		
		//listing item hover and click
		$(".collection_module .collItem").not($(".collection_module_moreInfo .collItem")).hover(
			function(){
				$(this).parent().css("background-color","#000");
			},
			function(){
				$(this).parent().css("background-color","#666");
			}
		).click(
			function(){
				//loadContent($(this).find("a").attr("href"));
				self.location.href = $(this).find("a").attr("href");
				return false;
			}
		);
	}

	//change icons and change clicks
	var files = new Array('ai','avi','bmp','cs','dll','doc','exe','fla','js','mdb','mp3','pdf','ppt','rdp','swf','swt','txt','vsd','xls','xml','zip');
	$("#content a[href]").each(function(){
		if(!$(this).find('img').length){
			p = $(this).attr("href").split('.');
			e = p[p.length - 1].toLowerCase();
			for(i in files){
				if(files[i] === e){
					$(this).addClass('inline_icon icon_' + e).attr('target','_blank');
				}
			}
		}
	});

	var img = new Array();
	$(".collection_module_moreInfo .extra_thumb a").each(function(){
		w = 640;
		h = 480;
		
		u = $(this).attr('href');
		$(this).attr('oldhref',u);
		var id = u.substring(u.lastIndexOf('/')+1,u.lastIndexOf('.')).toLowerCase() + '_' + uid();
		e = u.substring(u.lastIndexOf('.')+1).toLowerCase();
		
		$(this).attr('id',id);
		if(e == 'png' || e == 'gif' || e == 'jpg'){
			img[id] = new Image();
			img[id].onload = function(){
				img[id].onload = null;
				w = img[id].width;
				h = img[id].height;
				$(".collection_module_moreInfo .extra_thumb a").click(function(){
					id = $(this).attr('id');
					popWindow($(this).attr('oldhref'),img[id].width,img[id].height);
					return false;
				});
			}
			img[id].src = u;
		}
	});

	//change all forms...
	changeForms();
}

function changeForms(){
	$("#content form").submit(function(){
		if($(this).attr('target') == 'form_popup'){
			//post to popup, build it...
			popWindow('',400,500);
			
			$.get('/domains/jolet.eu/content.php', {killsession:1});
			return true;
		}else if(!$(this).attr('target')){
			//own post
			var queryString = $(this).formSerialize(); 
	
			$("#loading").fadeIn(500,function(){
				// the data could now be submitted using $.get, $.post, $.ajax, etc 
				$.post('/domains/jolet.eu/content.php', queryString, function(data){
					$("#content").html(data);
					changeLayout();
					$("#loading").fadeOut("fast"); 
				}); 
			});
			return false;
		}
		return true;
	});
}

//restart fader as screen saver ;)
function resetBackgroundFader(t){
	if(backgrImgTimeout)
		clearTimeout(backgrImgTimeout);
	backgrImgTimeout = setTimeout("startFader()",t);
}

function startFader(){
	//kill content...
	if(!$("#content_back").hasClass('active')){
		$("#content").fadeOut(3000,function(){
        	$("#content_front").hide();
        	$("#content .padding").html('');
        	$("#content_back").addClass('active');
		});
	}

	$('#content_back').addClass('active');
	backgroundFader();
}

//handle background fading...
function backgroundFader(stopTimer){
    //set switches
    backgrImgActive = backgrImgActive == 'up' ? 'down' : 'up';
	backgrImgPos++;
	if(!backgrImg[backgrImgPos])
		backgrImgPos = 0;

	//fade right elements...
	if($("#content_back").hasClass('active')){
		if(backgrImgActive == 'up'){
			$("#content_back_copy").fadeOut(3000);
			$("#content_back").hide().css('background-image','url('+backgrImg[backgrImgPos]+')').fadeIn(3000,function(){
				if(!stopTimer)
					backgrImgTimeout = setTimeout("backgroundFader()",1500);
			});
		}else{
			$("#content_back").fadeOut(3000);
			$("#content_back_copy").hide().css('background-image','url('+backgrImg[backgrImgPos]+')').fadeIn(3000,function(){
				if(!stopTimer)
					backgrImgTimeout = setTimeout("backgroundFader()",1500);
			});
		}
	}
}



	//animate draw up of GUI
$(document).ready(function(){
	//get global data...
	$.getJSON("/domains/jolet.eu/js/getdata.php",function(data){
		backgrImg = data['backgrImg'];
		collectionButtonID = data['collectionButtonID'];
		$("#content_back_copy").css("background-image","url(" + backgrImg[0] + ")");
	});

	$("#content_back").addClass('active');
	$("#menu, #footer, #content").hide();
	$("#page_container").animate(
		{
			width:945,
			height:528
		},
		2000,
		function(){
			$("#left, #right, #middle, #content, #content_back, #content_back_copy").animate(
				{
					height:528
				},
				2000,
				function(){
					$("#logo_bar").animate(
						{
							height:87,
							opacity:1.0
						},
						1000
					);


					if($("#menu, #content").is(":hidden")){
						$("#menu, #content").show(1000,
							function(){
									$('#content_back').addClass('active');
									backgroundFader();
							}
						);
					}

					$("#swimwear").animate(
						{
							height:121
						},
						1000
					);

					$("#credits").animate(
						{
							height:21
						},
						1000
					);
				}
			);
		}
	);
});