// Image swapping for project mini images
Ext.onReady(function() {
  // var sectionDir = 'public_photo/';
  var imagesPathPrefix = '/images/portfolio_images/' + LGood.sectionDir;
  var projectImgSmall = Ext.get('project-image-small');
  var curImageIndex = 0;
  
  // Click on small image
  projectImgSmall.on('click', function(evt, t) {
    evt.preventDefault();
    var imagePathParts = projectImgSmall.getAttribute('src').split('_sm');
    var imagePath = imagePathParts.join('');
    var tHref = Ext.get(t).findParentNode('a').href;
    window.location.href = tHref + '?imagePath=' + imagePath;
  }, this);
  
  var projectSmallImages = [];
  Ext.select('a.project-image.swap').each(function(el) {
    var imageSrc = imagesPathPrefix + el.getAttribute('data-image');
    projectSmallImages.push(imageSrc);
  });
  
  // Handler for image number clicks
  Ext.select('a.project-image.swap').on('click', function(evt, t) {
    evt.preventDefault();
    var dataImage = Ext.get(t).getAttribute('data-image');
    var imageSrc = imagesPathPrefix + dataImage;
    projectImgSmall.set({src: imageSrc});
    curImageIndex = projectSmallImages.indexOf(imageSrc);
  }, this);
  
  // Iterate through all photos in stack, then to next project
  // Handle next arrow click
  Ext.select('a.project-next-photo').on('click', function(evt, t) {
    var nextIndex = curImageIndex + 1;
    if (nextIndex < projectSmallImages.length) {
      evt.preventDefault();
    }
    projectImgSmall.set({src: projectSmallImages[nextIndex]});
    curImageIndex = nextIndex;
  }, this);
  
  // Set to the first image
  projectImgSmall.set({src: projectSmallImages[curImageIndex]});
});