if(!window.YUKU) window.YUKU = {};
window.YUKU.gallery = {
 holderId:'image-holder',
 imageId:'image-full-size',
 indicatorId:'loading-indicator',
 indicatorImage: window.gs.staticServer + '/common/bypass/images/indicator.gif',


 loadImage: function(url) {
    this.addScreenCover();
    this.addHolder();
    var img = make_el('IMG', {id:this.imageId}, get_by_id(this.holderId));
    img.style.display = 'none';
    img.onload = YUKU.gallery.imageOnLoad;
    img.src = url;
    addEvent(document, 'click',YUKU.gallery.hideImage,false);
  },


 addScreenCover: function() {
    if(!this.screenCover)this.screenCover = new ScreenCover();
    this.screenCover.addCover();
  },


 removeScreenCover: function() {
    this.screenCover.fadeCover();
  },


 addHolder: function() {
    var holder = make_el('DIV',{id:this.holderId},document.body);
    var indx = make_el('IMG', {id:this.indicatorId,
	  src:this.indicatorImage},holder);
    holder.style.width = indx.width+'px';
    holder.style.height = indx.height+'px';
    holder.style.top = getScrollPos().y+'px';
    holder.style.marginLeft = '-'+holder.offsetWidth/2+'px';
  },


 removeHolder: function() {
    remove_el(get_by_id(this.holderId));
  },


 removeIndicator: function() {
    var id = this.indicatorId;
    var step = function(val) {
      set_opacity(get_by_id(id),val);
      if(val == 0)get_by_id(id).style.display = 'none';
    };
    (new Animator()).start(step,100,0,'out',300);
  },


 scaleHolder: function(toX,toY) {
    var an = new Animator();
    var st = get_by_id(this.holderId).style;
    var fromX = parseInt(st.width);
    var fromY = parseInt(st.height);
    var imgId = this.imageId;

    var fadeImage = function(val) {
      if(get_by_id(imgId))
	set_opacity(get_by_id(imgId),val);
    };

    var scaleY = function(val) {
      if(val >= toY) {
	val = toY;
	an.stop();
	if(get_by_id(imgId)) {
	  an.start(fadeImage,0,100,'out',300);
	  set_opacity(get_by_id(imgId),0);
	  get_by_id(imgId).style.display = '';
	}
      }
      st.height = val + 'px';
    };

    var scaleX = function(val) {
      if(val >= toX) {
	val = toX;
	an.stop();
	an.start(scaleY,fromY,toY,'out',200)
      }
      st.width = val + 'px';
      st.marginLeft = '-' + Math.round((val+30)/2)+'px';
    };
    an.start(scaleX,fromX,toX,'out',200);
  },


 imageOnLoad: function() {
    YUKU.gallery.removeIndicator();
    var img = get_by_id(YUKU.gallery.imageId);
    img.style.marginLeft = '-100000000px';
    img.style.display = 'block';
    var x = img.offsetWidth, y = img.offsetHeight;
    img.style.display = 'none';
    img.style.marginLeft = '0';
    YUKU.gallery.scaleHolder(x,y);
  },


 hideImage: function() {
    removeEvent(document, 'click',YUKU.gallery.hideImage,false);
    YUKU.gallery.removeHolder();
    YUKU.gallery.removeScreenCover();
  }
};

make_el('IMG',{src:window.YUKU.gallery.indicatorImage});