// produces (nested) tabs to show photos - December 2006

function Photo_Tabs() {
  var photospertab = 10;
  if(cp_info.photos == 0)
    return;       // nothing at all if no photos
  var tid = document.getElementById('photo_tab');
  if(cp_info.photos == 1) { // one photo - so no tabs
    Show_Photo(tid,cp_info.photo_i[0]);
    tid.style.border="1px solid black";
    tid.style.padding="5px";
    return;
  }
  if(cp_info.photos > photospertab) {   // nested tabs
    var otabs = new Tabs(tid);
    var tctr = -1;
    for(var i=0;i<= Math.floor(cp_info.photos/photospertab);i++) {
      ++tctr;
      Create_Inner_Phototab(otabs,tctr,i,photospertab,photospertab*tctr+1+' ...');
    }
  } else {    // only one level
    var tabs = new Tabs(tid);
    if(cp_info.photos_index == 'on')
      Add_Index(tabs,photospertab,0);
    for(var i=0; i<cp_info.photos;i++) {   
      Create_Photo_Tab(tabs,i);
    }
  }
}

function Create_Inner_Phototab(otabs,tctr,i,photospertab,label) {
  // we come here for 0 on the tab - return instead
  if(tctr*photospertab >= cp_info.photos)
    return;
  otabs.Add(label,function(paneElement) {
    if (paneElement.innerHTML == '') {
      var tname = '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(itab,photospertab,tctr*photospertab);
      for(i=0;i<photospertab;i++) {
        var num = tctr*photospertab+i;
	if(num < cp_info.photos)
          Create_Photo_Tab(itab,num);
      }
    }
  });
}

function Create_Photo_Tab(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(paneElement,cp_info.photo_i[index]);
    }
  });
}

function Show_Photo(where,index) {
  var xmlhttp=null;
  // first for all but IE, else for IE
  if (window.XMLHttpRequest) {
    xmlhttp=new XMLHttpRequest()
  } else if (window.ActiveXObject) {
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP")
  }
  if (xmlhttp == null) {
    alert("Sorry, your browser can't do this");
    return false;
  }
  xmlhttp.onreadystatechange=function() {
    // if xmlhttp shows "loaded"
    if (xmlhttp.readyState==4) {
      // if "OK"
      if (xmlhttp.status==200) {
	Display_Photo(where,index,xmlhttp.responseText);
      }  
    }
  };
  xmlhttp.open("GET","../cgi-bin/photo_info.cgi?"+index,true);
  xmlhttp.send(null)
}

// my curly-bracket escapes aren't wanted here
function deCurl(txt) {
  txt = txt.replace(/\{and\}/g,'&');
  txt = txt.replace(/\{quotes\}/g,'"');
  txt = txt.replace(/\{quote\}/g,"'");
  txt = txt.replace(/\{\{/g,'<');
  txt = txt.replace(/\}\}/g,'>');
  return txt;
}

function Display_Photo(where,index,xm) {
  var inf = eval('('+xm+')');
  r  = '<div id="phedit_'+index+'_show" style="border: 1px solid transparent; float:left; width:'+inf.normal_width+'px; height:'+inf.normal_height+'px">';
  var ur = inf.normal_url.replace('@',cp_info.photobase); 
  if(ur.indexOf('.jpg')==-1)
      ur += '.jpg';
  // used standalone (say in showing user's photos)
  if(typeof(Perhaps_Make_Editable) != 'function') {
      r += '<a class="quiet" href="../cgi-bin/showstuff.cgi?mode=photo&id='+inf.id+'"><img src="'+ur+'"></div></a>';
  } else {
  r += '<img src="'+ur+'"></div>';
  }
  r += '<div style="float:left; font-size:90%; padding:5px">';
  r += '<div style="font-style:italic">'+inf.caption+'</div>';
  r += '<div>Copyright <a class="quiet" href="../cgi-bin/showstuff.cgi?mode=user&id='+inf.puserid+'">'+inf.copyright+'</a></div>';
  if(inf.taken != 'date unknown')
    r += '<div>Taken '+inf.taken+'</div>';
  r += '</div>';
  r += '<div style="clear:both"></div>';
  where.innerHTML = r;
  if(typeof(Display_Photo_Callback) == 'function') {
      Display_Photo_Callback(where,inf);
  }
  var len=edit_boxes.push({field:"phedit_"+index,mode:"photo"});
  // because this is created after page load, we need to (perhaps) make
  // it editable
  if(typeof(Perhaps_Make_Editable) == 'function')
      Perhaps_Make_Editable(len-1);      
}

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

function Photo_Index(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 > cp_info.photos) {
    howmany = cp_info.photos - start;
  }
  for(i=0;i<howmany;i++) {
    if(tl == 0) {
      r+='<tr>';
    }
    r += '<td><img src="../photos/thumbnails/'+cp_info.photo_i[start]+'.jpg" 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;
}