// produces (nested) tabs to show photos - October 2009, Geograph version

var phodat;

function Gaz_Photos_Geograph() {
    var photospertab = 15;
    phodat = eval('('+cp_info.geograph+')');
    if(phodat.length == 0)
	return;       // nothing at all if no photos
    var tid = document.getElementById('geograph');
    if(phodat.length == 1) { // one photo - so no tabs
	Show_Photo_Geograph(tid,"0");
	tid.style.border="1px solid black";
	tid.style.padding="5px";
	return;
    }
    if(phodat.length > photospertab) {   // nested tabs
	var otabs = new Tabs(tid,'#AAFFAA,#88DD88');
	var tctr = -1;
	for(var i=0;i<= Math.floor(phodat.length/photospertab);i++) {
	    ++tctr;
	    Create_Inner_Phototab_Geograph(otabs,tctr,i,photospertab,photospertab*tctr+1+' ...');
	}
    } else {    // only one level
	var tabs = new Tabs(tid,'#AAFFAA,#88DD88');
	if(cp_info.photos_index == 'on')
	    Add_Index_Geograph(tabs,photospertab,0);
	for(var i=0; i<phodat.length;i++) {   
	    Create_Photo_Tab_Geograph(tabs,i);
	}
    }
}

function Create_Inner_Phototab_Geograph(otabs,tctr,i,photospertab,label) {
  // we come here for 0 on the tab - return instead
  if(tctr*photospertab >= phodat.length)
    return;
  otabs.Add(label,function(paneElement) {
    if (paneElement.innerHTML == '') {
      var tname = 'geo_pho_tab_'+tctr;
      paneElement.innerHTML = '<div id="'+tname+'"></div>';
      var itab = new Tabs(document.getElementById(tname),'#48D1CC,#C3B371');
      if(cp_info.photos_index == 'on')
        Add_Index_Geograph(itab,photospertab,tctr*photospertab);
      for(i=0;i<photospertab;i++) {
        var num = tctr*photospertab+i;
	if(num < phodat.length)
          Create_Photo_Tab_Geograph(itab,num);
      }
    }
  });
}

function Create_Photo_Tab_Geograph(tab,index) {
  var nt = tab.Add(index+1,function(paneElement) {
    if (paneElement.innerHTML == '') {
      // before anything else, put a skeleton in, to prevent collapse
      paneElement.innerHTML = '<div width="330" height="330" style="height: 330px; width:440px;">&nbsp;</div>';
      Show_Photo_Geograph(paneElement,index);
    }
  });
}

function Show_Photo_Geograph(where,index) {
    var inf = phodat[index];
    r  = '<table><tr><td><div style="border: 1px solid transparent;">';
    r += '<a href="'+inf.link+'"><img src="'+inf.medpic+'"></a></div></td><td>';
    r += '<div style="font-size:90%; padding:5px">';
    r += '<div><b>'+inf.title1+'</b><br><em>'+inf.description1+'</em></div>';
    r += '<div>By '+inf.creator+'</div>';
    r += '<div>Taken '+inf.date1+'</div>';
    if(inf.distance > 0.0)
	r += '<div>'+inf.distance+'km away</div>';
    r += '</div></td></tr></table>';
    r += '<div style="clear:both"></div>';
    where.innerHTML = r;
}

function Add_Index_Geograph(tab,photospertab,start) {
  tab.Add('Index',function(pe) {
    if(pe.innerHTML == '')
      pe.innerHTML = Photo_Index_Geograph(tab,photospertab,start);
  });
}

function Photo_Index_Geograph(tab,photospertab,start) {
  var r = '<table>';
  var perline = 5;
  var tl = 0;
  // for each inner tab set there is one used for the outer tab, and one for the index
 var tabid = Tabs.globalItems.length;   // first sub-tab on this pane
  var howmany = photospertab;
  if(start+photospertab > phodat.length) {
    howmany = phodat.length - start;
  }
  for(i=0;i<howmany;i++) {
    if(tl == 0) {
      r+='<tr>';
    }
    r += '<td><img src="'+phodat[start].thumbnail+'" onclick="Tabs.Switch('+tabid+')"><div class="photo_label">'+(start+1)+'</div></td>';
    ++tl;
    ++start;
    ++tabid;
    if(tl == perline) {
      r+='</tr>';
      tl = 0;
    }
  }
  if(tl != perline)
    r+='</tr>';
  r+='</table>'
  return r;
}