window.addEvent('domready',start);

function start()
{
  $('home').setStyle('opacity',0)
  add_click_events();
 // var trs = new Fx.Transition(Fx.Transitions.Quart);

  //new Fx.Style($('logo'),'opacity',{duration:2000}).start(0,1);
 // new Fx.Style($('menu'),'opacity',{duration:1000}).start(0,1); 
}

var selected = null;
var portfolios = [];
var links_portfolio = [];
function add_click_events()
{
  links_portfolio = $$('a.portfolio');
  var links_folder = $$('a.folder');
  var links_text = $$('a.text_page');
  var home_link = $('logo');
  var home_page = new Home(home_link);
  links_portfolio.each(function(portfolio,i){
    var p = new Portfolio(portfolio);
    portfolios[portfolio.title] = p;
  })

  links_folder.each(function(folder,i){
    var f = new Folder(folder);
  })
  
  links_text.each(function(link){
   var t = new TextPage(link);
  });
  
  $('next').addClass('hidden');
  $('prev').addClass('hidden');
  $('prev').addEvent('click',prev);
  $('next').addEvent('click',next);  
  home_page.open();
}
  
  
function prev()
{
  if(!($('travel').hasClass('hidden'))) $('travel').addClass('hidden');
  if(!$defined(selected)) 
  {
    return
  }
  selected.prev();
}

function next()
{
  if(!($('travel').hasClass('hidden'))) $('travel').addClass('hidden');
  if(!$defined(selected)) 
  {
     return
  }
  selected.next();
}

/* 
  --------------------------------------------------------------------------------> DOUGH
*/
var Dough = new Class(
{
  initialize:function(el)
  {
    this.dom = $(el);
    this.id = this.dom.getProperty('title');
    this.content = $(this.id);
    if(!$defined(this.content))
    {
      this.content = new Element('div',{id:this.id});
      $('content').adopt(this.content);
    }
    this.content.setStyle('opacity',0);
    this.fade = new Fx.Style(this.content,'opacity');
    this.dom.addEvent('click',this.open.bind(this));
  },
  open:function()
  {   
    if(!$('spinner').hasClass('hidden'))$('spinner').addClass('hidden');
    if(this.is_open()) return false;
    
    if(!($('travel').hasClass('hidden'))) $('travel').addClass('hidden');
    if($defined(selected)) selected.close();
    selected = this;
    $('pages').empty();
    this.dom.addClass('active');
    this.fade.start(0,1);
    this.content.removeClass('hidden'); 
    return true
  },
  
  close:function()
  {
    if($defined(this.content))
    {
      this.content.addClass('hidden');
      this.fade.set(0);
    }
    this.dom.removeClass('active');  
  },
  
  show:function(response)
  {
    if(!this.is_open()) return
    this.fade.start(0,1);
  },
  
  is_open:function()
  {
    
    if($defined(selected) && selected == this) return true
    return false
  },
  
  next:function()
  {
    if($defined(this.selected) && $defined(this.selected.getNext()))
    {
      this.select(this.selected.getNext());
      return
    }
    var p = this.dom.getParent().getNext();
    if(!$defined(p)) p = $E('a.active','menu').getParent().getNext();
    if(!$defined(p)) return
    p.getChildren()[0].fireEvent('click',{auto:true,last:false});
    return
      
  },
  
  prev:function()
  {
    if($defined(this.selected) && $defined(this.selected.getPrevious() ))
    {
      this.select(this.selected.getPrevious());
      return
    }
    var p = this.dom.getParent().getPrevious();
    
    if(!$defined(p)) p = $E('a.active','menu').getParent().getPrevious();
    if(!$defined(p)) return
    p.getChildren()[0].fireEvent('click',{auto:true, last:true});
    return
  },
  
  is_subfolder:function()
  {
    if($defined(this.parent_folder)) return true
    return false
  }
})

/*
  --------------------------------------------------------------------------------> HOME
*/
var Home = Dough.extend(
  {
    initialize:function(el)
    {
      this.parent(el);
    },
    
    open:function()
    {
      if(!this.parent()) return
      this.content.removeClass('hidden');
      $$('img.tile').each(function(img,i)
      {
        img.setStyle('opacity',0);
        if(img.complete) 
        {
          new Fx.Style(img,'opacity',{duration:((i+1) * 200)}).start(0,1);
        }
        else
        {
          new Fx.Style(img,'opacity',{duration:((i+1) * 200)}).start(0,1); 
          img.src = img.src;     
        }
      })     
    },
    
    close:function()
    {
      this.content.setStyle('opacity',0);
      this.content.addClass('hidden');
    }
  })


/*
  --------------------------------------------------------------------------------> PORTFOLIO
*/
var Portfolio = Dough.extend({
  initialize:function(el)
  {
    this.parent(el)
    this.img_count = 1;
    this.images = [];
    this.selected = null;
    this._loaded = false;
    this.parent_folder = null;
    this.fades = {};
  },
  
  open:function()
  {
    if(!this.parent()) return
    
    if($('next').hasClass('hidden')) {
      $('next').removeClass('hidden');
      $('prev').removeClass('hidden');
    }
    $('pages').empty();
    if(this.is_subfolder()) 
    {
      this.parent_folder.on_act(this.dom.title.toUpperCase());
    }
    
    this.set_links();        
    if(!this.is_fully_loaded()) this.loadNextImage();
    this.selected = null;

    for(f in this.fades){
      this.fades[f].stop();
      this.fades[f].set(0);
    };
    if($defined(this.images[0]))this.select(this.images[0]);
  },
  
  close:function()
  {  
     
    this.parent();
    if(this.is_subfolder()) this.parent_folder.on_deact(this.dom.title.toUpperCase());
    for(f in this.fades){
      this.fades[f].stop();
      this.fades[f].set(0);
    };
    this.selected = null;
  },
  
  set_links:function()
  {
    var obj = this;
    this.images.each(function(img,i)
    {
      if($defined(img))
      {
       obj.add_image_link((i+1),'select',img);   
      }
          
    });
  },
  
  is_fully_loaded:function()
  {
    if(this._loaded) return true
    return false
  },
  
  preload:function()
  {
    
  },
  
  loadNextImage:function()
  {

    if(!this.is_open()) 
    {
      return
    }
    
    $('spinner').removeClass('hidden');
    var obj = this;
    this.img_count = this.images.length+1;
    var img_id = this.id+'_img_'+this.img_count;
    var spinner = $E('div.spinner','pages');
    if(!$defined(spinner)) {
      $('pages').adopt($('minispinner').clone());
      spinner = $E('div.spinner','pages');
      spinner.removeClass('hidden');
      spinner.setStyle('display','inline')
    }

    if(!$defined($(img_id)))
    {
      var img = new Element('img',
      {
        'id':img_id,
        'events': 
        {
          'error':function(){obj.endLoadSequence();},
          'load':function() {
            obj.fades[img.id].set(0);
            obj.check_image.delay(50,obj,img);
            if(this == undefined) {
             // alert( alert('complete'+this))
            }
          }
        }
      });
      
      this.fades[img.id] = new Fx.Style(img,'opacity');
      var link = new Element('a',{'class':'img_link hidden','href':"#", 'id':img.id+'_link'});
      link.injectBefore(spinner);
      img.src = 'assets/'+this.id+'/'+this.doublify(this.img_count)+'.jpg';
        
    }
    else
    {
      this.check_image($(img_id));
    }
  },
  
  doublify:function(number)
  {
    if(number<10) return '0'+String(number); 
    return String(number);
  },
  
  check_image:function(img)
  {
    this.content.adopt(img);
    this.images.push(img);
       
    if(this.is_open())
    {
      
        this.add_image_link(this.img_count,'select',img);
        if(this.img_count == 1) this.select(img);
    }
    this.loadNextImage();
  },
  
  create_image_link:function(label,action,img)
  {
    if(!this.is_open()) return
    if($defined(this.link_of(img))) 
    {
      if(!$defined(img)) return
      var link =  this.link_of(img);
      link.removeClass('hidden');
      link.setHTML('&nbsp;');
      link.addEvent('click',this.select.bind(this,img,link));
    }
    else
    {
      
       if($defined(img) || action == 'select')
        {
          var link = new Element('a',{'class':'img_link','href':"#", 'id':img.id+'_link'});
          link.setHTML('&nbsp;');

          link.addEvent('click',this.select.bind(this,img,link));
          var N = Number(label)-1;
          var prev_link = $(this.id+'_img_'+N+'_link');
          if($defined(prev_link)) 
          {
              link.injectAfter($(prev_link));
          }
          else
          {
              $('pages').adopt(link);
          }

          //var myFx = new Fx.Style(link, 'opacity').start(0,1);
        }
    }
    
     
   
    return link
  },
  
  add_image_link:function(label,action,img)
  {
    if(!this.is_open()) return
    var link = this.create_image_link(label,action,img);
    return link
  },
  
  link_of:function(img)
  {
    if(!$defined(img)) return
    return $(img.id+'_link')
  },
  
  endLoadSequence:function()
  {
    this._loaded = true;
    if(!this.is_open()) return
    $E('div.spinner','pages').remove();
    $('pages').getLast().remove();
    $('spinner').removeClass('hidden');
  },
  
  select:function(img)
  {
    if(!this.is_open()) return
    var link = this.link_of(img);
    if(!$defined(link)) return
    if($defined(this.selected))
    {
      this.link_of(this.selected).removeClass('active');
      this.fades[this.selected.id].stop();
      this.fades[this.selected.id].start(1,0);  
    }
    
    this.selected = img;
    link.addClass('active')
    this.fades[this.selected.id].stop();
    this.fades[this.selected.id].start(0,1);
  }
  
})
/*
 -----> TextPage
*/

var TextPage = Dough.extend({
  initialize:function(el)
  {
    this.parent(el)
    this.url = this.id+'.html';
  },
  
  open:function()
  {
    if(!this.parent()) return
    $('spinner').addClass('hidden');
    if(this.content.getChildren().length == 0)
    {
      var obj = this;
       new Ajax(this.url,{
          method:'get',
          update:$(this.id),
          onSuccess:this.show.bindAsEventListener(this)
        }).request();
    }
    else
    {
      this.show();
    }
  }
})


/*
 -----> Folder
*/
var Folder = Dough.extend({
  initialize:function(el)
  {
    this.parent(el);
    this.content.setStyle('opacity',1);
    var obj = this;
    $ES('a.portfolio',this.content).each(function(p)
    {
      portfolios[p.title].parent_folder = obj;
    })
  },
  open:function(options)
  {
    if($defined(options) && options.auto == true)
    {
      
      if(options.last == true)
      {
        //console.log(this.content.getChildren()[0].getLast().getLast())
        this.content.getChildren()[0].getLast().getLast().fireEvent('click');    
      }
      else
      {
        this.content.getChildren()[0].getChildren()[0].getLast().fireEvent('click');    
      }
      
    }
    else
    {
      this.content.removeClass('hidden');
      this.content.addEvent('mouseleave',this.close.bindAsEventListener(this));     
    }
   
  },
  close:function()
  {
    if(!this.content.hasClass('hidden')) this.content.addClass('hidden');
  },
  on_act:function(folder)
  {
    var E = new Element('span');
    E.appendText(folder+'  ')
    $('pages').adopt(E)
    this.dom.addClass('active');
    this.close();
  },
  on_deact:function(folder)
  {
    this.dom.removeClass('active');
  }
})