$(document).ready(function(){

	$("#themes li").click(function(){
	
			  $('#styles .list')
			  .add('#styles .list')
			  .add('#styles .list .inside')
			  .add('#styles .list li')
			  .attr('style','');

	
			  $("#themes li").removeClass('active');
	          $(this).addClass('active');
	          var relurl = $(this).children('a').attr('rel');
			  
	          var themeid = $(this).attr('rel');
                
                var name = $(this).children('a').children().children('.name').text();
                var date = $(this).children('a').children().children('.date').text();
                var type = $(this).children('a').children('.type').text();

                
                
                
	     	  $('#themes h2 a').html(name + ' <span>' + date + '</span>');
              
              
	     	  $('#purchase').attr('href',$(this).children('a').attr('buy'));
	     	  $('#close').attr('href',$(this).children('a').attr('demo'));
	     	 //Close Dropdown
	     	  $('#themes .list').slideToggle();
			
			if($('#styles .list').css('display') == 'block'){
				$('#styles .list').hide();
			}				
	          popandchange(relurl,themeid);
	          
	         });

	         


});

// Get an XMLHttpRequest object
function GetHttpRequest() {
  if (window.XMLHttpRequest) {
    return new XMLHttpRequest();
  } else if (window.ActiveXObject) {
    return new ActiveXObject('Microsoft.XMLHTTP');
  } else {
    return null;
  }
}

function popandchange(rawurl,themeid) {

  var hr = GetHttpRequest();
  var payload; 
  var url = rawurl + "?website=" + themeid;
  
  if (hr) {
  
    hr.open("GET", url, false);
    hr.send(payload);

    fillList(hr,themeid);
  }
}



function fillList(xmlreply,themeid)
{

  if (xmlreply.status == 200) // 200 = Status, OK
  {
    var response = xmlreply.responseText;
    var items = response.split("!");
    var the_ul = document.getElementById('stylelinks');
    var list = the_ul.getElementsByTagName('li');
    
    var x = 0;
    var o = 0;
	
    items.length--;

    var list_length = items.length;
    
  
	$('#stylelinks *').remove();
    for (o = 0; o < list_length; o++)
    {
		var parts = items[o].split("|");
		if(o == 0) { 
            var def = parts[1];
            $('#stylelinks').append('<li class="active" close="' + parts[1] + '" buy="http://my.instantsuperstore.com/buyStore.php?name=' + themeid + '&theme=' + parts[0] + '" rel="' + parts[1] + '">' +  parts[0]  + '</li>');
        } else {
		$('#stylelinks').append('<li close="' + parts[1] + '" buy="http://my.instantsuperstore.com/buyStore.php?name=' + themeid + '&theme=' + parts[0] + '" rel="' + parts[1] + '">' +  parts[0]  + '</li>');
        }
		
		x++;
    }
    	$('#styles h2 a').text('More Colors...');
		$('#iframe').attr('src',def); // IFRAME ACTION!
		
		var styles_height = $('#styles .list').height();
		if(styles_height > 400){
			$('#styles .list').height(400);
			$('#styles .list .inside').width(151);
			$('#styles .list li').width(140);
			
		}
		
		
		$("#stylelinks li").click(function(){
			
			var relurl = $(this).attr('rel');
			$("#stylelinks li").removeClass('active');
			$(this).addClass('active');
			$('#styles h2 a').text($(this).text());
			$('#styles .list').slideToggle();
			$('#purchase').attr('href',$(this).attr('buy'));
			$('#close').attr('href',$(this).attr('close'));
			$('#iframe').attr('src',relurl);
			
	    });
    
  
  }
  else
  {
    alert("Cannot handle the AJAX call." + xmlreply.status);
  }
}