var casebook = { }

download_link = "our-work";

images = $('img.caseStudyImage');
study_icons = $('div.studyIcon');
controls = $('div.caseStudyControls span:not(.clearme)');
bubble = $('div#home');
main_text = $('div.mainContent div.copy');

r = 420;
bw = bubble.width();
bh = bubble.height();
bpw = bubble.parent().width();
dw = $(document).width();
ml = bubble.css("margin-left");
disabled = (ml == null);
ml = disabled ? 0 : parseInt(ml.replace(/px$/, ''));

origin = {};
origin['left'] = ((dw - bpw) / 2) + ml + (bw / 2);
origin['top'] = disabled ? 0 : bubble.offset().top + (bh / 2);

popup = { };
popup[1] = {left: (r * Math.sin(0.66 * Math.PI)),
			top: (r * Math.cos(0.66 * Math.PI))
			};
popup[2] = {left: (r * Math.sin(0.46 * Math.PI)),
			top: (r * Math.cos(0.46 * Math.PI))
			};
popup[3] = {left: (r * Math.sin(0.26 * Math.PI)),
			top: (r * Math.cos(0.26 * Math.PI))
			};

function disable_clicky(obj) {
	obj.css({color: '#ccc', 'cursor': 'default'});
	obj.unbind();
}

function enable_clicky(obj) {
	obj.css({color: '#0cc', 'cursor': 'pointer'});
	obj.bind('click', handle_click_control);
}

function handle_click_control(event) {
	obj = $(event.currentTarget);
	index = obj.index(); // index of step
	target = -1;
	switch (index) {
		case 0: { // prev
			target = casebook.step - 1;
		} break;
		case 5: { // next
			target = casebook.step + 1;
		} break;
		default: { // 1-4
			target = index;
		} break;
	}
	// activate target
	var hash = '#';
	hash += casebook.studies[casebook.study].id;
	hash += '_step' + target;
	// lop off all but hash section
	hash = hash.replace(/^.*#/, '');
	// add history element
	$.history.load(hash);
}

function image_extend(num) {
	my_image = $('img#image' + num + '.caseStudyImage');
	my_left = origin.left - (300 / 2) - ((dw - bpw) / 2);
	my_top = origin.top - (300 / 2) - 60; // ???
	my_image.queue("fx", function(next) {
		$(this).css('opacity', '1');
		$(this).css('display', 'block'); next();
	});
	my_image.animate({left: my_left + popup[num].left, top: my_top + popup[num].top}, {duration: 500, queue: "fx"});
}

function image_retract(num) {
	my_image = $('img#image' + num + '.caseStudyImage');
	my_left = origin.left - (300 / 2) - ((dw - bpw) / 2);
	my_top = origin.top - (300 / 2) - 60; // ???
	my_image.animate({left: my_left, top: my_top}, {duration: 500, queue: "fx"});
	my_image.queue("fx", function(next) {
		$(this).css('opacity', '0');
		$(this).css('display', 'none'); next();
	});
}

function load_images(id) {
	$('img#image1').queue("fx", function(next) {
		$(this).attr("src", "/uploads/" + $('#' + id + '_image1').html()); next();
	});
	$('img#image2').queue("fx", function(next) {
		$(this).attr("src", "/uploads/" + $('#' + id + '_image2').html()); next();
	});
	$('img#image3').queue("fx", function(next) {
		$(this).attr("src", "/uploads/" + $('#' + id + '_image3').html()); next();
	});
}

function load_content(hash) {
	study_icons.removeClass("active");
	disable_clicky($('.prev'));
	disable_clicky($('.next'));
	if (hash !== "") {
		controls.css({opacity: 1});
		casebook.control_status = 1;
		// break hash in two parts, eg. 1044_step1
		study = hash.replace(/_.*$/, '');
		step = hash.replace(/^.*_/, '');
		load_images(study);
		count = 0;
		for (s in casebook.studies) {
			if (casebook.studies[s].id === study) {
				break;
			}
			count++;
		}
		casebook.study = count; // select new case study
		$(".studyIcon:eq(" + count + ")").addClass("active");
		switch (step) {
			case "step1": { // ie. first click
				casebook.step = 1;
				main_text.html(casebook.studies[count].content1);
				casebook.covered = casebook.studies[count].content1;
				enable_clicky($('.next'));
				images.css('display', 'block');
				image_retract(3);
				image_retract(2);
				image_retract(1);
				notify_controls(0);
			} break;
			case "step2": {
				casebook.step = 2;
				enable_clicky($('.next'));
				enable_clicky($('.prev'));
				main_text.html(casebook.studies[count].content2);
				casebook.covered = casebook.studies[count].content2;
				image_retract(3);
				image_retract(2);
				image_extend(1);
				notify_controls(1);
			} break;
			case "step3": {
				casebook.step = 3;
				enable_clicky($('.next'));
				enable_clicky($('.prev'));
				main_text.html(casebook.studies[count].content3);
				casebook.covered = casebook.studies[count].content3;
				image_retract(3);
				image_extend(1);
				image_extend(2);
				notify_controls(2);
			} break;
			case "step4": {
				casebook.step = 4;
				enable_clicky($('.prev'));
				main_text.html(casebook.studies[count].content4);
				casebook.covered = casebook.studies[count].content4;
				image_extend(1);
				image_extend(2);
				image_extend(3);
				notify_controls(3);
			} break;
		}
	} else {
		// disable controls
		casebook.step = 0;
		enable_clicky($('.next'));
	}
}

function notify_controls(index) { // index of step
	lit_knob = $('div.caseStudyControls span:not(.prev):not(.next):not(.clearme):eq(' + index + ')');
	knobs = $('div.caseStudyControls span:not(.prev):not(.next):not(.clearme)');
	knobs.css('background', "url('/images/site/case-study-control-icon.png') center center no-repeat");
	lit_knob.css('background', "url('/images/site/case-study-control-icon-hi.png') center center no-repeat");
}

function handle_click_study(index) { // index of study
	if (index != casebook.study) { // if different study,
		casebook.study = index; // select new case study
		casebook.step = 0; // reset steps
		image_retract(1);
		image_retract(2);
		image_retract(3);
		load_images(casebook.studies[casebook.study].id);
	}
	var hash = '#';
	hash += casebook.studies[index].id;
	hash += '_step';
	if (casebook.step < 4) {
		hash += (casebook.step + 1);
	} else {
		hash += '4';
	}
	// lop off all but hash section
	hash = hash.replace(/^.*#/, '');
	// add history element
	$.history.load(hash);
}

$(document).ready(function() {
/*
	$(".caseStudyImage").load(function() {
		$(this).wrap(function() {
			return '<span class="' + $(this).attr('class') + '" style="background:url(' + $(this).attr('src') + ') no-repeat center center; width: ' + $(this).width() + 'px; height: ' + $(this).height() + 'px;" />';
		});
		$(this).css("opacity","0");
	});
*/
	if (!disabled) {
		images.animate({opacity: 0}, {duration: 0});
		images.css('display', 'none');
		images.delay(2000); // see animate.js; this is ms_bubble_pause + ms_bubble_speed /ajr
		//images.animate({opacity: 1}, {duration: 0});
		//images.css('display', 'block');
		data = $('.always_hidden');
		controls.css({opacity: 0});
		casebook.main = main_text.html();
		casebook.studies = {};
		casebook.seen = {};
		casebook.step = 0; // which step in the process?
		casebook.study = -1; // which case study?
		$('img#image1').offset({left: origin.left - (300 / 2), top: origin.top - (300 / 2)}); // 300x300?
		$('img#image2').offset({left: origin.left - (300 / 2), top: origin.top - (300 / 2)});
		$('img#image3').offset({left: origin.left - (300 / 2), top: origin.top - (300 / 2)});
		count = 0;
		data.each(function() {
			ident = $(this).attr("id");
			ident = ident.replace(/_.*$/, '');
			if (!(ident in casebook.seen)) {
				casebook.seen[ident] = ident;
				casebook.studies[count++] = { 'id': ident };
			}
		});
		for (count = 0; count < 6; ++count) {
			casebook.studies[count].content0 = $('#' + casebook.studies[count].id + '_content0').html();
			casebook.studies[count].content1 = $('#' + casebook.studies[count].id + '_content1').html();
			casebook.studies[count].content2 = $('#' + casebook.studies[count].id + '_content2').html();
			casebook.studies[count].content3 = $('#' + casebook.studies[count].id + '_content3').html();
			casebook.studies[count].content4 = $('#' + casebook.studies[count].id + '_content4').html();
			casebook.studies[count].image1 = $('#' + casebook.studies[count].id + '_image1').html();
			casebook.studies[count].image2 = $('#' + casebook.studies[count].id + '_image2').html();
			casebook.studies[count].image3 = $('#' + casebook.studies[count].id + '_image3').html();
		}

		controls.each(function() {
			$(this).bind('click', handle_click_control);
		});

		$.history.init(load_content, { unescape: ",/" });

		// hover-text only studyIcons without "ignore" class
		$(".studyIcon:not(.ignore)").each(function(index){ // index 0-5; which study
			$(this).hover(function() {
				// switch text
				casebook.covered = main_text.html();
				main_text.html(casebook.studies[index].content0);
				casebook.control_status = controls.css('opacity');
				controls.css({opacity: 0});
			}, function() {
				// switch back
				// this line is causing the "hover-edit" error, but I can't see why :( /ajr
				main_text.html(casebook.covered);
				controls.css({opacity: casebook.control_status});
			});
			$(this).click(function() {
				handle_click_study(index);
			});
		});
	
		$('.studyIcon.ignore').click(function() {
			window.location.href = download_link;
		});
	}
});