Shadowbox.loadSkin('classic', 'js/shadowbox/skin');
Shadowbox.loadLanguage('en', 'js/shadowbox/lang');
Shadowbox.loadPlayer(['img'], 'js/shadowbox/player');



window.addEvent('domready', function(){
    var activePage;
    
    Shadowbox.init();
    
    function resizeContent(content){
        
        //fixa a largura tamanho minima em 510px
        var newWidth = (content.getStyle('width').toInt() > 510) ?
                        content.getStyle('width').toInt() : 510;
        var newHeight = ((content.getStyle('height').toInt() + 50) > 413) ?
                        content.getStyle('height').toInt() + 50 : 413;
        var marginLeft = newWidth/2;
        var marginTop  = newHeight/2;
        var newLeft = window.getWidth()/2;
        var newTop  = window.getHeight()/2;
        
        if (activePage != content){
            return;
        }
        
        if ((newLeft - marginLeft) < 0){
            newLeft = 0;
            marginLeft = 0;
        } else {
            newLeft = '50%';
            marginLeft = -1 * marginLeft;
        }
        
        if ((newTop - marginTop) < 0){
            newTop = 0;
            marginTop = 0;
        } else {
            newTop = '50%';
            marginTop = -1 * marginTop;
        }
        
	 // alert('width: ' + newWidth + ' | height: ' + newHeight);
	//  alert('width: ' + window.getScrollWidth() + ' height: ' + window.getScrollHeight());
	  /* only for IE */
	  if (Browser.Engine.trident){
	     $('container').setStyle('width', newWidth + 40);
	     $('container').setStyle('height', newHeight + 30);
	  }
	  else{
           $('container').setStyle('width', newWidth);
	     $('container').setStyle('height', newHeight);
	  }
         
	  $('container').setStyle('top', newTop);
        $('container').setStyle('left', newLeft);
        $('container').setStyle('margin-top', marginTop);
        $('container').setStyle('margin-left', marginLeft);
    }
    
    var myEffect = new Fx.Tween($('container'),
                                {property: 'opacity', duration: 500,wait: true});
    
    var boxEffect = new Fx.Tween($('progress-bar'),
                                {property: 'opacity', duration: 500,wait: true});
    
    var arquiteturaGallery = new Gallery({container: $('arquitetura-gallery'),
                                          path: 'fotos/arquitetura',
                                          callback: function(){ resizeContent($('arquitetura-div'));},
                                          shadowbox: Shadowbox});
    
    var retratosGallery = new Gallery({container: $('retratos-gallery'),
                                          path: 'fotos/retratos',
                                          callback: function(){ resizeContent($('retratos-div'));},
                                          shadowbox: Shadowbox});
    
    
    var cenografiaGallery = new Gallery({container: $('cenografia-gallery'),
                                          path: 'fotos/cenografia',
                                          callback: function(){ resizeContent($('cenografia-div'));},
                                          shadowbox: Shadowbox});
    
    
    var homeLoaderCallback = function() {  
            
            //$('container').setStyle('display','block');
            $('progress-bar').setStyle('display','none');
        
        
            retratosGallery.preload();
            arquiteturaGallery.preload();
            cenografiaGallery.preload();
        
            activePage = $('home-div');
            
            var rotater1 = new Rotater('.slideEsquerda',{ //Class of elements that should rotate.
                autoplay: true,
                slideInterval:4000, //Length of showing each element, in milliseconds
                transitionDuration:1000 //Length crossfading transition, in milliseconds
            });
            
            var rotater2 = new Rotater('.slideCentro',{ //Class of elements that should rotate.
                autoplay: true,
                slideInterval:4000, //Length of showing each element, in milliseconds
                transitionDuration:1000 //Length crossfading transition, in milliseconds
            });
            
            var rotater3 = new Rotater('.slideDireita',{ //Class of elements that should rotate.
                autoplay: true,
                slideInterval:4000, //Length of showing each element, in milliseconds
                transitionDuration:1000 //Length crossfading transition, in milliseconds
            });
        
            //myEffect.start(1);
        };
     
    
     /* progress bar */  
    var progressBar = new ProgressBar({  
        container: $('progress-bar'),  
        startPercentage: 0,  
        speed:10,  
        boxID: 'progress-box',  
        percentageID: 'progress-perc',  
        displayID: 'progress-text',  
        displayText: true  
    }); 
    
    var sliceGallery = new SliceGallery({container: $('home-div'),
                                         path: './fotos/home',
                                         callback: homeLoaderCallback,
                                         progressBar: progressBar});
    
    sliceGallery.preload();
    
   var menu = [{text: 'Graziella Widman . fotógrafa',id: 'home'},
               {text: 'arquitetura',id: 'arquitetura'},
               {text: 'retratos',id: 'retratos'},
               {text: 'cenografia',id: 'cenografia'},
               {text: 'biografia',id: 'biografia'},
               {text: 'contato',id: 'contato'}];
    

    function updateMenu(activeItem){
        $('navlist').empty();
        
        var activeElement, firstElement;
        
	  for (var i=0; i < menu.length; i++){
	  	if (menu[i].id == 'home'){
                new Element('li',{'id':menu[i].id, 'class':'home-link'}).
                set('text',menu[i].text + ' : ').inject($('navlist'));
            }
            else if (menu[i].id == activeItem.id){
                activeElement = menu[i]; 
            } 
		else {
		    var text;
		    
		    if ((menu.length - i - 1) == 0 ||
			  ((menu.length - i - 1) == 1 && activeElement == null && activeItem.id != 'home')){
		    	  text = menu[i].text;
		    }else {
		    	  text = menu[i].text + ' . ';
		    }

		    new Element('li',{'id':menu[i].id}).
                set('text',text).inject($('navlist'));
            }	  
        }
        
        if (activeItem.id != 'home'){
            new Element('li',{'id':activeElement.id,'class':'active'}).
                set('text',' : ' + activeElement.text).inject($('navlist'));
        }
        
        createEvents();
    }
    
    var createEvents = function(){
        $$('#navlist li').each(function(item){
            item.addEvent('click', function(){
                myEffect.start(0).chain(function(){
                    
                    //workaround para resolver o problema do form ja utilizado
                    if (item.get('id') == 'contato'){
                        $('log_res').empty();
                        $('log_res').removeClass('error');
                        $('form-div').setStyle('display','block');
                    }
                    
                    activePage.setStyle('display','none');
                    activePage = $(item.id + '-div');
                    activePage.setStyle('display','block');
                    resizeContent(activePage);
                    updateMenu(item);
                    myEffect.start(1);
                });
            });
        });
    }
    
    createEvents();
     
     
    $('form').addEvent('submit', function(e) {
        e.stop();
        
        var log = $('log_res').empty(); 
        log.removeClass('error');
        log.set('html', '<img src="imgs/spinner.gif" /> Enviando... ');
        
        this.set('send', { onComplete: function(response) { 
                
                var ret = JSON.decode(response);
                
                log.empty();
                log.set('html', ret.message);
                
                if(ret.code == 1){
                    $('form-div').setStyle('display','none'); 
                    $('nome').set('value','');
                    $('email').set('value','');
                    $('telefone').set('value','');
                    $('comentarios').set('value','');
                    log.addClass('obrigado');
                } else {
                    log.addClass('error');
                } 
                
                
        }});
        
        this.send();
    });
});