// JavaScript Document
// Initialize the plugin with no custom options
				
		function getWidth() {
			var mydiv = document.getElementById("scrollableThing");
			var curr_width = parseInt(mydiv.style.width); 
			var curr_left = parseInt(mydiv.style.left);// removes the "px" at the end
			alert(curr_width);
			//mydiv.style.width = (curr_width + 10) +"px";
		}
		jQuery.fn.widthjq = function() {//NOT IN USE NOW			
			alert($(".imgContainerAll").width());
		
		}
		
		
		var totalWidthCont = 0;
		
		//HIDE IMAGEGES UNTILL LOADED
		jQuery(document).ready(function(){
			$('.loading').show();
			$('.imagen').hide();
			//loader.prependTo(window);
		});
		 
		jQuery(window).load(function(){
			$('.loading').fadeOut();
			//loader.remove();
			$("#imgContainerAllId .imagen").each(function (){	
				//$('.imagen').show();
				
				$(this).show();
				totalWidthCont += $(this).width();
				
				//$('#respuestas').html() += '::ImgWidth/'+$(this).width()+'+TotalWidth/'+totalWidthCont;
				//document.getElementById('respuestas').innerHTML += '::ImgWidth/'+$(this).width()+'+TotalWidth/'+totalWidthCont+'<br>';
				//$(".imgContainerAll").width(totalWidthCont);
				recalculateGallery();
			})
			totalWidthCont +=0;
			//$(".imgContainerAll").width(5000);
			$(".imgContainerAll").width(totalWidthCont);
			$(".containerFix").width(totalWidthCont+20);
			$('.imagen').show();
			recalculateGallery();
			move(1500)
			
			$('.scrollingHotSpotLeft').show();
			$('.scrollingHotSpotRight').show();
		});
		
		$(document).ready(function() {
		
			//THIS FUNCION ENLARGES IMAGES
			$(".imagen").click(function (){	
					
					$(".imgContainerAll").width(totalWidthCont);
					
					var prevWidth = $(this).width();
					
					if ($(this).height() == 100){
						
						if ($(this).parent().parent().parent().attr('id') != 'imgContainerAllId2' ){
							var myCont = $(this).parent().parent().parent().attr('id');
							$(".imagen").height(100);
							$(".imagen").width("auto");
							
							var myId = $(this).attr('id');
							$('#imgContainerAllId2 #'+myId).height("auto");		
							$('#imgContainerAllId2 #'+myId).width("auto"); 
							
							$(".captionS").removeClass().addClass("captionH");		
							$('#imgContainerAllId2 #'+myId).parent().children('.captionH').removeClass().addClass("captionS");
							
							$('#imgContainerAllId2 #'+myId).parent().children('.captionS').width($('#imgContainerAllId2 #'+myId).width())
							
							var newWidth = $('#imgContainerAllId2 #'+myId).width();
							var offset = newWidth - prevWidth;
							//$(".imgContainerAll").width(totalWidthCont + offset);	
							$('#imgContainerAllId2 #'+myId).parent().parent().width(totalWidthCont + offset+20);//fix	
							$('#imgContainerAllId2 #'+myId).parent().parent().parent().width(totalWidthCont + offset);	//container all
							recalculateGallery();
							
							//Positioning the image
							var offset = $('#imgContainerAllId2 #'+myId).offset().left;
							if (myCont == 'imgContainerAllId'){
							$("#makeMeScrollable").smoothDivScroll("movetoImageMenu", offset);
							}
							if (myCont == 'imgContainerAllId3'){
							$("#makeMeScrollable").smoothDivScroll("movetoImageMenu", offset);
							}
							
						}else{
							$(".imagen").height(100);
								$(".imagen").width("auto");
								$(this).height("auto");		
								$(this).width("auto");	
								
								$(".captionS").removeClass().addClass("captionH");		
								$(this).parent().children('.captionH').removeClass().addClass("captionS");		
								$(this).parent().children('.captionS').width($(this).width())
								
								//Calculating new width
								var newWidth = $(this).width();
								var offset = newWidth - prevWidth;
								//$(".imgContainerAll").width(totalWidthCont + offset);	
								$(this).parent().parent().width(totalWidthCont + offset+20);//fix	
								$(this).parent().parent().parent().width(totalWidthCont + offset);	//container all
								recalculateGallery();
								
								//Positioning the image
								var offset = $(this).offset().left;
								$("#makeMeScrollable").smoothDivScroll("movetoImageMenu", offset);
								
								//$("#makeMeScrollable").smoothDivScroll("movetoX", x);
						}
					}else{
						$(this).height(100);		
						$(this).width("auto");
						$(this).parent().children('.captionS').removeClass().addClass("captionH");
						//$(".imgContainerAll").width(5000);	
						$(".imgContainerAll").width(totalWidthCont);							
						recalculateGallery();			
					}
				});
				
				//MENU
				$('.menuButton').click(function () {
					 $('.menuButtonS').removeClass().addClass("menuButton");
					 $(this).removeClass().addClass("menuButtonS");
   				});
				
				//Reduce all images when scrolling
				jQuery.fn.reduceAll = function() {
						$(".imagen").height(100);
						$(".imagen").width("auto");
						$(".captionS").removeClass().addClass("captionH");	
						$(".imgContainerAll").width(totalWidthCont);							
						recalculateGallery();	
				}
		//End of on document ready
		});
		
		
		function recalculateGallery(){
			$("#makeMeScrollable").smoothDivScroll("recalculateScrollableArea");
		}
		
		jQuery.fn.enlargeImage = function(div) {//NOT IN USE NOW			
			$(".submenuS").removeClass().addClass("submenuH");
			$("#"+div).removeClass().addClass("submenuS");
		
		}
		var containerWidth =0;
		function recalculateGallery(){
			$("#makeMeScrollable").smoothDivScroll("recalculateScrollableArea");	
		}
		
		
		jQuery.fn.showHideSubMenu = function(div) {
			$(".submenuS").removeClass().addClass("submenuH");
			$("#"+div).removeClass().addClass("submenuS");
		}
		
		function addContentJQ() {
		var img = "<img class='imagen' onLoad='recalculateGallery();' src='fotos/architecture/Espania Tenerife Concert Hall.jpg' width='auto' height='150' />"
			$('#scrollableThing').prepend(img);
			recalculateGallery();
		}
		
		function move(x){
			$("#makeMeScrollable").smoothDivScroll("movetoX", x);
		}
		jQuery.fn.animateThing = function() {
			$(".scrollableArea").animate({"right": "+=50px"}, "fast");
			recalculateGallery();
		}
		
		jQuery.fn.appendToEnd = function() {
			$('.imgContainerAll').appendTo('.scrollableArea');
			recalculateGallery();
		}
		
		jQuery.fn.clone = function() {
			$('.imgContainerAll').clone().appendTo('.scrollableArea');
			recalculateGallery();
		}