PhotosViewer = {
  $list_box: null,
  $big_box: null,
  scrollable_obj: null,

  init: function()
  {
    var _this = this;
    this.$list_box = $('photos');
    this.$big_box = $('big-photo');
    this.scrollable_obj = new ScrollableZone(this.$list_box);
    this.$list_box.getElements('.list-wrapper li a').each(function($el) {
      $el.addEvent('click', function(e) {
        _this.displayPhoto(this.href);
        e.preventDefault();
      })
    });


  },

  displayPhoto: function(url)
  {
    var _this = this;
    var $img = Asset.image(url, { onLoad: function(){
      _this.openBigBox($img);
    }});


    //var $img = new Element('img', {'alt': '', 'src': url});

  },

  openBigBox: function($img)
  {
    this.$big_box.empty();
    this.$big_box.adopt($img)

    //-- ouverture
    this.$big_box.setStyle('height', 0);
    this.$big_box.setStyle('display', 'block');
    var fx = new Fx.Tween(this.$big_box, {
      "duration" : "200",
      "transition": Fx.Transitions.Quad.easeOut
    });
    fx.start('height', $img.height);

    if ($img.width < 600)
      this.$big_box.setStyle('width', $img.width);
    else
      this.$big_box.setStyle('width', '');
  }
}
