/*
 * ZEN International Group Website Revamp - v1.0.1 - Fall 2011
 * 
 * Copyright (c) 2011 Daniel Desert
 * All rights reserved
 */
$(function() {
	var $ze_container			= $('#ze_container'),
		$ze_background			= $('#ze_background'),
		$ze_bgImage				= $ze_background.children('img'),
		$ze_bgOverlay			= $ze_background.children('.ze_overlay'),
		$content				= $('#ze_content'),
		$about					= $('#about'),
		$contact				= $('#contact'),
		$food					= $('#food'),
		$gall					= $('#gallery'),
		$ze_logos				= $('#ze_logos'),
		$ze_page_menu			= $('#ze_page_menu'),
		page_menu_width			= 0,
		animSpeed				= 700,
////////zenSite//////////////////////////////////////////////////////
		zenSite					= (function() {
			var currentPage		= '',
				contentWidth	= 0,
				getFixedDOMDim	= function() {
					page_menu_width = $ze_page_menu.outerWidth();
				},
				initEventHandler= function() {
					$ze_page_menu.find('ul.main_menu').delegate('a', 'click', function(e) {
					//$ze_page_menu.find('ul.main_menu a').bind('click', function(e) {
						var item = $(this).data('content');
						if (item == currentPage || typeof item == 'undefined') return false;
						$.when(zePage.plzOpen(currentPage, false)).done(function() {
							currentPage = item;
							if (item != 'contact')
								$.bbq.pushState({ p: item }, 2);
							zePage.plzOpen(item, true);
						});
						return false;
					});
					
					$(window).bind('hashchange', function(e) {
						var url 		= e.getState('p'),
							contactR 	= e.getState('r');
						if (typeof url === 'undefined')
							url = 'about';
						if (currentPage == '') {	// Start browsing / Refresh
							currentPage = url;
							zePage.plzOpen(url, true);
						} else {						// From within the webpage back and forth
							if (currentPage != url) {	// Back and forth between sections
								$.when(zePage.plzOpen(currentPage, false)).done(function() {
									currentPage = url;
									zePage.plzOpen(url, true);
								});
							} else {					// Back and forth between diff contacts
								if (currentPage == 'contact' && typeof contactR != 'undefined')
									zeContact.gotoContact(false, '#' + contactR);
							}
						}
					});

					//resizing the window resizes the $bg_image
					$(window).bind('resize',function(e) {
						updateDOMDim();
					});
				},
				init			= function() {
					getFixedDOMDim();
					initEventHandler();
					
					// Init Colorbox	
					$('#about_pic a[rel="about-pic"], #gallery a[rel$="gall"], #contact_pic a[rel$="-pic"], #contact .pic_db a[rel$="-pic"], #food a[rel^="press"], #food a[rel="food_pic"]').colorbox({
						maxHeight	: '95%'
					});
					
					// Start the first animation after refresh
					$.when(updateDOMDim()).done(function() {
						$(window).trigger('hashchange');
					});
				},
				updateDOMDim	= function() {
					contentWidth = $(window).width() - page_menu_width;
					$content.css('width', contentWidth + 'px');
					if (currentPage == 'about') {
						zeAbout.updateDOM(contentWidth);
					} else if (currentPage == 'food' || currentPage == 'press') {
						zeFood.updateDOM(contentWidth);
					} else if (currentPage == 'contact') {
						zeContact.updateDOM(contentWidth);
					} else if (currentPage == 'gallery') {
						zeGallery.updateDOM(contentWidth, $(window).height());
					}
					return $.Deferred(
						function(dfd) {
							$.when(BGImageController.changeBgImageDim()).done(function() {					
								dfd.resolve();
							});
						}
					).promise();
				},
				getContentWidth	= function() {
					return contentWidth;
				}
			return {
				init			: init,
				getContentWidth	: getContentWidth
			};
		})(),
////////BGImageController////////////////////////////////////////////
		BGImageController		= (function() {
			var changeBgImageDim	= function() {
					var dim	= getImageDim($ze_bgImage);
					$ze_bgImage.css({
						width	: dim.width + 'px',
						height	: dim.height + 'px',
						left	: dim.left + 'px',
						top		: dim.top + 'px'
					});
					return $.Deferred(
						function(dfd) {
							$ze_bgImage.show();
							$ze_bgOverlay.stop()
							.animate({
								opacity	: 0.5
							}, 500, dfd.resolve);
						}
					).promise();
				},
				getImageDim			= function($i) {
					var $img     = new Image();
					$img.src     = $i.attr('src');
							
					var w_w	= $(window).width(),
					w_h	= $(window).height(),
					r_w	= w_h / w_w,
					i_w	= $img.width,
					i_h	= $img.height,
					r_i	= i_h / i_w,
					new_w,new_h,
					new_left,new_top;
							
					if(r_w > r_i) {
						new_h	= w_h;
						new_w	= w_h / r_i;
					} else {
						new_h	= w_w * r_i;
						new_w	= w_w;
					}
							
					return {
						width	: new_w,
						height	: new_h,
						left	: (w_w - new_w) / 2,
						top		: (w_h - new_h) / 2
					};
							
				};
			
			return {
				changeBgImageDim	: changeBgImageDim,
				getImageDim			: getImageDim
			};
		})(),
////////zenPage//////////////////////////////////////////////////////
		zePage					= (function() {
			var animating		= false,	// need?
				plzOpen			= function(page, open) {
					return $.Deferred(
						function(dfd) {
							switch (page) {
								case 'about':
									open? $.when(zeAbout.open()).done(function(){dfd.resolve();}) : $.when(zeAbout.close()).done(function(){dfd.resolve();});
									break;
								case 'contact':
									open? $.when(zeContact.open()).done(function(){dfd.resolve();}) : $.when(zeContact.close()).done(function(){dfd.resolve();});
									break;
								case 'food':
									open? $.when(zeFood.open(true)).done(function(){dfd.resolve();}) : $.when(zeFood.close()).done(function(){dfd.resolve();});
									break;
								case 'press':
									open? $.when(zeFood.open(false)).done(function(){dfd.resolve();}) : $.when(zeFood.close()).done(function(){dfd.resolve();});
									break;
								case 'gallery':
									open? $.when(zeGallery.open()).done(function(){dfd.resolve();}) : $.when(zeGallery.close()).done(function(){dfd.resolve();});
									break;
							}
							if (open)
								updateLangLink(page);
						}
					).promise();
				},
				updateLangLink	= function(currPage) {
					$('#langbar').find('a').each(function() {
						var $this 		= $(this),
							currHref	= $this.attr('href');
						if (currHref.lastIndexOf('#') >= 0)
							currHref = currHref.substring(0, currHref.lastIndexOf('#'));
						$this.attr('href', currHref + '#p=' + currPage);
					});
				}
			return {
				plzOpen			: plzOpen
			};	
		})(),
////////zeAbout////////////////////////////////////////////////////////
		zeAbout					= (function() {
			var $pic			= $('#about_pic'),
				$about_msg		= $('#about_msg'),
				$wrapper		= $('#my_wrapper'),
				open			= function() {
					updateHeight(zenSite.getContentWidth());
					$about.show();
					$about_msg.children().hide().end().show();	// need fine-tune
					$pic.children().hide().end().show();
					return $.Deferred(
						function(dfd) {
							$about_msg.css('width', 0);
							var msg_w	= zenSite.getContentWidth() - zePhotos.getWidth();
							$about_msg.stop()
							.animate({
								width		: msg_w + 'px'
							}, animSpeed, function() {
								$wrapper.width(msg_w - 40);
								$about_msg.children().fadeIn(animSpeed / 2, function() {
									setSlider($wrapper, $wrapper.find('#msg_content'), true);
								});
							});
							$pic.stop()
							.animate({
								right		: 0
							}, animSpeed, function() {
								$pic.children().fadeIn(animSpeed / 2);
								zePhotos.init($pic, $pic.children('div.pic_db'));
								dfd.resolve();
							});
						}
					).promise();
				},
				close			= function() {
					return $.Deferred(
						function(dfd) {
							zePhotos.closeMe();
							$about_msg.children().fadeOut(animSpeed / 3, function() {
								$about_msg.stop()
								.animate({
									width	: 0
								}, animSpeed / 2);
							});
							$about_msg.children().fadeOut(animSpeed / 3, function() {
								$pic.stop()
								.animate({
									right		: '-' + zePhotos.getWidth() + 'px'
								}, animSpeed / 2, function() {
									$about.hide();
									dfd.resolve();
								});
							});
						}
					).promise();
				},
				updateDOM		= function(contentW) {
					updateHeight(contentW);
					$about_msg.css('width', (contentW - zePhotos.getWidth()) + 'px')
					$wrapper.width(contentW - zePhotos.getWidth() - 40);
					setSlider($wrapper, $wrapper.find('#msg_content'), true);
				},
				updateHeight	= function(contentW) {
					if ($about_msg.hasClass('smaller-msg') && contentW >= 1200) {	// Enlarge
						$about_msg.removeClass('smaller-msg');
						zePhotos.setWidth(440);
						$pic.removeClass('smaller-pic_gallery');
						$pic.children('.pic_wrapper').removeClass('smaller-pic_wrapper');
					}
					if (!$about_msg.hasClass('smaller-msg') && contentW <= 1050) {	// Shrink
						$about_msg.addClass('smaller-msg');
						zePhotos.setWidth(300);
						$pic.addClass('smaller-pic_gallery');
						$pic.children('.pic_wrapper').addClass('smaller-pic_wrapper');
					}	
				}
			return {
				open 			: open,
				close			: close,
				updateDOM		: updateDOM
			};
		})(),
////////zeFood/////////////////////////////////////////////////////////
		zeFood						= (function() {
			var $menu				= $('#food_menu'),
				$scroller			= $('#food_scroller'),
				$list				= $('#food_list'),
				init				= function(isFood) {
					var num_food 	= $list.children('li').length,
						w_width 	= 0,
						center 		= 0,
						padding_r	= 0,
						$sibList	= (isFood)? $('#press_list') : $('#food_list');
					
					$sibList.hide();
					$scroller.show();
					center = $scroller.width() / 2;
					$list.show().children('li').each(function(i) {
						var div_width	= $(this).outerWidth(true);
						w_width 		+= div_width;
						if (i == (num_food - 1))
							padding_r 	= center - (div_width / 2);
					}).end().css({
						'width'			: w_width + 'px',
						'padding-right'	: padding_r + 'px'
					});
					$scroller.scrollLeft(w_width);
					setSlider($scroller, $list, false);
					
					initEventHandler(true);
					
					return $.Deferred(
						function(dfd) {
							$scroller.stop()
								.animate({'scrollLeft' : '0px'}, 1500, 'easeInOutExpo', function() {
									dfd.resolve();
								});
						}
					).promise();
				},
				initEventHandler	= function(bind) {
					if (!bind) {
						$scroller.unbind('scroll');
						return false;
					}
					
					$scroller.bind('scroll', function() {
						var difference = $list.outerWidth(true) - $scroller.width();
						if ($scroller.next('.slider-wrap').length != 0)
							$scroller.next('.slider-wrap').find('.slider-hori').slider('value', 100 - (100 * ((difference - parseInt($scroller.scrollLeft(), 10)) / difference)));
					});
				},
				open				= function(isFood) {
					if (!isFood) 
						$list = $('#press_list');
					else 
						$list = $('#food_list');
					$food.children().hide().end().show();
					return $.Deferred(
						function(dfd) {
							var food_width = zenSite.getContentWidth();
							$menu.show()
							.children().hide()
							.end()	// .stop() is removed as it will hinder the switching between Press and Food (using the same function to open / close) - 2011-08-03
							.animate({
								width	: food_width + 'px'
							}, animSpeed, function() {
								$.when(init(isFood)).done(function() {
									dfd.resolve();
								});
							});
						}
					).promise();
				},
				close				= function() {
					initEventHandler(false);
					return $.Deferred(
						function(dfd) {
							$menu.children().fadeOut(animSpeed / 3, function() {
								$menu.stop()
								.animate({
									width	: 0
								}, animSpeed / 2, function() {
									if ($scroller.next('.slider-wrap').length > 0)
										$scroller.next('.slider-wrap').remove();
									$menu.hide();
									$food.hide();
									dfd.resolve();
								});
							});
						}
					).promise();
				},
				updateDOM			= function(contentW) {
					$menu.css('width', contentW + 'px');
					setSlider($scroller, $list, false);
				}
			return {
				open			: open,
				close			: close,
				updateDOM		: updateDOM
			}
		})(),
////////zeGallery/////////////////////////////////////////////////////////
		zeGallery					= (function() {
			var $menu				= $('#gall_menu'),
				$container			= $('#gall_container'),
				$restItem			= $('#gall_grid li'),
				maxW				= 1480,
				minW				= 800,
				maxH 				= 800,
				minH 				= 462,
				init				= function() {
					return $.Deferred(
						function(dfd) {
								updateDOM(zenSite.getContentWidth(), $(window).height());
								$menu.children().fadeIn(animSpeed / 2, function() {
									dfd.resolve();
								});
							}
					).promise();
				},
				open				= function() {
					$gall.children().hide().end().show();
					$ze_logos.fadeOut(animSpeed / 2);
					return $.Deferred(
						function(dfd) {
							var gall_width = zenSite.getContentWidth();
							$menu.show()
							.children().hide()
							.end().stop()
							.animate({
								width	: gall_width + 'px'
							}, animSpeed, 'easeInOutExpo', function() {
								$.when(init()).done(function() {
									dfd.resolve();
								});
							});
						}
					).promise();
				},
				close				= function() {
					return $.Deferred(
						function(dfd) {
							$menu.children().fadeOut(animSpeed / 3, function() {
								$menu.stop()
								.animate({
									width	: 0
								}, animSpeed / 2, function() {
									$menu.hide();
									$gall.hide();
									$ze_logos.fadeIn(animSpeed / 3);
									dfd.resolve();
								});
							});
						}
					).promise();
				},
				updateDOM			= function(contentW, contentH) {
					$menu.css('width', contentW + 'px');
					var newW = 0, newH = 0;
					if (contentW >= minW && contentW <= maxW)	// dynamic width
						newW = contentW / 4;
					else if (contentW > maxW)	// > Max Width
						newW = maxW / 4;
					else						// < Min Width
						newW = minW / 4;
					
					if (contentH >= minH && contentH <= maxH)	// dynamic height
						newH = contentH / 3;
					else if (contentH > maxH)
						newH = maxH / 3;
					else
						newH = minH / 3;
						
					if (newH * 1.3 > newW)
						newH = newW / 1.3;
					else if (newW / 1.3 > newH)
						newW = newH * 1.3;
					
					$restItem.css({
						'height'		: newH + 'px',
						'width'			: newW + 'px'
					});
					
					$container.css({
						'width'			: (newW * 4) + 'px',
						'margin-top'	: ((-1 * (Math.ceil($restItem.length / 4)) * newH) / 2) + 'px'
					});
				}
			return {
				open			: open,
				close			: close,
				updateDOM		: updateDOM
			}
		})(),
////////zeContact//////////////////////////////////////////////////////
		zeContact					= (function() {
			var $container			= $('#contact_container'),
				$scroller			= $('#contact_scroller'),
				$contact_menu		= $('#contact_menu'),
				$contact_pic		= $('#contact_pic'),
				$contact_box		= $('#contact_detail_box'),
				$contact_map 		= $('#contact_map'),
				$contact_menu_item	= $contact_menu.find('.menu_item'),
				contact_menu_width	= 150,
				startPoint			= 1,
				startID				= '',
				startStyle			= "classic",	// or "middle" (under development)
				pushRState			= false,
				init				= function() {
					var num_rest		= $container.children('div').length,
						h_height		= 0,
						padding_t		= 0,
						padding_b		= 0,
						center			= $scroller.height() / 2,
						initMenuMove	= 0;
					$scroller.show();
					$container.show().children('div').each(function(i) {
						var $div		= $(this),
							div_height	= $div.height();
						h_height 		+= div_height;
						if (i == 0)
							padding_t 	= center - (div_height / 2);
						if (i == (num_rest - 1)) {
							padding_b 	= center - (div_height / 2);
						}
					}).end().css({
						'height'		: h_height + 'px',
						'padding-top'	: padding_t + 'px',
						'padding-bottom': padding_b + 'px'
					});
					$scroller.scrollTop(h_height);
					setSlider($scroller, $container, true);
					
					initEventHandler(true);
					
					initMenuMove = getMenuOffset($container.find('div.menu_item:nth-child(' + startPoint + ') a'));
					
					return $.Deferred(
						function(dfd) {
							$scroller.stop()
								.animate({'scrollTop' : initMenuMove}, 1500, 'easeInOutExpo', function() {
									centerContact($container.find('div.menu_item:nth-child(' + startPoint + ') a'), animSpeed, true);
									dfd.resolve();
								});
						}
					).promise();
				},
				initEventHandler	= function(bind) {
					if (!bind) {
						$scroller.unbind('scroll');
						$container.find('.menu_item a').unbind('click');
						$('#contact_map').find('.map_ctrl a.close').unbind('click');
						return false;
					}
					
					$scroller.bind('scroll', function() {
						var difference	= $container.outerHeight() - $scroller.height();
						if ($scroller.next('.slider-wrap').length != 0)
							$scroller.next('.slider-wrap').find('.slider-vertical').slider('value', 100 * ((difference - parseInt($scroller.scrollTop(), 10)) / difference));
					});
					
					$container.find('.menu_item').delegate('a', 'click', function(e){
						var sourceID 	= $(this).attr('href');
						e.preventDefault();
						$.bbq.pushState({ r: sourceID.substr(1) });
						return false;
					});
					
					$('#contact_map').find('a.close').bind('click', function(e) {
						$('#contact_map').fadeOut(animSpeed / 3);
						e.preventDefault();
						return false;
					});
					
					$('#contact_wrapper').find('.contact_detail .address a.open_map').bind('click', function(e) {
						var gMapData		= getGoogleMapAddr($(this).data('lat'), $(this).data('long'));
						$contact_map.find('div.map_img img').attr('src', gMapData.img).end().find('div.map_ctrl a.zoom').attr('href', gMapData.href);	
						$contact_map.fadeToggle(animSpeed / 3);
						e.preventDefault();
					});
				},
				open 				= function() {
					$contact.children().hide().end().show();
					startPoint = 1;
					return $.Deferred(
						function(dfd) {
							var hashR = jQuery.bbq.getState('r');
							if (typeof hashR != 'undefined') {
								startPoint = $contact_menu_item.index($contact_menu_item.find('a[href="#' + hashR + '"]:first').parent()) + 1;
							} else {	// First Start Contact Page
								if (startStyle != "classic")
									startPoint = Math.floor($contact_menu_item.length / 2);
								pushRState = true;
							}
							updatePic(zenSite.getContentWidth());
							var detail_w	= zenSite.getContentWidth() - contact_menu_width - zePhotos.getWidth();
							$contact_pic.show().stop()
								.animate({
									right		: 0
								}, animSpeed);
							if (pushRState) {
								startID = getStartID();
								$.bbq.pushState({ p: 'contact', r: startID }, 2);
							} else {
								startID = hashR;
							}
							$contact_menu
								.children('#contact_scroller').hide()
								.end().css('width', 0)
								.show().stop()
								.animate({
									width		: contact_menu_width + 'px'
								}, animSpeed, function() {
									$contact_box.css('left', contact_menu_width + 'px');
									$contact_box
										.children().hide()
										.end().show().stop()
										.animate({
											width	: detail_w + 'px'
										}, animSpeed / 2, function() {
											$.when(init()).done(function() {
												$contact_box.children().fadeIn(animSpeed / 3).end().scrollTop($('#' + startID).position().top);
												$contact_pic.children().fadeIn(animSpeed);
												zePhotos.init($contact_pic, $('#contact_wrapper').find('div#' + startID + ' div.pic_db'));
												
												dfd.resolve();
											});
										});
								});
						}
					).promise();
				},
				close				= function() {
					initEventHandler(false);
					return $.Deferred(
						function(dfd) {
							$contact_box.fadeOut(animSpeed / 2, function() {
								$('#contact_map').hide();
								$contact_pic.stop()
									.animate({
										right	: '-' + zePhotos.getWidth() + 'px'
									}, animSpeed, function() {
										zePhotos.closeMe();
										$contact_pic.children().hide();
									});
								$contact_menu
									.children('#contact_scroller').fadeOut(200)
									.end().stop()
									.animate({
										width	: 0 + 'px'
									}, animSpeed, function() {
										$contact.hide();
										dfd.resolve();
									});
							}).css('width', 0);
						}
					).promise();
				},
				centerContact		= function($obj, speed, noMove) {
					$container.find('div.menu_item a.activeCon').removeClass('activeCon');
					$obj.addClass('activeCon');
					if (noMove)
						return false;
					var currScrollTop	= parseFloat($scroller.scrollTop(), 10),
						targetOffset	= getMenuOffset($obj);
					if (targetOffset != currScrollTop)
						$scroller.stop()
							.animate({'scrollTop' : targetOffset}, speed, 'easeInOutExpo');
				},
				getMenuOffset		= function($target) {
					return $target.position().top + ($target.outerHeight() / 2) - ($scroller.height() / 2);
				},
				getGoogleMapAddr	= function(lat, long) {
					var mapAddr			= {},
						gMapImgAddr		= 'http://maps.google.com/maps/api/staticmap?center=<x>,<y>&zoom=16&markers=color:red|<x>,<y>&path=color:0x0000FF80|weight:5|<x>,<y>&size=420x400&sensor=false',
						gMapLink		= 'http://maps.google.com/maps?q=loc:<x>,<y>&ll=<x>,<y>&z=17';
					mapAddr.img = gMapImgAddr.replace(/<x>/g, lat);
					mapAddr.img = mapAddr.img.replace(/<y>/g, long);
					mapAddr.href = gMapLink.replace(/<x>/g, lat);
					mapAddr.href = mapAddr.href.replace(/<y>/g, long);
					return mapAddr;
				},
				updateDOM			= function(contentW) {
					updatePic(contentW);
					$contact_box.css('width', contentW - contact_menu_width - zePhotos.getWidth());
				},
				updatePic			= function(contentW) {
					if ($contact_pic.hasClass('smaller-pic_gallery') && contentW >= 1200) {		// Enlarge
						zePhotos.setWidth(440);
						$contact_pic.removeClass('smaller-pic_gallery');
						$contact_pic.children('.pic_wrapper').removeClass('smaller-pic_wrapper');
						$contact_map.removeClass('smaller_map').addClass('bigger_map');
					}
					if (!$contact_pic.hasClass('smaller-pic_gallery') && contentW <= 1050) {	// Shrink
						zePhotos.setWidth(300);
						$contact_pic.addClass('smaller-pic_gallery');
						$contact_pic.children('.pic_wrapper').addClass('smaller-pic_wrapper');
						$contact_map.removeClass('bigger_map').addClass('smaller_map');
					}
				},
				gotoContact			= function($srcLink, here) {
					// TODO: Add check whether current contact = "here", if so, return false
					if (pushRState) {
						pushRState = false;
						return false;
					}
					if (!$srcLink)
						centerContact($contact_menu_item.find('a[href="' + here + '"]:first'), animSpeed, false);
					else
						centerContact($srcLink, animSpeed, false);
					$contact_box.children().fadeIn(animSpeed / 3).end().scrollTop($(here).position().top);
					$('#contact_map').hide();
					zePhotos.updateMe($contact_pic, $(here).find('.pic_db'));
				},
				getStartID			= function() {
					return $contact_menu_item.find('a:nth-child(' + startPoint + ')').attr('href').substr(1);
				}
			return {
				open			: open,
				close			: close,
				gotoContact		: gotoContact,
				updateDOM		: updateDOM
			}
		})(),
////////zePhotos//////////////////////////////////////////////////////
		zePhotos					= (function() {
			var interval			= 4000,
				myWidth				= 440,
				playtime,
				current 			= 0,
				$frame				= '',
				$source				= '',
				$frame_wrapper		= '',
				$frame_ctrl			= '',
				$frame_desc			= '',
				num_pic				= '',
				init				= function($newFrame, $newSource) {
					updateMe($newFrame, $newSource);
					slideshowMouseEvent();
					$frame_ctrl.find('.pic_pause_play').bind('click',function(e){
						var $this = $(this);
						if($this.hasClass('pic_play'))
							play();
						else
							pause();
						e.preventDefault();	
					});
					$frame_ctrl.find('.pic_next').bind('click',function(e){
						pause();
						next();
						e.preventDefault();
					});
					$frame_ctrl.find('.pic_prev').bind('click',function(e){
						pause();
						prev();
						e.preventDefault();
					});
				},
				closeMe				= function() {
					pause();
					$frame_ctrl.find('a').unbind('click');
				},
				updateMe			= function($newFrame, $newSource) {
					pause();
					current			= 0;
					$frame 			= $newFrame;
					$source 		= $newSource;
					$frame_wrapper	= $frame.children('.pic_wrapper');
					$frame_ctrl		= $frame.children('.pic_controls');
					$frame_desc		= $frame.children('.pic_desc');
					num_pic			= $source.children('a').length;
					if ($frame_desc.length) {
						$frame_desc.html($source.data('name1') + " - " + $source.data('name2')).fadeIn(animSpeed);
					}
					play();
				},
				slideshowMouseEvent	= function() {
					$frame.unbind('mouseenter')
						.bind('mouseenter',showControls)
						.andSelf()
						.unbind('mouseleave')
						.bind('mouseleave',hideControls);
				},
				showControls		= function() {
					$frame_ctrl.stop().animate({'right':'15px'},500);
					//if ($frame_desc.length) {
					//	$frame_desc.stop().animate({'bottom':'0px'},500);
					//}
				},
				hideControls		= function() {
					$frame_ctrl.stop().animate({'right':'-110px'},500);
					//if ($frame_desc.length) {
					//	$frame_desc.stop().animate({'bottom':'-30px'},500);
					//}
				},
				play				= function() {
					next();
					$frame_ctrl.find('.pic_pause_play').addClass('pic_pause').removeClass('pic_play');
					if (num_pic > 1) playtime = setInterval(next,interval);
				},
				pause				= function() {
					if ($frame == '') return;
					$frame_ctrl.find('.pic_pause_play').addClass('pic_play').removeClass('pic_pause');
					clearTimeout(playtime);
				},
				next 				= function() {
					++current;
					showImage();
				},
				prev 				= function() {
					--current;
					showImage();
				},
				showImage			= function() {
					nextCurrent();
					var $thumbA		= $source.find('a:nth-child(' + current + ')'),
						$thumb 		= $thumbA.find('img');
					if ($thumb.length) {
						var source			= $thumb.attr('src'),
							zoomSrc			= $thumbA.attr('href'),
							title			= $thumbA.attr('title'),
							rel				= $thumbA.attr('rel'),
							$currentImage 	= $frame_wrapper.find('img');
						if ($currentImage.length){
							$currentImage.fadeOut(function(){
								$(this).remove();
								$('<img />').load(function(){
									var $image = $(this);
									resize($image);
									$image.hide();
									$frame_wrapper.find('a').attr({'href': zoomSrc, 'title': title, 'rel': rel}).empty().append($image.fadeIn());
								}).attr('src', source);
							});
						} else {
							$('<img />').load(function(){
									var $image = $(this);
									resize($image);
									$image.hide();
									$frame_wrapper.find('a').attr({'href': source, 'title': title, 'rel': rel}).empty().html($image.fadeIn());
							}).attr('src', source);
						}			
					} else { //this is actually not necessary since we have a circular slideshow
						nextCurrent();
					}
				},
				nextCurrent			= function() {
					if (current > num_pic) current = 1;
					if (current < 1) current = num_pic;
				},
				resize 				= function($image) {
					var theImage 	= new Image();
					theImage.src 	= $image.attr('src');
					var imgwidth 	= theImage.width;
					var imgheight 	= theImage.height;
					
					var containerwidth  = myWidth - 20;
					var containerheight = myWidth - 20;
                
					if(imgwidth	> containerwidth){
						var newwidth = containerwidth;
						var ratio = imgwidth / containerwidth;
						var newheight = imgheight / ratio;
						if(newheight > containerheight){
							var newnewheight = containerheight;
							var newratio = newheight/containerheight;
							var newnewwidth =newwidth/newratio;
							theImage.width = newnewwidth;
							theImage.height= newnewheight;
						}
						else{
							theImage.width = newwidth;
							theImage.height= newheight;
						}
					}
					else if(imgheight > containerheight){
						var newheight = containerheight;
						var ratio = imgheight / containerheight;
						var newwidth = imgwidth / ratio;
						if(newwidth > containerwidth){
							var newnewwidth = containerwidth;
							var newratio = newwidth/containerwidth;
							var newnewheight =newheight/newratio;
							theImage.height = newnewheight;
							theImage.width= newnewwidth;
						}
						else{
							theImage.width = newwidth;
							theImage.height= newheight;
						}
					}
					$image.css({
						'width'	:theImage.width,
						'height':theImage.height
					});
				},
				getWidth			= function() {
					return myWidth;
				},
				setWidth			= function(newWidth) {
					myWidth 		= newWidth;
				}
			return {
				init				: init,
				getWidth			: getWidth,
				setWidth			: setWidth,
				closeMe				: closeMe,
				updateMe			: updateMe
			}
		})();
		
	zenSite.init();
	
});