var keys = new Array();
var images=0;
var imgArray = new Array();
var c = 0;

function onLoad(name) 
{
	$(function() {
	
		//make our xml request
		$.ajax({
			type: "GET",
			url: name,
			dataType: "xml",
			success: function(xml) {
				$(xml).find('Image').each(function(){
					var img_src = $(this).find('link').text()
					var id = $(this).find('id').text();
							
					var img =           $('<img />')
											 .attr('src', './bin/Images/' + img_src)
											 .load(createImage(images, id, img_src), createThumb(images, id, img_src));
	
					imgArray.push(img);
					
					
					keys.push(new key( $(this).find('title').text(),  $(this).find('medium').text(),  $(this).find('size').text()));				
					images++;
	
				}); //close each
					$('.thumbs').css("height","240px")
					updateTitle(0);
				
					$('.nails').hover(
					function(){
						$(this).css("height", "57px");
					},
					function(){
						$(this).css("height", "20px");			
	
					});	
					$('.thumbs').hover(
					function(){
						$(this).css("height", "277px")
						$('#buffer').css("height", "13px")
						},
					function(){
						$(this).css("height","240px")
						$('#buffer').css("height","13px")
						}
					);
					
					$('.main').serialScroll({
					
						onBefore:function( e, elem, $pane, $items, pos ){
						//...
	
							$('.sidebar #info').slideUp("fast");
							this.offset = calcOffset($(elem).find('a').find('img').attr("id"));
							//alert(this.offset);
	
						},
						
						target:'.main-content #content',
						items:'li',
						prev:'.arrow img.prev',
						next:'.arrow img.next',
						navigation:'.thumbs a',
						duration:500,
						force:false,
						stop:true,
						lock:false,
						cycle:true,
						easing:'easeInOutQuint', 
						jump: true, //click on the images to scroll to them
						
						onAfter:function(elem){
							updateTitle($(elem).find('a').find('img').attr("id"));
							$('.sidebar #info').slideDown(150);						
						}
	
	
					});
							
				}
			}); //close .ajax
	
	});
}

function updateTitle(i){
		$('.sidebar #info #title').html(keys[i].title);
		$('.sidebar #info #medium').html(keys[i].medium);
		$('.sidebar #info #size').html(keys[i].size);
	}

function key(title, medium, size){
	this.title = title;
	this.medium = medium;
	this.size = size;
}

function calcOffset(id){

	var a = $(imgArray[id]).attr("width");
	var b = 931;
	c = ((a - b) * 0.5) + 50;
	return c
	//$('.main').serialScroll({offset: c});

	
}
function createThumb(images, id, img)
{
	$('.thumbs ').append(	$("<a href='#" + id + "' />").append($("<li style='background:url(./bin/Images/Thumbs/hori/" + img + ");' onClick='boom()' class='nails' id='tb" + images + "'/>") )	)
}
function createImage(images, id, img)
{
	$('.images').append(
		$("<li id='im' />").append(
			$("<a name='" + id + "' />").append(
				$("<img />").attr("src",'./bin/Images/' + img)
							.attr("id", images))
							.attr("onClick", "boom()")
				)
			);
}
function boom(){
	thisMovie("cloudbarCol").sendToActionScript();
}
function thisMovie(movieName) {
         if (navigator.appName.indexOf("Microsoft") != -1) {
             return window[movieName];
         } else {
             return document[movieName];
         }
     }