$(function () {

//load background image
    var img = new Image();
    $(img).load(function () {
        //$(this).css('display', 'none'); // .hide() doesn't work in Safari when the element isn't on the DOM already
        $(this).hide();
        $('#loader').removeClass('loading').append(this);
        $(this).fadeIn();
    }).error(function () {
        // notify the user that the image could not be loaded
    }).attr('src', 'images/FITD4_BG2.jpg');

//nav swap image    
    $('#a a')
			.css( {backgroundPosition: "0 -161px"} )
			.mouseover(function(){
				$(this).stop().animate({backgroundPosition:"(0 0)"}, {duration:500})
			})
			.mouseout(function(){
				$(this).stop().animate({backgroundPosition:"(0 -161px"}, {duration:200, complete:function(){
					$(this).css({backgroundPosition: "0 -161px"})
				}})
			})
			
    $('#b a')
			.css( {backgroundPosition: "-180px -161px"} )
			.mouseover(function(){
				$(this).stop().animate({backgroundPosition:"(-180px 0)"}, {duration:500})
			})
			.mouseout(function(){
				$(this).stop().animate({backgroundPosition:"(-180px -161px"}, {duration:200, complete:function(){
					$(this).css({backgroundPosition: "-180px -161px"})
				}})
			})
    $('#c a')
			.css( {backgroundPosition: "-360px -161px"} )
			.mouseover(function(){
				$(this).stop().animate({backgroundPosition:"(-360px 0)"}, {duration:500})
			})
			.mouseout(function(){
				$(this).stop().animate({backgroundPosition:"(-360px -161px"}, {duration:200, complete:function(){
					$(this).css({backgroundPosition: "-360px -161px"})
				}})
			})
    $('#d a')
			.css( {backgroundPosition: "-540px -161px"} )
			.mouseover(function(){
				$(this).stop().animate({backgroundPosition:"(-540px 0)"}, {duration:500})
			})
			.mouseout(function(){
				$(this).stop().animate({backgroundPosition:"(-540px -161px"}, {duration:200, complete:function(){
					$(this).css({backgroundPosition: "-540px -161px"})
				}})
			})
    $('#e a')
			.css( {backgroundPosition: "-720px -161px"} )
			.mouseover(function(){
				$(this).stop().animate({backgroundPosition:"(-720px 0)"}, {duration:500})
			})
			.mouseout(function(){
				$(this).stop().animate({backgroundPosition:"(-720px -161px"}, {duration:200, complete:function(){
					$(this).css({backgroundPosition: "-720px -161px"})
				}})
			})
			
			
//search the the database, get a single entry, populate a form
	$("#search_btn").click(function() {
     var query = $("input#search").val();
     var dataString = 'query=' + query;
     $.ajax({
           type: "POST",
           url: "http://dev.artsmia.org:8888/foot-in-the-door-4/query.php",
           dataType: 'json',
           data: dataString,
           success: function(msg) {
              $("input#fname").val(msg.artist_firstname);
              $("input#lname").val(msg.artist_lastname);
              $("input#address").val(msg.address);
              $("input#city").val(msg.city);
              $("input#zip").val(msg.zip);
              $("input#phone").val(msg.phone);
              $("input#email").val(msg.email);
              $("input#height").val(msg.height);
              $("input#width").val(msg.width);
              $("input#depth").val(msg.depth);
              $("input#title").val(msg.title);
              $("input#medium").val(msg.medium);
              $("input#year").val(msg.year);
              $("input#imageID").val(msg.image_filename);
              $("input#entryID").val(msg.entry_id);
              $("input#location").val(msg.gallery_location);
              
              if(msg.dimension == '2') {
                 $("input#dimension2").attr("checked", "checked");
              } else if (msg.dimension == '3') {
                 $("input#dimension3").attr("checked", "checked");
              }
              
              if(msg.permission == '1') {
                 $("input#permission").attr("checked", "checked");
              }
              
              if(msg.mia_staff == '1') {
                 $("input#MIA_Staff").attr("checked", "checked");
              }

              if(msg.mcad_student == '1') {
                 $("input#MCAD_Student").attr("checked", "checked");
              }
              
           }
          });
     return false;
  });
  
});


//query database, get a single entry, populate the content area
function getSingleEntry(entryNum){

	$(function() {
     var query = entryNum;
     var dataString = 'query=' + query;
     $.ajax({
           type: "POST",
           url: "query.php",
           dataType: 'json',
           data: dataString,
           success: function(msg) {
              var firstName = msg.artist_firstname;
              var lastName = msg.artist_lastname;
              var zipCode = msg.zip;
              var title = msg.title;
              var medium = msg.medium;
              var year = msg.year;
              var imageID = msg.image_filename;
              var entryID = msg.entry_id;
              var galleryLoc = msg.gallery_location;              
              if(galleryLoc == ""){ 
	            		galleryLoc = "Undetermined";
	            		detail = '"detail.php?qstring='+lastName+'"';
	           }
              $('<div style="float:left;" class="entry rounded" id="'+galleryLoc+'"><img class="entryimg" src="images/test-image.png"/><br />'+firstName+' '+lastName+'<br />'+title+'<br />'+medium+'<br /><a href="javascript:callSimpleModal()">open</a></div>').appendTo('#entries');

           }
          });
		return false;
		
 	 });
}

function getDetailEntry(entryNum){
	
	$(function() {
	
     var query = entryNum;
     var dataString = 'query=' + query;
     //alert('getDetailEntry:datastring: '+dataString);
     $.ajax({
           type: "POST",
           url: "query.php",
           dataType: 'json',
           data: dataString,
           success: function(msg) {
           	  
              var firstName = msg.artist_firstname;
              var lastName = msg.artist_lastname;
              var title = msg.title;
              var medium = msg.medium;
              var year = msg.year;
              var dimensions = msg.dimension;
              var imageID = msg.image_filename;
              if(imageID == ""){ imageID = "images/test-image.png";}
              var entryID = msg.entry_id;
              var galleryLoc = msg.gallery_location;              
              if(galleryLoc == "" || galleryLoc == "Undetermined"){ 
	             galleryLoc = "000-00";
	           }
	           document.getElementById('artist_name').innerHTML = firstName+'&nbsp;'+lastName;
	           document.getElementById('artwork_title').innerHTML = title;
	           document.getElementById('artwork_location').innerHTML = 'Gallery Location:<p class="rounded shadow">'+galleryLoc+'</p>';
	           document.getElementById('artwork').innerHTML = '<img id="entry" src="'+imageID+'" />';
	           document.getElementById('artwork_medium').innerHTML = '<b>Medium:</b>&nbsp;'+medium;
	           document.getElementById('artwork_year').innerHTML = '<b>Year:</b>&nbsp;'+year;
	           //document.getElementById('artwork_dimensions').innerHTML = '<b>Dimensions:</b>&nbsp;'+dimensions;
	           			   
 			   $('#loading').hide();
 			   $('#wrapp').show();
           }
          });
		return false;
		
 	 });
}

var currentRange;

function getRange(columnNum) {
      
  var cmiddle = parseInt(columnNum);	
  var cfirst = cmiddle-4;
  var clast = cmiddle+4;
  document.getElementById('ccount').innerHTML = 'columns '+cfirst+' through '+clast;
	
   $(function() {
      var query = columnNum;
      var dataString = 'range_val=' + query;	  
      $.ajax({
         type: "POST",
         url: "query.php",
         dataType: 'json',
         data: dataString,
         success: function(msg) {
            $.each(msg, function(key) {
            
            	$('<div class="column" id="column_'+key+'"></div>').appendTo('#entries');

	            $.each(msg[key], function(index, value) {
	            	var firstName = value.artist_firstname;
	            	var lastName = value.artist_lastname;
	            	var title = value.title;
	            	var entryID = value.entry_id;
	            	var imageID = value.image_filename;
	            	var thumbID = value.image_thumbnail;
              		if(imageID == ""){ imageID = "images/test-image.png";}
              		//if(thumbID == ""){ thumbID = "images/test-image.png";}
	            	var galleryLoc = value.gallery_location;
	            	var detail = entryID;
			 		$('<div style="float:left;" class="entry rounded" id="'+galleryLoc+'"><a href="javascript:callSimpleModal(\''+detail+'\');"><img class="entryimg" src="'+thumbID+'"/></a><br /><a href="javascript:callSimpleModal(\''+detail+'\');"><b>'+firstName+' '+lastName+'</b></a><br /><i>'+title+'</i><br />Location:&nbsp;'+galleryLoc+'</div>').appendTo('#column_'+key);			 		
			 		
	            });  
             });
             
 			$('#load').hide();
	   		$('#entries').show();
	   		$('#columnnumber').show("fast");
         }
      });
      return false;
   });
}

function getSearch(user_query) {
   $(function() {
      var query = user_query;
      var dataString = 'user_query=' + query;
      document.getElementById('entries').innerHTML = '';
	  $('#columnnumber').hide();
      $.ajax({
         type: "POST",
         url: "query.php",
         dataType: 'json',
         data: dataString,
         success: function(msg) {
         
         	$("#searchForm").fadeOut(100);
         	
            $.each(msg, function(key) {
            
            	//$('<div class="column" id="column_'+key+'"></div>').appendTo('#entries');
            	
	            $.each(msg[key], function(index, value) {
	            
	            	var firstName = value.artist_firstname;
	            	var lastName = value.artist_lastname;
	            	var title = value.title;
	            	var entryID = value.entry_id;
	            	var imageID = value.image_filename;
	            	var thumbID = value.image_thumbnail;
              		if(imageID == ""){ imageID = "images/test-image.png";}
              		//if(thumbID == ""){ thumbID = "images/test-image.png";}
	            	var galleryLoc = value.gallery_location;
	            	var detail = entryID;
			 		$('<div style="float:left;" class="entry rounded" id="'+galleryLoc+'"><a href="javascript:callSimpleModal(\''+detail+'\');"><img class="entryimg" src="'+thumbID+'"/></a><br /><a href="javascript:callSimpleModal(\''+detail+'\');"><b>'+firstName+' '+lastName+'</b></a><br /><i>'+title+'</i><br />Location:&nbsp;'+galleryLoc+'</div>').appendTo('#entries');
	            });  
             });
         }
      });
      return false;
   });
}

function getRandom() {
   var whatCol = Math.floor(Math.random()*352);
   getRange(whatCol);
   currentRange = whatCol;
}

function getRandomArtwork() {
   var rand = Math.floor(Math.random()*4681);
   return rand;
}

function swapimage(whatContent){
	var container = document.getElementById('mainimage');
	container.innerHTML = whatContent;

}

function callSimpleModal(src){

	if(src=="rand"){src=getRandomArtwork();src+="w";}
	var newsrc= "detail.php?qstring="+src;

	$.modal('<iframe src="' + newsrc + '" height="800" width="550" frameborder="0" marginhight="0" marginwidth="0" scrolling="no" style="border:0" >', {
		closeHTML: '<a href="#" class="simplemodal-close" title="Close this window" >Close this window</a>',
		containerCss:{
			backgroundColor:"#fff",
			height:820,
			padding:0,
			width:560
		},
		overlayClose:true
	});
}

/*
 * Tooltip script 
 * powered by jQuery (http://www.jquery.com)
 * written by Alen Grakalic (http://cssglobe.com) 
 * for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery
 *
 */

this.tooltip = function(){	
	/* CONFIG */		
		xOffset = 10;
		yOffset = 20;		
		// these 2 variable determine popup's distance from the cursor
		// you might want to adjust to get the right result		
	/* END CONFIG */		
	$("a.tooltip").hover(function(e){											  
		this.t = this.title;
		this.title = "";									  
		$("body").append("<p id='tooltip' class='rounded shadow'>"+ this.t +"</p>");
		$("#tooltip")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px")
			.fadeIn("fast");		
    },
	function(){
		this.title = this.t;		
		$("#tooltip").remove();
    });	
	$("a.tooltip").mousemove(function(e){
		$("#tooltip")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px");
	});			
};



// starting the script on page load
$(document).ready(function(){
	tooltip();
});

function rangeUp(range){
	
	document.getElementById('entries').innerHTML = '';	
	var newrange;
	newrange = parseInt(range);	
	
	newrange+=9;
	
	if(newrange > 347){
		newrange = 347;
	}
	
	var num = newrange;
	
	newrange.toString();

	switch(newrange.length){
		case 1:
			newrange = "00"+newrange;
			break;
		case 2:
			newrange = "0"+newrange;
			break;
		case 3:
			break;
		default:
			break;	
	}
	
	 currentRange = newrange;
	 getRange(newrange);
	 
	 num++;
	
	 var cfirst = num-4;
	 var clast = num+4;
	 document.getElementById('ccount').innerHTML = 'columns '+cfirst+' through '+clast;
}

function rangeDown(range){

	document.getElementById('entries').innerHTML = '';	
	var newrange;
	newrange = parseInt(range);
	
	newrange-=9;
	
	if(newrange < 4){
		newrange = 4;
	}
	
	var num = newrange;
	
	newrange.toString();
	
	switch(newrange.length){
		case 1:
			newrange = "00"+newrange;
			break;
		case 2:
			newrange = "0"+newrange;
			break;
		case 3:
			break;
		default:
			break;	
	}
	
	 currentRange = newrange;
	 getRange(newrange);
	 
	 num++;
	 
	 var cfirst = num-4;
	 var clast = num+4;
	 document.getElementById('ccount').innerHTML = 'columns '+cfirst+' through '+clast;
}