DEBUG_THUMB_NUMBER = false;
PLACEHOLDER_STYLE = "display: block; width: 85px; height: 85px; background: white; float: left;";
//PLACEHOLDER_STYLE += " border: 1px solid blue;";
MIN_SIZE = [85, 85];

var counter = 1;


function check_size(thumb) {
 if (DEBUG_THUMB_NUMBER) {    
 s = new Element("SPAN");
 s.innerHTML = "#"+counter;
 s.injectInside(thumb);
 counter ++;
 }
 var dim = thumb.getCoordinates();
 if (dim.width<MIN_SIZE[0]) thumb.setStyle("width", MIN_SIZE[0]);
 if (dim.height<MIN_SIZE[1]) thumb.setStyle("height", MIN_SIZE[1]);
}

function revert_axis(thumbs, num_lines) {
   // from up to down, then left to right
   var rows = Math.ceil(1.0*thumbs.length/num_lines);	
   cursor = thumbs[0];
   for (var i=1;i<thumbs.length;i++) {
     thumbs[i].remove(); 
   }
   for (var i=1;i<rows*num_lines;i++) {
     var translated_i = Math.floor((i%rows)*num_lines + i/rows);
     var thumb = thumbs[ translated_i];
     if (!thumb) {
        thumb = new Element("div", {'class':thumbs[0].className, 'style':PLACEHOLDER_STYLE});
     }
     thumb.injectAfter(cursor);
     cursor = thumb;
   }
}

function order_thumbs(thumbs, num_lines) {
 rows = Math.ceil(1.0*thumbs.length/num_lines);	
 for (var i = 0; i<thumbs.length; i++) {
   thumb = thumbs[i];
   thumb.setStyle("float", "left");
   if (i%rows==0 && i) {
      thumb.setStyle("clear", "both");
      b = new Element("br");
      b.injectBefore(thumb);
   }
 }
}

function organize_thumbs(selector, num_lines) {
   function organize (){
     var selector = this.selector;
     var num_lines = this.num_lines;
     $$(selector).each(check_size);
     revert_axis($$(selector), num_lines);
     order_thumbs($$(selector), num_lines);
     $$(selector).each(function (el) { el.setStyle("visibility", "visible"); });
   }
   var f = organize.bind({'selector':selector, 'num_lines':num_lines});
   $$(selector).each(function (el) { el.setStyle("visibility", "hidden"); });
   window.addEvent('load', f);
}