/*delegates are the win*/
function Delegate(f)
{
	this.func = f;
}
Delegate.prototype.func = function(){}
Delegate.create = function(obj, func)
{
	var f = function()
	{
		var target = arguments.callee.target;
		var func = arguments.callee.func;
		if(func && target)
		    return func.apply(target, arguments);
		return null;
	};

	f.target = obj;
	f.func = func;

	return f;
}

Delegate.prototype.createDelegate = function(obj)
{
	return create(obj, func);
}

String.prototype.isEmail = function()
{
    var regex = new RegExp("^(([a-zA-Z0-9_\\-\\.]+)@([a-zA-Z0-9_\\-\\.]+)\\.([a-zA-Z]{2,5}){1,25})+([;.](([a-zA-Z0-9_\\-\\.]+)@([a-zA-Z0-9_\\-\\.]+)\.([a-zA-Z]{2,5}){1,25})+)*$");
    return regex.test(this);
}

var FluxSite = Class.create({
    initialize: function(){}
});

FluxSite.ProjectViewer = Class.create({
    imageContainerId: null,
    images: new Array(),
    descriptionContainerId: null,
    descriptions: new Array(),
    currentIndex: 0,
    backgroundShifter: null,
    initialize: function(imageContainerId, descriptionContainerId, shifter){
        this.imageContainerId = imageContainerId;
        this.descriptionContainerId = descriptionContainerId;
        //use prototype selector to get the images
        this.capture();
        if (shifter)
            this.backgroundShifter = shifter;

        this.currentIndex = this.images.length-1;
        if (this.currentIndex > 0)
            this.switchTo(0);
    },
    capture: function(){
        this.images = $$('#'+this.imageContainerId+' div');
        this.descriptions = $$('#'+this.descriptionContainerId+' div.project_description_container');
    },
    switchTo: function(imageIndex){
        if (this.currentIndex == imageIndex)
            return;
        if (this.images.length == 0)
            this.capture();
        //place the next on top z-index
        var currentImage = $(this.images[this.currentIndex]);
        var currentDescription = $(this.descriptions[this.currentIndex]);
        if (imageIndex >= this.images.length)
            this.currentIndex = 0;
        else
            this.currentIndex = imageIndex;
        var nextImage = this.images[this.currentIndex];
        var container = $(this.imageContainerId);
        if (nextImage && currentImage && container)
        {
            //display:none
            currentImage.style.zIndex = 99;
            nextImage.style.zIndex = 100;
            nextImage.hide();
            nextImage.appear({afterFinish: Delegate.create(currentImage, currentImage.hide)});

            //set the container to this images width
            //container.style.width = nextImage.getWidth() + 'px';
            //container.style.height = nextImage.getHeight() + 'px';
        }

        var nextDescription = this.descriptions[this.currentIndex];
        var descriptionContainer = $(this.descriptionContainerId);
        if (nextDescription && currentDescription && descriptionContainer)
        {
            //display:none
            var nextheight = nextDescription.getHeight();
            nextDescription.slideDown();
            /*nextImage.appear({afterFinish: Delegate.create(currentImage, currentImage.hide)});*/
            new Effect.Move(currentDescription, {y: nextheight+20, mode: 'relative'});
            currentDescription.fade({afterFinish: Delegate.create(currentDescription, this.resetDescription)})

            //get the width of the new background and we'll change the height to match
            var background = $('project_viewer_info_container_background');
            background.morph('height:'+(nextheight + 40)+'px;');
            descriptionContainer.morph('height:'+(nextheight+20)+'px');
        }
        
        if (this.backgroundShifter)
        {
            //try
            //{
                var projectId = nextImage.id.replace('project_image_','');
                this.backgroundShifter.switchToProject(projectId);
            //}
            //catch(err)
            //{
            //    this.backgroundShifter.switchToDefault();
            //}
        }
    },
    resetDescription: function() {
        this.style.top = "0px";
    }
});

FluxSite.ProjectViewerThumbList = Class.create({
    projectViewerObject: null,
    thumbnailContainerId: null,
    thumbnailContainer: null,
    thumbnailImages: new Array(),
    thumbnailSlider: null,
    thumbnailSliderWidth: 100,
    arrowBackId: null,
    arrowBack: null,
    arrowForwardId: null,
    arrowForward: null,
    pageSize: 6,
    currentPage: 0,
    currentMove: null,
    currentHighlight: null,
    initialize: function(projectViewerObject, thumbnailContainerId, arrowBackId, arrowForwardId){
        this.projectViewerObject = projectViewerObject;
        this.thumbnailContainerId = thumbnailContainerId;
        this.arrowBackId = arrowBackId;
        this.arrowForwardId = arrowForwardId;
        this.capture();
    },
    capture: function() {
        this.thumbnailContainer = $(this.thumbnailContainerId);
        this.thumbnailSlider = $$('#'+this.thumbnailContainerId+' div')[0];
        this.thumbnailImages = $$('#'+this.thumbnailContainerId+' img');
        this.arrowBack = $(this.arrowBackId);
        this.arrowForward = $(this.arrowForwardId);

        if (this.thumbnailSlider)
            this.thumbnailSlider.style.zIndex = 101;

        if (this.thumbnailImages.length > 0)
        {
            for (var i = 0; i < this.thumbnailImages.length; i++){
                this.thumbnailImages[i].observe('click', Delegate.create(this, this.onThumbnailClick));
                this.thumbnailImages[i].writeAttribute('project', i);
            }
        }
        if (this.arrowBack)
            this.arrowBack.observe('click', Delegate.create(this, this.onArrowBackClick));
        if (this.arrowForward)
            this.arrowForward.observe('click', Delegate.create(this, this.onArrowForwardClick));
    },
    switchTo: function(imageIndex){
        if (this.thumbnailSlider == null || this.thumbnailContainer == null){
            this.capture();
        }
        this.projectViewerObject.switchTo(imageIndex);
        //tween the selector over
        this.resetSelector(imageIndex);
    },
    resetSelector: function(exceptThisIndex) {
        for (var i = 0; i < this.thumbnailImages.length; i++) {
            var image = this.thumbnailImages[i];
            if (i != exceptThisIndex)
            {
                this.thumbnailImages[i].style.zIndex = 101;
                this.thumbnailImages[i].style.position = 'relative';
                new Effect.Morph(image, {style:'top:0px; border-top:1px;', duration:0.5});
                image.style.borderColor = '#b6aeac';
            }
            else {
                this.thumbnailImages[i].style.zIndex = 102;
                this.thumbnailImages[i].style.position = 'relative';
                new Effect.Morph(image, {style:'top:-15px; border-top:0px;', duration: 0.5});
                image.style.borderColor = '#9bb23c';
            }
        }
    },
    onThumbnailClick: function(e){
        var element = e.findElement();
        if (element)
        {
            var imageIndex = element.readAttribute('project');
            this.switchTo(imageIndex);
        }
    },
    onArrowBackClick: function(e){
        if (this.thumbnailSlider == null)
            this.capture();
        //we're passing this now because IE is stupid
        //var sliderWidth = this.thumbnailSlider.getWidth();
        var sliderWidth = this.thumbnailSliderWidth;
        if (this.currentPage > 0)
        {
            this.currentPage--;
            var destX = -(this.currentPage * sliderWidth);
            //var sliderPosition = this.thumbnailSlider.positionedOffset();

            if (this.currentMove)
                this.currentMove.cancel();
            this.currentMove = new Effect.Move(this.thumbnailSlider, {x:destX, y:13, mode: 'absolute'});
        }
    },
    onArrowForwardClick: function(e){
        if (this.thumbnailSlider == null)
            this.capture();
        //we're passing this now because IE is stupid
        //var sliderWidth = this.thumbnailSlider.getWidth();
        var sliderWidth = this.thumbnailSliderWidth;
        //alert(sliderWidth);
        if (this.currentPage < (Math.ceil(this.thumbnailImages.length / this.pageSize)-1))
        {
                this.currentPage++;
                var destX = -(sliderWidth * this.currentPage);
                var catchX = (destX * (this.currentPage - 1));

                if (destX <= catchX)
                {
                    new Effect.Move(this.thumbnailSlider, {x:destX, y:13, mode: 'absolute'});
                }
                else
                {
                    var destinationImageIndex = this.thumbnailImages.length - this.pageSize;
                    var position = this.thumbnailImages[destinationImageIndex].parentNode.positionedOffset();
                    destX = position.left - 8;
                    if (this.currentMove)
                        this.currentMove.cancel();
                    this.currentMove = new Effect.Move(this.thumbnailSlider, {x:-destX, y:13, mode: 'absolute'});
                }
                //this.updateArrows();
        }
    }
});


FluxSite.BackgroundShifter = Class.create({
    backgroundContainerId: null,
    backgrounds: new Array(),
    tagLines: new Array(),
    tagLineWidths: new Array(),
    currentIndex: -1,
    isActive: false,
    periodicalExecuter: null,
    initialize: function(backgroundContainerId)
    {
        this.backgroundContainerId = backgroundContainerId;
        this.capture();
    },
    capture: function(){
        this.backgrounds = $$('#'+this.backgroundContainerId+' div.backgroundimage');
        for (var i = 0; i < this.backgrounds.length; i++) {
            var children = this.backgrounds[i].childElements();
            for (var c = 0; c < children.length; c++) {
                if (children[c].hasClassName('tagline'))
                {
                    this.tagLines[i] = children[c];
                    this.tagLineWidths[i] = children[c].getWidth();
                    break;
                }
            }
        }
    },
    switchTo: function(imageIndex){
        if (this.currentIndex == imageIndex)
            return;
        if (this.backgrounds.length == 0)
            this.capture();
        //place the next on top z-index
        var currentImage = $(this.backgrounds[this.currentIndex]);
        var currentTagline = $(this.tagLines[this.currentIndex]);
        if (imageIndex >= this.backgrounds.length)
            this.currentIndex = 0;
        else
            this.currentIndex = imageIndex;
        var nextImage = this.backgrounds[this.currentIndex];
        var container = $(this.backgroundContainerId);
        
        if (nextImage && currentImage && container)
        {
            //display:none
            currentImage.style.zIndex = -5;
            nextImage.style.zIndex = -4;
            nextImage.style.width = "100%";
            nextImage.hide();
            nextImage.appear({afterFinish: Delegate.create(currentImage, currentImage.hide)});

            if (currentTagline)
            {
                currentTagline.style.zIndex = -6;
                new Effect.Morph(currentTagline, {style:'width:0px; right:100px', duration:0.8, afterFinish: Delegate.create(this, this.showCurrentTagline)});
            }
        }
    },
    switchNext: function() {
        var nextIndex = this.currentIndex + 1;
        if (nextIndex >= this.backgrounds.length)
            nextIndex = 0;
        this.switchTo(nextIndex);
        //alert('switching to ' + this.switchTo);
    },
    switchToProject: function (projectId)
    {
        for (var i = 0; i < this.backgrounds.length; i++) {
            var currentId = this.backgrounds[i].id.replace('project_background_', '');
            if (projectId.toString() == currentId.toString())
            {
                this.switchTo(i);
                return;
            }
        }
        this.switchToDefault();
    },
    switchToDefault: function()
    {
        var defaults = new Array();
        for (var i = 0; i < this.backgrounds.length; i++) {
            if (this.backgrounds[i].id.indexOf('project_background_default') == 0)
                defaults.push(i);
        }
        var random = Math.floor(Math.random()*(defaults.length-1));
        this.switchTo(defaults[random]);

        //this.switchTo(0);
    },
    start: function(intervalInSeconds)
    {
        this.stop();
        this.periodicalExecuter = new PeriodicalExecuter(Delegate.create(this, this.switchNext), intervalInSeconds);
        this.switchNext();
    },
    stop: function()
    {
        if (this.periodicalExecuter)
            this.periodicalExecuter.stop();
    },
    showCurrentTagline: function()
    {
        var nextTagline = this.tagLines[this.currentIndex];
        if (nextTagline)
        {
            nextTagline.style.zIndex = -3;
            nextTagline.style.right = "0px";
            nextTagline.morph('width: 500px', 0.5);
        }
    }
});

FluxSite.BackgroundImageObject = Class.create({
    url: "",
    projectId: 0,
    initialize: function(url, projectId){
        if (projectId)
            this.projectId = projectId;
        this.url = url;
    }
})

FluxSite.TagLineObject = Class.create({
    text: "",
    x: 0,
    y: 0,
    height: 0,
    width: 0,
    entersFrom: "",
    initialize: function(text, x, y, width, height, entersFrom){
        this.text = text;
        this.x = x;
        this.y = y;
        this.width = width;
        this.height = height;
        this.entersFrom = entersFrom;
    }
})