/*******************
* @author david stump
* @author matt mcnamara
*
********************/

var all_images = [];
var used_images = [];

var MINIMUM_DELAY = 2000;
var MAXIMUM_DELAY = 5000;
var NUM_COLLAGE_SPOTS = 14;

function shuffle(array) {
  var tmp, current, top = array.length;
  if(top) while(--top) {
    current = Math.floor(Math.random() * (top + 1));
    tmp = array[current];
    array[current] = array[top];
    array[top] = tmp;
  }
  return array;
}

$(document).ready(function() {

	$('.image-block').css('cursor', 'pointer').click(function() {
		changePicture(parseInt($(this).attr('id').substr(5)) - 1, false);
		return false;
	});

  //get all images from json file
  $.getJSON('/js/images.json.txt', function(json) {
    $(json.images).each(function(i, image) {
      all_images[i] = [];
      all_images[i]['src'] = image.url;
      all_images[i]['width'] = image.width;
      all_images[i]['height'] = image.height;
    });
    all_images = shuffle(all_images);
    init();
  });
  
  //initial population of collage
  function init() {
    //setup empty used_images
    for(i = 0; i < $('.image-block').size(); i++) {
      used_images[i] = [];
      used_images[i]['position'] = i + 1;
      used_images[i]['src='] = "";
      used_images[i]['width'] = 0;
      used_images[i]['height'] = 0;
      changePicture(i, false);
    }
    rotate();
  }
  
  function rotate() {
    setTimeout(function() {
      changePicture(Math.floor(Math.random()*NUM_COLLAGE_SPOTS), true);
    }, Math.floor(Math.random()*(MAXIMUM_DELAY - MINIMUM_DELAY)) + MINIMUM_DELAY);
  }  
  //change out a specific picture
  function changePicture(idx, keepRotating) {
    all_images = shuffle(all_images);
    //used_images = shuffle(used_images);
    //get information on existing picture in this space
    var position = "#block" + used_images[idx]['position'];
    
    //get image and parameters
    var image = all_images.shift();
    var image_width = parseInt(image.width);
    var image_height = parseInt(image.height);
    image.position = used_images[idx]['position'];
    var block_width = $(position).width();
    var block_height = $(position).height();
    
    var old_image = used_images[idx];
    
    //check if image is large enough
    if ((image_width >= block_width) && (image_height >= block_height)) {
        $(position).children("img").fadeOut(350, function() {
          $(position).children("img").attr('src',image.src);
          
          //find contraint and adjust size of image accordingly
          var scaledImageWidth = Math.ceil((image_width*block_height)/image_height);
          var scaledImageHeight = Math.ceil((image_height*block_width)/image_width);
          if ((scaledImageWidth >= block_width)) {
            $(position).children("img").attr("width", scaledImageWidth).removeAttr("height");
            $(position).children('img').css('left', -.50 * parseInt(scaledImageWidth - block_width)).css('top', 0);
          } else {
            $(position).children("img").attr("height", scaledImageHeight).removeAttr("width");
            $(position).children('img').css('top',  -.50 * parseInt(scaledImageHeight - block_height)).css('left', 0);
          }
         
          used_images[idx] = image;
          all_images.push(old_image);
          
          $(position).children("img").fadeIn(1000);
          if(keepRotating)
            rotate();
        });
    
    } else {
      //too small - put it back into the array and then try to put in another picture
      all_images.push(image);
      changePicture(idx, keepRotating);
    }
  }
});