var imgDiv, img;
var mouseX = 0;
var mouseY = 0;
var showingImage=0;
var AJAX_DOTS_LIMIT=80;

document.onmousemove  = trackMouse;
document.onmousedown = clickMouse;
init();

try {
  document.execCommand("BackgroundImageCache", false, true);
} catch(err) {}

function clickMouse( e ) { hideBigImage(); } // hideOneExif(); }
function trackMouse( e )
{
  mouseX = e ? e.pageX : (event.clientX + document.body.scrollLeft);   // e (Firefox)
  mouseY = e ? e.pageY : (event.clientY + document.body.scrollTop);
}

function init()
{
/*    var imgDiv = document.getElementById( "bigImageDiv" );   imgDiv.style.display="none";   // hide
        imgDiv = document.getElementById( "oneExifDiv"  );   imgDiv.style.display="none";   // hide -- doesn't work
*/
}

function goSearchPicture(value, getId)
{
    var imgDiv=document.getElementById( 'searchPicture' );
    if (value=="") { 
      var myMenu=document.getElementById( getId ); 
      value=myMenu.options[myMenu.selectedIndex].value;
    }
    useAjax(ajaxList[0], value);  // call AJAX
}




function formatExif(alt,filename)
{
    var na=0;

    //-----------------------------------------------------------------------------------------------------
    if(alt=="") {            //         date=filename.replace(/^(((\d+)[-]){1,}).*/,"$1");
       if(filename=="") { na=1; }

       else {
         year=""; month=""; day="";
         year =filename.replace(/^(\d+).*$/,"$1");
         month=filename.replace(/^\d+[-](\d+).*$/,"$1");
         day  =filename.replace(/^\d+[-]\d+[-](\d+)[-].*$/,"$1");

         date=year;
         if(month!=filename) date+="/"+month;
         if(day  !=filename) date+="/"+day;

         //alert (year+"-"+month+"-"+day);
         //----------------------------------------------------------
         if(year<1997) na=1;
         //----------------------------------------------------------
         else if( ((year==1997) && (month<10))
           ) { camera="Canon Point'n'Shoot";
               lens="(Lens: Built-in)";
         }
         //----------------------------------------------------------
         else if(  (year<1998)                   || 
             ((year==1998) && (month<11))
           ) { camera="Canon Elan IIe";
               lens="(Lens: " + 
                             "Canon 28-105mm f/3.5-4.5 USM"
                             + ")"
                    +"<br>and closeups: "
                    +"(Lens: " + 
                             "Canon 70-300 f/4-5.6"
                             + ")";
         }
         //----------------------------------------------------------
         else if( ((year==1999) && (month<5)) || 
                  ((year==1998) && (month>=11))
           ) { camera="Nikon F5";
               lens="(Lens: " + 
                             "Nikon 35-70 f/2.8"
                             + ")"
                    +"<br>and telephoto: "
                    +"(Lens: " + 
                             "Nikon 80-200mm f/2.8"
                             + ")";
         }
         //----------------------------------------------------------
         else if( ((year==1999) && (month>=5)) || 
                  ((year>1999)  && (year<2004)) ||
                  ((year==2004)  && (month<10))
           ) { camera="Nikon F100";
               lens="(Lens: " + 
                             "Nikon 28-105mm f/3.5-4.5"
                             + ")";
         }
         //----------------------------------------------------------
         else if( ((year==2004) && (month>=10)) || 
                  ((year>2004)  && (year<2006)) ||
                  ((year==2006)  && (month<9))
           ) { camera="Nikon F100";
               lens="(Lens: " + 
                             "Nikon 28-105mm f/3.5-4.5"
                             + ")"
                    +"<br>and wideangle "
                    +"(Lens: " + 
                             "Nikon 18-35mm f/3.5-4.5"
                             + ")";
         }
         //----------------------------------------------------------
         else           na=1;
         //----------------------------------------------------------

         if(!na)
           alt=filename+" - " + camera + "<br>"
              +date    +" - " + lens;
       }
    }
    //-----------------------------------------------------------------------------------------------------
    if(na) {
      alt="Photo Info is not Available"; 
  
      //---------------------------------------------------------------------------------
         year =filename.replace(/^(\d+).*$/,"$1");
         month=filename.replace(/^\d+[-](\d+).*$/,"$1");
         day  =filename.replace(/^\d+[-]\d+[-](\d+)[-].*$/,"$1");

         if(  (year>2006)                   || 
             ((year==2006) && (month>=9))
           )
           alt+=" - Nikon D200<br> - details coming soon.";
      //---------------------------------------------------------------------------------
    }


//    else {
      alt=alt.replace(/(Canon Elan IIe)/ig,"<font class=\"elanIIe\">$1</font>")
             .replace(/(Canon EOS 40D)/ig,"<font class=\"canon40d\">$1</font>")
             .replace(/(Canon EOS-1D Mark III)/ig,"<font class=\"canon1dmarkIII\">$1</font>")

             .replace(/(Nikon F5)/ig,"<font class=\"f5\">$1</font>")
             .replace(/(Nikon F100)/ig,"<font class=\"f100\">$1</font>")
             .replace(/(Nikon D40)/ig,"<font class=\"d40\">$1</font>")
             .replace(/(Nikon D200)/ig,"<font class=\"d200\">$1</font>")
             .replace(/(Nikon D300)/ig,"<font class=\"d300\">$1</font>")

//             .replace(/^((.*?<br>){2})(.*?ISO-\d{1,})/i,"$1<font class=\"exposure\">$3</font>")
//             .replace(/^((.*?<br>){2})(.*?ISO-\d{1,})(.*?)(=)(.*?)(\))/i,"$1<font class=\"exposure\">$3</font>$4$5<font class=\"exposure\">$6</font>$7")  // mod 2009-02-17
//             .replace(/^((.*?<br>){2})((.*?)(f\/[\d.]+).*?(ISO-\d{1,}))(.*?)(=)(.*?)(\))/i,"$1<font class=\"exposure\">$4<a target=\"_blank\" href=\"/answers/support/fstop.html\" title=\"Sunny-16 f/stop, aperture, ISO table\">$5</a> $6</font>$7$8<font class=\"exposure\">$9</font>$10")  
             .replace(/^((.*?<br>){2})((.*?)(f)(.*?ISO-\d{1,}))(.*?)(=)(.*?)(\))/i,"$1<font class=\"exposure\">$4<a target=\"_blank\" href=\"/answers/support/fstop.html\" title=\"Sunny-16 f/stop, aperture, ISO table\">$5</a>$6</font>$7$8<font class=\"exposure\">$9</font>$10")  

             .replace(/(\(Lens:.*?\))/ig,"<font class=\"lens\">$1</font>")
             .replace(/(\(Lens_.*?\))/ig,"<font class=\"lens\">$1</font>")
             .replace(/icc:(.*?)(\<br\>)/ig,"<font class=\"icc\">$1</font>$2");
//         .replace(/(300mm)/ig,"<font class=\"n300m4\">$1</font>");
//    }
  return alt;
}

function oneExif(alt,isTop,filename)
{   
    var imgDiv=document.getElementById( 'oneExifDiv' );    imgDiv.style.display="";  
    var altInitiallyBlank=(alt=="");
    var closeWindow="<a href=\"JAVASCRIPT:hideOneExif();\" title=\"Close Info Window\">X</a>";

    height=100; width=300;
    
    if(isTop==2) {
      imgDiv.style.top  = 73;        // 60px without Cookie text with white background
      imgDiv.style.left = 35;
    }
    else {
      imgDiv.style.top  = mouseY - (  isTop ? 0 : ( (alt=="") ? 50 : height )  );
      imgDiv.style.left = mouseX - ( !isTop ? 0 : ( (alt=="") ? 200 : width/2 )  );   //2008-12-26: was ? 200
    }


  // imgDiv.offsetWidth -- http://www.ozzu.com/programming-forum/javascript-getting-div-current-width-t39999.html
  imgDiv.innerHTML = formatExif(alt,filename);

  if (altInitiallyBlank)
    imgDiv.innerHTML += " " + closeWindow;
  else
    imgDiv.innerHTML  += "<div style=\"position: relative; margin: -12px 0px 0px 0px; width: 8px; left: "
                      + (imgDiv.offsetWidth - 20)
                      + "px\">"
                      +   closeWindow
                      + "</div>";

/*
    imgDiv.innerHTML  = "<div style=\"padding: 0 0 0 0; margin: 0 0 0 0\">"+imgDiv.innerHTML+"</div>"
                      + "<div style=\"position: relative; margin: -12px 0px 0px 0px; left: "
                      + (imgDiv.offsetWidth - 20)
                      + "px\">"
                      +   closeWindow
                      + "</div>";
*/
//                      + "<div style=\"position: relative; margin: 0 0 0 0; bottom: 12px; height: 0px; width: 8px; border: 1px solid red; left: "

}


function showBigImage(file, alt, location, id, date, width, height)
{   
    var imgDiv=document.getElementById( 'bigImageDiv' );    imgDiv.style.display="";  
    var SIZE=5;
    imgDiv.style.top  = (  ((mouseY-document.body.scrollTop+height)>document.body.clientHeight) 
                          ? (mouseY-height) : mouseY  ); 

    imgDiv.style.left = (width > 300) 
                        ? ( (document.body.clientWidth - width)/2 ) 
                        : (  ( (mouseX+width)>document.body.clientWidth ) ? (mouseX-width) : mouseX  );

    if ( width > 300 )   // picture below - move down a little for panoramic, to allow clicking
      mouseY += ( ((mouseY-document.body.scrollTop+height)>document.body.clientHeight) ) ?  -20 : +10;        

    //----------------------------------------------------------------------------
    myDiv=document.getElementById( 'bigTextAlt' );                       myDiv.innerHTML=alt; // location=alt.length+","+(alt.length*8)+((alt.length*8 > width ) ? ">" : "<=")+width;  //alt;     

//    myDiv.style.width=(alt.length*8 > width ) ? (width) : ( ((location.length*8)<width) ? (location.length*8) : "100%");
    altBigger=( (alt.length     *SIZE) > width ) ? 1 : 0;
    locBigger=( (location.length*SIZE) > width ) ? 1 : 0;

         if(altBigger && locBigger)  { alt=1; myDiv.style.width=(alt.length>location.length) ? (location.length*SIZE) : ""; }   // why *6
    else if(             locBigger)  { alt=2; myDiv.style.width=                               (location.length*SIZE);      }
    else if(altBigger)               { alt=3; myDiv.style.width=                               width;                       }
    else                             { alt=4; myDiv.style.width=                                                        ""; }
// myDiv.innerHTML=alt;
    //----------------------------------------------------------------------------
    label="bigTextLoc"; value=location;
       myDiv=document.getElementById(label);
       if( (value==undefined) || (value=='') ) { myDiv.style.display="none"; }
       else                                    { myDiv.style.display="";     myDiv.innerHTML=value; }
    //----------------------------------------------------------------------------
    label="bigTextId";  value=id;
       myDiv=document.getElementById(label);
       if( (value==undefined) || (value=='') ) { myDiv.style.display="none"; }
       else                                    { myDiv.style.display="";     myDiv.innerHTML=value; }
    //----------------------------------------------------------------------------
    label="bigTextDate";  value=date;
       myDiv=document.getElementById(label);
       if( (value==undefined) || (value=='') ) { myDiv.style.display="none"; }
       else                                    { myDiv.style.display="";    // myLeft=width-65;
                                                 myDiv.innerHTML=value;     // myDiv.style.left=myLeft.toString()+"px"; 
}
    //----------------------------------------------------------------------------
    img=document.getElementById( "bigImage" );     img.src=""; img.src = file;     img.style.display="";

    //----------------------------------------------------------------------------

/*
  document.getElementById( 'bigTextAlt' ).innerHTML = 
       "y="            + mouseX + "," +
       "scrollHeight=" + document.body.scrollHeight + "," + 
       "scrollTop="    + document.body.scrollTop + "," + 
       "clientHeight=" + document.body.clientHeight+"..."+
        (mouseY-document.body.scrollTop+height) + "," + document.body.clientHeight
  ;

//  document.getElementById( 'bigTextAlt' ).innerHTML="x="+mouseX+"+"+width+"/y="+mouseY+"+"+height+"("+document.body.clientWidth+","+document.body.clientHeight+")";
*/
}

function hideBigImage() 
{
    imgDiv=document.getElementById( "bigImageDiv" );   imgDiv.style.display="none";
    img   =document.getElementById( "bigImage" );         img.style.display="none";           // none (hide), "" (show)
};

function hideOneExif() 
{
    imgDiv=document.getElementById( "oneExifDiv" );   imgDiv.style.display="none";
};


//----------------------------------------- AJAX - start -----------------------------------------
function getHTTPObject(){
       if (window.ActiveXObject)  return new ActiveXObject("Microsoft.XMLHTTP");
  else if (window.XMLHttpRequest) return new XMLHttpRequest();
  else {                          alert("Your browser does not support AJAX.");
                                  return null;
  }
}

function useAjax(type,value) {

  httpObject = getHTTPObject();

  if( type==ajaxList[0]) parameters="img="+value;          // searchPicture
  else                   parameters=type+"=1";

  if (httpObject != null) {
  //httpObject.open("GET", "upperCase.php?inputText="+document.getElementById('inputText').value, true);
    httpObject.open("GET", "support/ajax.php?"+parameters, true);
    httpObject.send(null);
    httpObject.onreadystatechange =  (type==ajaxList[0]) ? checkDone1 : checkDone2;
  }
  //alert((httpObject != null) ? "httpObject is ok" : "httpObject is Null");

}


function checkDone1() {             // Picture from "Photo Lenses"
  // http://www.ajaxf1.com/tutorial/ajax-php.html?page=3
  // change the field value only if XMLHttpRequest object state is complete. 
  // httpObject.readyState values: *0=uninitialized *1=loading  *2=loaded  *3=interactive  *4=complete

  if(httpObject.readyState == 4) 
    ajaxAfter1(httpObject.responseText);
}

function checkDone2() {
//  myDiv.innerHTML+=( (!(myDiv.innerHTML.length % AJAX_DOTS_LIMIT)) ? "<br>" : "" ) + ".";     // Loading...
  myDiv.innerHTML+=" .";

  if(httpObject.readyState == 4) {
     myDiv.innerHTML=httpObject.responseText;

     if( (myDiv==lensDiv) || (myDiv==cameraDiv) )
       setTimeout('goSearchPicture("2008-08-07-zoo-tiger-11280")',100);    // load initial picture

//     if(myDiv.title.replace(/\*/,"")!=myDiv.title)
//     if(myDiv.title.match("*"))
//     if(myDiv.title.match( new RegExp("\*$", "") ))
//        myDiv.style.title="hmmm";   //myDiv.title+"*";        // cannot set title

  }
}


function ajaxAfter1 (fromPHP)
{
/************ from PHP, s.php ************
  return       $filename                     # 
         .$SEP.$width
         .$SEP.$isId
         .$SEP.$a[$this->OFFSET_EXIF];
 *****************************************/

    img= fromPHP.replace(/^(.*?)[,].*/,   "$1");
    more=fromPHP.replace(/^(.*?)[,](.*)/, "$2");

    width=more.replace(/^(.*?)[,](.*)/,  "$1");
    rest =more.replace(/^(.*?)[,](.*)/,  "$2");

    isId =rest.replace(/^(.*?)[,](.*)/,  "$1");
    rest =rest.replace(/^(.*?)[,](.*)/,  "$2");

    rest =rest.replace(/[,]/g, "<br>");
//alert(img+","+  width+","+  isId);
    if(rest.replace(/[\s\r]/g,"")=="None") rest="";   //alert(img+" *** "+isPano+" *** "+rest);

    floatPicture( (isId==1) ? 1 : 0);

    //----------------------------
    var preview = new Image;
    preview.onload = function() {
      var imgObj=document.getElementById( 'slide' );
      imgObj.src = preview.src;
      imgObj.style.width=(width>300) ? "300px" : "";
      document.getElementById( 'slideAhref' ).href=imgObj.src.replace(/(\/.*\/)*(.*?)(\.jpg)/,"$2");      // /2008-04-21-file - fnf will locate .HTML
      pictureContainer(1);
    }
    preview.src = img;
    //----------------------------

    a=img.split("/");        //  /animals09/thumbnails/2009-01-20-filename.jpg - take file.ext only

    document.getElementById( 'searchPicture' ).innerHTML=formatExif(rest,a[a.length-1].replace(/[\s\r]/g,""));

}
function floatPicture(value) {
    mHeight=400;
    document.getElementById( 'mainPictureDiv' ).style.top=((value==1) && (mouseY>mHeight)) ? (mouseY-mHeight) : 0;   //alert(div.height+","+div.style.height);
}

var httpObject = null;

//----------------------------------------- AJAX -  end  -----------------------------------------