function addListener(elem, event, call_back)
{
  try
  {
    if (elem.addEventListener)
    {
      if((event == 'mousewheel') && isFF)
      {
        elem.addEventListener('DOMMouseScroll', call_back, false);
      }
      else
      {
        elem.addEventListener(event, call_back, false);
      }
    }
    else if (elem.attachEvent)
    {
      elem.attachEvent('on'+event, call_back);
    }
    else {}
  }
  catch(e)
  {
    alert(e.toString());
  }
}
function getElement(id)
{
  return document.getElementById(id);
}
function getElementsByClass(searchClass,node,tag)
{
        var classElements = [];

        if (node == null)
        {
          node = document;
        }

        if (tag == null)
        {
          tag = '*';
        }

        var els = node.getElementsByTagName(tag);
        var elsLen = els.length;

        var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
        var i;
        for (i = 0; i < elsLen; i++)
        {
          if (pattern.test(els[i].className))
          {
            classElements[classElements.length] = els[i];
          }
        }

        return classElements;
}

function MovingObject(object)
{
  this.x = 0;
  this.y = 0;
  this.object = null;
  this.timer = null;
  this.finished = true;
  this.hardless =  1;
  this.acceleration =  0.8;
  this.range =  10;


  var self = this;
  function __construct()
  {
    var type =  typeof object;

    if(type == 'string')
    {
      self.object = document.getElementById(object);
    }
    else if(type  == 'object')
    {
      self.object = object;
    }
  }

  __construct();
}

function _MovingObject_setX(x)
{
  this.object.style.left = x + 'px';
  this.x = x;

  return x;
}

MovingObject.prototype.setX = _MovingObject_setX;

function _MovingObject_setY(y)
{
  this.object.style.top = y + 'px';
  this.y = y;

  return y;
}

MovingObject.prototype.setY = _MovingObject_setY;


function _MovingObject_getX()
{
  return this.x;
}

MovingObject.prototype.getX = _MovingObject_getX;


function _MovingObject_getY()
{
  return this.y;
}

MovingObject.prototype.getY = _MovingObject_getY;


function _MovingObject_go(x, y, callBackFunc)
{
  var self  = this;

  var nowX  = this.setX(self.object.offsetLeft),
      nowY  = this.setY(self.object.offsetTop),
      distance = getDistance(nowX, x, nowY, y);

  clearInterval(self.timer);

  if(distance)
  {
    var sin = (y - nowY) / distance,
        cos = (x - nowX) / distance,
        limit=Math.atan(this.range),
        halfLimit=limit*2,
        run=-this.range,
        oldX=nowX,
        oldY=nowY,
        acceleration=this.acceleration*this.hardless;

    this.timer = setInterval(go, 15);
    this.finished = false;
  }

  function getDistance(x1, x2, y1, y2)
  {
    return Math.sqrt(Math.pow(x1 - x2, 2) + Math.pow(y1 - y2, 2));
  }

  function go()
  {
	 kx=((Math.atan(run * self.hardless)+limit)/halfLimit)*distance;
     nowX = oldX + cos * kx;
     nowY = oldY + sin * kx;

     run += acceleration;
     if(run>self.range)
     {
       clearInterval(self.timer);
       nowX = x;
       nowY = y;
       self.finished = true;
     }

     self.setX(nowX);
     self.setY(nowY);

     if(self.finished)
     {
       if(callBackFunc)
       {
         try
         {
           callBackFunc(self);
         }
         catch(e){ alert(e); }
       }
     }
  }

}

MovingObject.prototype.go = _MovingObject_go;

var IMG_DIR = '_gallery/';

function PortfolioImage(previewSrc, imgSrc, description)
{
  this.previewImg = new Image;
  this.img = new Image;
  this.description = description;

  this.previewImg.src = previewSrc;
  this.img.src = imgSrc;
}

function Portfolio(portfolioId, previewId, frameId, infoId)
{
  this.images = [];
  this.iCount = 0;
  this.portfolio = null;
  this.preview = null;
  this.frame = null;
  this.info = null;
  this.frameObj = null;
  this.portfolioWidth = 0;
  this.selected = 0;

  var self = this;
  function __construct()
  {
    self.portfolio = getElement(portfolioId);
    self.preview = getElement(previewId);
    self.frame = getElement(frameId);
    self.info = getElement(infoId);
    self.portfolio_img= getElement('portfolio_img');

    if(self.portfolio && self.preview && self.frame && self.info)
    {
      self.portfolioWidth = self.portfolio.offsetWidth;
      self.frameObj = new MovingObject(self.frame);
      self.frameObj.acceleration = 1;

      var i, n = self.iCount, left = Math.ceil(document.body.offsetWidth * 0.06);
      for(i=0; i < n; ++i)
      {
        self.preview.appendChild(self.images[i].previewImg);
        self.images[i].previewImg.style.left = left + 'px';
        left += self.images[i].previewImg.offsetWidth + 24;
        addListener(self.images[i].previewImg, 'click', selectImage);
        self.images[i].previewImg.id = 'prev_img_' + i;

        self.images[i].img.style.display = 'none';
        self.portfolio.appendChild(self.images[i].img);
        self.images[i].movingObj = new MovingObject(self.images[i].img);
        self.images[i].movingObj.imgId = i;
      }
      oldSelected = self.selected;
      self.frame.style.left = self.images[self.selected].previewImg.offsetLeft - 5 + 'px';
      self.frame.style.top = self.images[self.selected].previewImg.offsetTop - 5 + 'px';
      self.frame.style.width = self.images[self.selected].previewImg.offsetWidth + 22 + 'px';
     // moveFrame(self.selected);
      self.frame.style.display = 'block';
      //self.info.innerHTML = self.images[self.selected].description;

      var img = self.images[self.selected].img;
      img.style.display = 'block';
      img.style.left = Math.ceil(self.portfolioWidth / 2 - img.offsetWidth /2) +'px';


newHeight=self.images[self.selected].img.offsetHeight;
if(newHeight>self.portfolio_img.offsetHeight)
self.portfolio_img.style.height=newHeight+'px';

    }
  }

  var width, timer;
  function moveFrame(imgId)
  {
    var img = self.images[imgId].previewImg;

    width = img.offsetWidth + 22;

//    self.frameObj.go(img.offsetLeft - 5, 19);
    self.frameObj.go(img.offsetLeft - 5, img.offsetTop - 5);


    clearTimeout(timer);
    timer = setTimeout(changeWidth, 100);
  }

  function changeWidth()
  {
    self.frame.style.width = width + 'px';
    clearTimeout(timer);
  }

  var oldSelected;
  function selectImage(event)
  {
    var prevImg = event.target || event.srcElement;
    oldSelected = self.selected;
    self.selected = parseInt(prevImg.id.substr(9),10);

    moveFrame(self.selected);
    //self.info.innerHTML = self.images[self.selected].description;

    changeImage();
  }

  //var interval;
  function changeImage()
  {
    if(oldSelected == self.selected) return;

    var selected = self.images[self.selected],
        old = self.images[oldSelected];

    selected.img.style.display = 'block';


newHeight=selected.img.offsetHeight;
if(newHeight>self.portfolio_img.offsetHeight)
self.portfolio_img.style.height=newHeight+'px';



    if(self.selected - oldSelected > 0)
    {
       old.movingObj.go(- old.img.offsetWidth, 0, hideOld);
       selected.img.style.left = self.portfolioWidth +'px';
    }
    else
    {
       old.movingObj.go(Math.ceil(self.portfolioWidth), 0 , hideOld);
       selected.img.style.left = - selected.img.offsetWidth +'px';
    }


    selected.movingObj.go(Math.ceil(self.portfolioWidth / 2 - selected.img.offsetWidth / 2), 0);

    selected.movingObj.oldId = oldSelected;
    location.hash = (self.selected + 1);

    //clearInterval(interval);
    //interval = setInterval(hideOld, 100);
    function hideOld(mvObj)
    {
     // if(old.movingObj.finished)
     // {
       // clearInterval(interval);
        self.images[mvObj.imgId].img.style.display = 'none';
        //old.img.style.display = 'none';
     // }
    }
  }

  function resize()
  {
    self.portfolioWidth = self.portfolio.offsetWidth;
    self.images[self.selected].img.style.left = Math.ceil(self.portfolioWidth / 2 - self.images[self.selected].img.offsetWidth / 2) + 'px';

    var i, n = self.iCount, left = Math.ceil(document.body.offsetWidth * 0.06);
    for(i=0; i < n; ++i)
    {

        self.images[i].previewImg.style.left = left + 'px';
        left += self.images[i].previewImg.offsetWidth + 24;
    }
    moveFrame(self.selected);
  }

  addListener(window, 'load', __construct);
  addListener(window, 'resize', resize);
}

function _Portfolio_addImage(previewSrc, imageSrc, description)
{
  this.images[this.iCount] = new PortfolioImage(previewSrc, imageSrc, description);
  ++this.iCount;
}

Portfolio.prototype.addImage = _Portfolio_addImage;

function _Portfolio_select(imgId)
{

  if(this.images[imgId])
  {
    this.selected = imgId;
  }

}

Portfolio.prototype.select = _Portfolio_select;