// JavaScript Document

var current_image = 0;
var images = "";
var headers = "";
var descriptions = "";
var prev_button = "";
var prev_grey = '../media/images/ec_featured_projects_prev_grey.png'
var prev_default = '../media/images/ec_featured_projects_prev.png'
var next_button = "";
var next_default = '../media/images/ec_featured_projects_next.png'
var next_grey = '../media/images/ec_featured_projects_next_grey.png'
var slide = "";
var slide_info = "";

function initFeatured(){
	images = $('.featured_slide');
	headers = $('.featured_header');
	descriptions = $('.featured_description');
	prev_button = $('#prev_button');
	next_button = $('#next_button');
	slide = $('.featured_slides');
	slide_info = $('.featured_info');
	current_image = 0;
	prev_button.click(function() {
		if(current_image == 0){}
		else{
			current_image--;
			slide.html("<img src='" + images[current_image].src + "' alt='" + images[current_image].alt + "' style='display:block' />");
			slide_info.html("<h2 style='display:block'>" + headers[current_image].innerHTML + "</h2>" + "<p style='display:block'>" + descriptions[current_image].innerHTML + "</p>");
		}
		if(current_image == 0){
			prev_button.attr('src', prev_grey);
		}
		next_button.attr('src', next_default);
	});
	next_button.click(function() {
		if(current_image == images.length-1){}
		else{
		current_image++;
		slide.html("<img src='" + images[current_image].src + "' alt='" + images[current_image].alt + "' style='display:block' />");
		slide_info.html("<h2 style='display:block'>" + headers[current_image].innerHTML + "</h2>" + "<p style='display:block'>" + descriptions[current_image].innerHTML + "</p>");
		if(current_image == images.length-1){
			next_button.attr('src', next_grey);
		}
		prev_button.attr('src', prev_default);
	}
	});
	
	tempHead = headers[current_image].innerHTML;
	tempDesc = descriptions[current_image].innerText;
	
	slide.html("<img src='" + images[current_image].src + "' alt='" + images[current_image].alt + "' style='display:block' />");
	slide_info.html("<h2 style='display:block'>" + headers[current_image].innerHTML + "</h2>" + "<p style='display:block'>" + descriptions[current_image].innerHTML + "</p>");
	prev_button.attr('src', prev_grey);
}