var START_FONT_SIZE = 14;
var START_DELAY = 500;
var SIZE = 45;
var SHIFT = 5;
var YEARS = [2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009];

var isIE = $.browser.msie;

$(document).ready(function(){
    if ($(document.body).hasClass('history')) {
	initHistory();
	HSlider.init(YEARS);
    } else if ($(document.body).hasClass('staff')) {
	Staff.init();
    } else if ($(document.body).hasClass('projects')) {
	Project.init();
    }
});

var HSlider = (function() {
    var CUR_YEAR = 2003;
    var INDEX = 0;
    var YEARS = [];
    var HISTORY = null;
    function setDisabled(button) {
	(button) ? $('#next').text(' ').addClass('disabled') : $('#previous').text(' ').addClass('disabled');
    }
    function setStartYears(years) {
	CUR_YEAR = location.hash.replace('#', '') - 0;
	YEARS = years;
	if (CUR_YEAR < years[0] || CUR_YEAR > years[years.length - 1]) {
	    CUR_YEAR = years[0];
	};
	if (CUR_YEAR == YEARS[0]) {
	    setDisabled(false);
	    $('#next').text(years[1]).removeClass('disabled');
	} else if (CUR_YEAR == YEARS[YEARS.length - 1]) {
	    setDisabled(true);
	    $('#previous').text(YEARS[YEARS.length - 2]).removeClass('disabled');
	} else {
	    var i = 0;
	    while (CUR_YEAR != YEARS[i]) i++;
	    $('#previous').text(YEARS[i - 1]).removeClass('disabled');
	    $('#next').text(YEARS[i + 1]).removeClass('disabled'); 
	}
    }
    function setButtonListner() {
	var pattern = /\n\s\t/gi;
	$('#previous').bind('click', function() {
	    if (!$(this).hasClass('disabled')) previousYear();
	    return false;
	});
	$('#next').bind('click', function() {
	    if (!$(this).hasClass('disabled')) nextYear();
	    return false;
	});
    }
    function previousYear() {
	animationSlide(true);
    }
    function nextYear() {
	var grname = 'next year';
	animationSlide(false);
    }
    function animationSlide(direction) {
	var isToLeft = (direction) ? true : false;
	var left = (HISTORY.attr('nleft') && HISTORY.attr('nleft') != '') ? HISTORY.attr('nleft') - 0 : HISTORY.position().left;
	HISTORY.position().left = left; // ---
	left += (isToLeft) ? 990 : -990;
	INDEX = Math.abs(left / 990);
	CUR_YEAR = YEARS[INDEX];
	$('#previous').text(YEARS[INDEX - 1]);
	$('#next').text(YEARS[INDEX + 1]);
	(INDEX == 0) ? $('#previous').text(' ').addClass('disabled') : $('#previous').removeClass('disabled');
	(INDEX == (YEARS.length - 1)) ? $('#next').text(' ').addClass('disabled') : $('#next').removeClass('disabled');
	
	HISTORY.attr('nleft', left);
		
	HISTORY.animate(
	    { left: left  },
	    { queue: false },
	    'normal'		
	);
	animationChangeYear($('#tl' + CUR_YEAR + ' .ball')); 
    }
return {
    init: function(years) {
	setStartYears(years);
	HISTORY = $('#history ul');
	setButtonListner();
    },
    years: function () { return YEARS; },
    cur_year: function() {
	return (arguments.length > 0) ? CUR_YEAR = arguments[0] - 0 : CUR_YEAR;
    }
}    
})();
function initSlider(years) {
    $('#previous').text(years[0]).addClass('disabled');
    $('#next').text(years[1]);
}

function initHistory() {
    getFirstImage();
    var value = -(2500 - document.documentElement.clientWidth)/2;
    $('#time-line').animate(
	{ backgroundPosition: value + "px 0" }, 
	'slow',
	'swing',
        function () {
            timeLineStartAnimation();
            yearPointInit();
	    setPointListner();
        }
    );
}

function timeLineStartAnimation() {
    $('#time-line').find('a').css('display', 'block').each(function() {
        if (!isIE) {
	    $(this).append('<img src="/i/ball.png" class="ball" alt="' + $(this).text() + '">');
	} else {
	    $(this).append('<div class="ball" alt="' + $(this).text() + '"> </div>')
	}
    });
}

(function($) {
    $.fn.nonIEOpacity = function (value) {
	if (!isIE) $(this).css('opacity', value);
	return this;
    }
})(jQuery);

(function($) {
    $.fn.nonIEfadeOut = function () {
	if (!isIE) $(this).fadeOut();
	return this;
    }
})(jQuery);

function yearPointInit() {
    var aImg = $('#time-line .ball');
    aImg.nonIEOpacity('0').css({ width: 0, height: 0 }).each(function() {
        var index = aImg.index($(this));
        ballAnimation(this, index);
    });
}

function setPointListner() {
    $('#time-line a').bind('click', function () {
        animationChangeYear($(this).find('.ball'), true);
    });
}

function getFirstImage() {
    $('#time-line_').attr('id', 'time-line');
}

function getCSSQuality(index) {
    var quality = {
	width: SIZE - SHIFT * index,
	height: SIZE - SHIFT * index
    };
    if (!isIE) quality.opacity = '1.0';
    return quality;
}

function ballAnimation(obj, index) {
    $(obj).animate(
	getCSSQuality(index),
	{ queue: false, duration: START_DELAY * (index + 1) },
        function () {
            $(this.parentNode).find('i').css({ 'display': 'block' });
        }
    );
}

function previousBallChange() {
    var i = startIndex;
    if (startIndex != 0) {
        aImg.slice(0, cur - 1).each(function () {
            ballAnimation(this, i--);
        });
    }
}

function animationChangeYear(cur, mod) {
    var aImg = $('#time-line .ball');
    var count = aImg.size();
    var startIndex = aImg.index($(cur));
    HSlider.cur_year(cur.attr('alt'));
    
    $('#time-line i').removeClass('cur');
    ballAnimation(cur, 0);
    $(cur[0].parentNode).find('i').addClass('cur');
    var i = startIndex;
    if (startIndex != 0) {
        aImg.slice(0, startIndex).each(function () {
            ballAnimation(this, i--);
        });
    }
    var j = 1;
    if (startIndex != count - 1) {
        aImg.slice(startIndex + 1, count).each(function () {
            ballAnimation(this, j++);
        });
    }
    var index = $('#history li').index($('#y' + cur.attr('alt')));
    var left = -990 * index;
    if (mod) {
	$('#history ul').hide().attr('nleft', left).css('left', left).fadeIn();
	var year = cur.attr('alt');
	(year == YEARS[0]) ? $('#previous').text('').addClass('disabled') : $('#previous').text(year - 1).removeClass('disabled');
	(year == YEARS[YEARS.length - 1]) ? $('#next').text('').addClass('disabled') : $('#next').text(year - 0 + 1).removeClass('disabled');
    }
}

function animateStaff(list, i, k) {
    var step = 795;
    var left = list.position().left;
    if (i!=k) {
	$('#staff img:eq(' + i + ')').animate(
	    { marginTop: 59, marginLeft: 89, height: 350 },
	    'normal'
	);
	$('#staff img:eq(' + (i + 1) + ')').animate(
	    { marginTop: 0, marginLeft: 0, height: 468 },
	    'normal'
	);
    }
    if (i <= k) {
	list.animate(
	    { left: list.position().left - step },
	    { "duration": "normal", "easing": "linear", "queue": false, complete: function() {
		animateStaff(list, i, k);
	    } }	    
	);
    } else {
        $('#next, #previous').fadeIn();
    }
    i++;
} 
 
var Staff = (function() {
    var count = 0;
    var step = 795;
    function init() {
	count = $('#staff li').size();
	var list = $('#staff ul');
	var k = Math.round(count/2);
	list.css({ left: $('#staff ul').position().left - step * k});
	$('#staff img:eq(' + k + ')').css({ margin: 0, height: 'auto' }).parent().find('p').show();
	$('#next, #previous').fadeIn();
	$('#next').bind('click', function() {
	    list.find('li p').hide();
	    var left = (list.attr('nleft') && list.attr('nleft') != '') ? list.attr('nleft') - 0 : list.position().left;
	    list.attr('nleft', left);
	    list.animate(
		{ left: left - step},
		'normal',
		function() {
		    list.css('left', list.attr('nleft') - 0);
		    list.find('li:first').remove().appendTo(list);
		    $(list.find('li').get(k)).find('p').show();
		    list.find('img').not(':eq(' + k + ')').css({ marginTop: 0, marginLeft: 89, height: 350 });
		    list.find('img:eq(' + k + ')').css({ marginTop: 0, marginLeft: 0, height: 468 });
		}
		
	    );
	    $(list.find('img').get(k)).animate(
		{ marginTop: 0, marginLeft: 89, height: 350 },
		{ queue: false } 
	    );
	    $(list.find('img').get(k + 1)).animate(
		{ marginTop: 0, marginLeft: 0, height: 468 },
		{ queue: false } 
	    );
	});
	$('#previous').bind('click', function() {
	    list.find('li p').hide();
	    var left = (list.attr('nleft') && list.attr('nleft') != '') ? list.attr('nleft') - 0 : list.position().left;
	    list.attr('nleft', left);
	    list.animate(
		{ left: left + step },
		{ queue: true, complete: function() {
		    list.css('left', list.attr('nleft') - 0);
		    list.find('li:last').remove().insertBefore(list.find('li:first'));
		    list.find('li p').hide();
		    $(list.find('li').get(k)).find('p').show();
		    list.find('img').not(':eq(' + k + ')').css({ marginTop: 0, marginLeft: 89, height: 350 });
		    list.find('img:eq(' + k + ')').css({ marginTop: 0, marginLeft: 0, height: 468 });
		}}		
	    );
	    $(list.find('img').get(k)).animate(
		{ marginTop: 0, marginLeft: 89, height: 350 },
		{ queue: false } 
	    );
	    $(list.find('img').get(k - 1)).animate(
		{ marginTop: 0, marginLeft: 0, height: 468 },
		{ queue: false }
	    );
	})
    }
return {
    init: function() {
	init();
	
    }
}
})();

var Project = (function() {
    var TEXT = null;
    var AREA = null;
    var MIN = 1;
    var MAX = 9;
    
return {
    init: function() {
	TEXT = $('#prj-area .window div');
	AREA = $('#prj-area ul li');
	TEXT.filter('.hidden').fadeOut().removeClass('.hidden');
	AREA.find('a').bind('click', function() {
	    AREA.removeClass('act');
	    var id = this.parentNode.className;
	    $(this.parentNode).addClass('act');
	    TEXT.css('display', 'none');
	    TEXT.filter('.' + id).fadeIn();
	    return false;
	});
	$('#prj-area .nav .previous').bind('click', function() {
	    var index = AREA.index(AREA.filter('.act')) + 1;
	    index = (index == MIN) ? MAX : index -= 1;
	    AREA.removeClass('act');
	    $(AREA.get(index - 1)).addClass('act');
	    TEXT.css('display', 'none');
	    TEXT.filter('.c' + (index)).fadeIn();
	});
	$('#prj-area .nav .next').bind('click', function() {
	    var index = AREA.index(AREA.filter('.act')) + 1;
	    index = (index == MAX) ? MIN : index += 1;
	    AREA.removeClass('act');
	    $(AREA.get(index - 1)).addClass('act');
	    TEXT.css('display', 'none');
	    TEXT.filter('.c' + (index)).fadeIn();
	});
    }    
}
})();
