var browserID_Text = "";
var browser = "";
var browserID = -1;
var datafield = " ";
var imageType = " ";
var imageIdx  = 00;
var spacer    =  " ";

function openframe(title)
         {
         //
         //  Result will be set to 1 (true) if there is a FRAME active
         //  if no FRAME is active then it is set to zero (false)
         //
          var result = !parent.frames['frmMain'];
          if  ( result )
              {
                top.location.replace(title);
              }
          else
              {
                parent.frames['frmMain'].location=title
              }
          return false;
         }
// +----------------------------------------------------------------------+ //
// |  Which Browser are we suing                                          | //
// +----------------------------------------------------------------------+ //
function browserIdentification()
{
          browserID_Text = navigator.userAgent;
          if ( browserID_Text.search(/Firefox/)  != -1 )  browser = "Firefox";
          if ( browserID_Text.search(/Netscape/) != -1 )  browser = "Firefox";
          if ( browserID_Text.search(/MSIE/) != -1 )      browser = "Microsoft Internet Explorer";
          if ( browserID_Text.search(/Opera/) != -1 )     browser = "Opera";
          if ( browserID_Text.search(/Safari/) != -1 )    browser = "Safari";

}

// +----------------------------------------------------------------------+ //
// |  Which Browser are we suing                                          | //
// +----------------------------------------------------------------------+ //
function onlyNewbrowsers()
{
        switch(browser)
                      {
                       case "Firefox":                      browserID = 1;
                                                            break;
                       case "Microsoft Internet Explorer":  browserID = 2;
                                                            break;
                       case "Safari":                       browserID = 4;
                                                            break;
                       case "Opera":                        browserID = 3;
                                                            break;
                       default:                             browserID = 0;
                                                            break;
                      }
       spacer = "    ";
       if ( screen.height < 800 ) spacer = "<br>";
}

// +----------------------------------------------------------------------+ //
// |                                                                      | //
// |  Global Variable Definitions that can be used by all functions       | //
// |                                                                      | //
// +----------------------------------------------------------------------+ //
var imageArray = new Array();
var picIndex = 0;
var allImg = "";
var currURL = " ";
var where = "WEB";
// +----------------------------------------------------------------------+ //
// |  Variables that should be changed to suit your needs                 | //
// +----------------------------------------------------------------------+ //
var webURL  = "http://www.Surfboardpainting.com/sbp/";
var diskURL = "file://C:/SBP/";
var idToSrchFor = "preload";
// +----------------------------------------------------------------------+ //
// |  Master function that is executed at page load time                  | //
// |   Controls building the master picture array                         | //
// |                                                                      | //
// |   LOWSRC parm is used to pass the pictures number/index into the     | //
// |          array and a background code. For my purposes I change       | //
// |          the background images on my pages. I needed a way to        | //
// |          the background of the Large Picture window match that       | //
// |          background. This code serves that purpose.                  | //
// |          Passed Parm = NNA [2 digit number index]                    | //
// |                            [1 digit alpha code]                      | //
// |                                                                      | //
// +----------------------------------------------------------------------+ //
function loadImage()
{
       if ( where == 'WEB' )
                                currURL = webURL;
                           else
                                currURL = diskURL;
       browserIdentification()
       onlyNewbrowsers();
         // +----------------------------------------------------------------------+ //
         // |  If checkit it NULL then we are doing single card not bulk cards     | //
         // +----------------------------------------------------------------------+ //
        var checkit = document.getElementById(idToSrchFor);
//      alert("checkit = " + checkit);
        if ( null == checkit ) return;
        allImg = document.getElementById(idToSrchFor).getElementsByTagName('img');

        for (var i=0;i<allImg.length;i++)
            {
                actualImg  =  document.getElementById(idToSrchFor).getElementsByTagName('img')[i].src;
                longField  =  document.getElementById(idToSrchFor).getElementsByTagName('img')[i].longDesc;
                if ( longField.length > 0 )
                   {
                       picIndex   =  Number(longField.substr(longField.length-3,2));
                       imageArray[picIndex] = new Image();
                       imageArray[picIndex].lowsrc =  longField.substr(longField.length-3,3);
                       imageArray[picIndex].onload = function() { picLoaded(this); }
                         // +----------------------------------------------------------------------+ //
                         // |  Image Src created with an '*' for folder breakdown                  | //
                         // |        eg.  1960*9999.jpg                                            | //
                         // |        the FILE_NAME_ONLY routine removes all folders and only       | //
                         // |        leaves the name of the file. So it cannot be defined as       | //
                         // |        1960\9999.jpg.                                                | //
                         // |        So the * is replaced with a '\' then the actual Master        | //
                         // |        folder is combined to form the full path                      | //
                         // +----------------------------------------------------------------------+ //
                       imageArray[picIndex].src    =  currURL + file_name_only(actualImg);
                       imageArray[picIndex].name   =  file_name_only(longField.substring(0,longField.length-4));
                       imageArray[picIndex].alt    =  document.getElementById(idToSrchFor).getElementsByTagName('img')[i].alt;
                       imageArray[picIndex].vspace =  3;
                       imageArray[picIndex].hspace =  3;
//                     show50Images(picIndex, "loadImage..")
                   }
           }

}
// +----------------------------------------------------------------------+ //
// |  DEBUG:                                                              | //
// |         Routine used to display data in any Image Array slot         | //
// |         index into array is the passed numeric value                 | //
// |                                                                      | //
// +----------------------------------------------------------------------+ //
function show50Images(nbr,from)
{
//     alert("nbr = " + nbr + "    " + imageArray[0].src);
     alert(from + "\nSRC = " + imageArray[nbr].src + "\nNAME = " + imageArray[nbr].name + "\nALT = " + imageArray[nbr].alt + "\nCODE = " + imageArray[nbr].lowsrc + "\nCOMPLETE = " + imageArray[nbr].complete + "\nMOUSEOVER = " + imageArray[nbr].onmouseover + "\nONCLICK = " + imageArray[nbr].onclick + "\nONLOAD  = " + imageArray[nbr].onload  + "\nWIDTH   = " + imageArray[nbr].width  + "\nHEIGHT  = " + imageArray[nbr].height);
     return
}
// +----------------------------------------------------------------------+ //
// |  Remove URL assigned by the browser for the Image SRC field.         | //
// |   The assumption here is the pictures are not in the same folder     | //
// |   as the HTML page. So this URL means nothing to these routines      | //
// |   Function will return only the FileName.ext                         | //
// |                                                                      | //
// +----------------------------------------------------------------------+ //
function file_name_only(str)
{
var old   = "*";
var slash = "/";
     var number_1 = str.lastIndexOf('/') + 1
     str  = str.replace(old,slash);
     str  = str.replace(/%20/,"&nbsp;");
     str  = str.replace(/%20/,"&nbsp;");
     return str.substring(number_1)
}
// +----------------------------------------------------------------------+ //
// |  Extract specific data elements from the LOWSRC image field          | //
// |   The field will contain a full path name in some browsers. In order | //
// |   to get to the data we need it has to be parsed in those browsers.  | //
// |   We store the index into the Image Array and the type of            | //
// |   background wanted for a picture in this field, for each image.     | //
// |   Positions 0 and 1 are the index                                    | //
// |   Positions 2 is the image background letter type                    | //
// |                                                                      | //
// +----------------------------------------------------------------------+ //
function extractLowSrc(lowSrcStr)
{
      if ( browserID == 4 )
        {
          imageIdx  = lowSrcStr.substr(lowSrcStr.length-3,2);
          imageType = lowSrcStr.substr(lowSrcStr.length-1,1);
        }
     else
        {
          imageIdx  = lowSrcStr.substr(0,2);
          imageType = lowSrcStr.substr(2,1);
        }
     return;
}
// +----------------------------------------------------------------------+ //
// |  Picture ONLOAD function                                             | //
// |   When picture is finished loading the browser should turn control   | //
// |   over to the onload function. This function can then set the        | //
// |   image COMPLETE flag to true and determine the length values        | //
// |   IMAGE ARRAY Passed Value                                           | //
// +----------------------------------------------------------------------+ //
function picLoaded(image)
{
var idx = " ";
var imgOverSrch = " ";
var imgOver = " ";

     extractLowSrc(image.lowsrc);
     idx = imageIdx;
     imgOverSrch  = "over" + idx;
     imgOver = document.getElementById(imgOverSrch);
     imgOver.onmouseover = function() { showThumbNail(image); }
     imageArray[Number(idx)].onmouseover = function() { showThumbNail(image); }
     return
}

// +----------------------------------------------------------------------+ //
// |  Picture SINGLEPIC function                                          | //
// |   Used for single card processing                                    | //
// |   When the list of cards are too big to handle doing all cards       | //
// |   '1986 Adams,  George -- PSA  9  Mint                               | //
// +----------------------------------------------------------------------+ //
function singlePic(bg,picno,title)
{
//     if ( where == 'WEB' )
//                              currURL = webURL;
//                         else
//                              currURL = diskURL;
//     onlyNewbrowsers();
       var ptr = title.indexOf('-');
       var picName  = title.substring(0, ptr-1);
       var picGrade = title.substring(ptr+3);

       imageArray[0] = new Image();
       imageArray[0].onload = function() { showFullPic(this); }
       imageArray[picIndex].src    =  currURL + file_name_only(picno);
       imageArray[picIndex].name   =  picName;
       imageArray[picIndex].alt    =  picGrade;
       imageArray[picIndex].lowsrc =  "00" + bg;
       imageArray[picIndex].vspace =  0;
       imageArray[picIndex].hspace =  0;
//     show50Images(00, "openpic..")
       return;
}

dataSize         =  0;
MyBGIMG          =  " ";
MyDisk_BGIMGPATH =  "file://C:/SBP/";
MyWeb_BGIMGPATH  =  "http://www.Surfboardpainting.com/SBP/"
MyPicture_WIDTH  =  " width=\\'150\\'";
MyBGColor     = "#0000CD";
MyFontColor   = "#FFFF00";
MyFontWeight  = "'BOLD'";
MyFontAlign   = "'CENTER'";
MyTitleFontFace_Thumb = 'MS Sans Serif'
MyTitleFontSize_Thumb = '8pt'
MyTitleFontFace_Full = 'Verdana'
MyTitleFontSize_Full = '10pt'
MyTitleBGColor    = "#85878F";
MyTitleBGColor    = "#000000";
MyTitleFONTColor  = "#85878F";
MyShadowColor = "#85878F";

actualBGIMGPATH = "";
actualPICPATH = "";

//"Tip('<img src=\'file://C:/f_drv/Room21_NYG/1035728_001.jpg\' width=\'150\'><br><br>Gene  Filipski<br>SGC 92  Nm/Mt+.',BGIMG, 'file://D:/e_drv/Giants2008/ReportFiles/NYGBlue.jpg',FONTCOLOR,'#FFFF00',FONTWEIGHT,'BOLD')"


function showThumbNail(image)
              {
                // +----------------------------------------------------------------------+ //
                // |   SHOWTHUMBNAIL Picture                                              | //
                // |   Change shadow to suit the background of the page                   | //
                // |   'B' Shadow changed on 07-24-2008                                   | //
                // +----------------------------------------------------------------------+ //
               extractLowSrc(image.lowsrc);
               switch(imageType)
                     {
                      case 'B':  MyBGIMG = "NYGBlue.jpg";
                                 MyShadowColor = "#5E5E5E";
                                 MyShadowColor = "#788080";
                                 MyBGColor     = "#A19164";
                                 image.vspace =  3;
                                 image.hspace =  3;
                                 break;
                      case 'M':  MyBGIMG = "Country.jpg";
                                 MyShadowColor = "#85878F";
                                 MyBGColor     = "#545454";
                                 image.vspace =  5;
                                 image.hspace =  5;
                                 break;
                      case 'Y':  MyBGIMG = "yankeeBack2.jpg";
                                 MyShadowColor = "#85878F";
                                 MyBGColor     = "#D0CBD1";
                                 image.vspace =  2;
                                 image.hspace =  2;
                                 break;
                      case 'Z':  MyBGIMG = "Grease.jpg";
                                 MyShadowColor = "#706F6F";
                                 MyBGColor     = "#D15F90";
                                 image.vspace =  2;
                                 image.hspace =  2;
                                 break;
                       default:  MyBGIMG = "StatsBack.jpg";
                                 MyShadowColor = "#85878F";
                                 MyBGColor     = "#545454";
                                 image.vspace =  5;
                                 image.hspace =  5;
                                 break;
                     }
               if ( image.width > 600 )
                                      {
                                         MyPicture_WIDTH    =  image.width - 500;
                                      }
                                  else
                                      {
                                         MyPicture_WIDTH    =  200;  // image.width - 200;
                                      }
               var titleText = image.name;
               MyTitleBGColor =  "maroon";
               MyPicture_WIDTH    = " width=\'" + MyPicture_WIDTH + "\' "
               actualPicture = "<img src='"
               actualPicture = actualPicture  + image.src;
               actualPicture = actualPicture + "'";
               actualPicture = actualPicture + MyPicture_WIDTH;
               actualPicture = actualPicture + "vspace=" + image.vspace + " ";
               actualPicture = actualPicture + "hspace=" + image.hspace + " ";
               return Tip(actualPicture,BGCOLOR,MyBGColor,TITLEFONTFACE,MyTitleFontFace_Thumb,TITLEFONTSIZE,MyTitleFontSize_Thumb,TITLEBGCOLOR,MyTitleBGColor,TITLE, titleText,TITLEALIGN,'center',SHADOWCOLOR,MyShadowColor);
              }

function showFullPic(image)
              {
var offSet = 0;
                // +----------------------------------------------------------------------+ //
                // |  SHOWFULLSIZE Picture                                                | //
                // |   Allows background image instead of just a color.                   | //
                // |     based upon the value passed in the lowsrc field set the          | //
                // |     background image                                                 | //
                // +----------------------------------------------------------------------+ //
               extractLowSrc(image.lowsrc);
               switch(imageType)
                     {
                      case 'A':  MyBGIMG = "AutoBack.jpg";
                                 MyTitleBGColor  = "#B319B3";
                                 MyTitleFONTColor = "#FFFF00";
                                 break;
                      case 'B':  MyBGIMG = "NYGBlue.jpg";
                                 MyTitleBGColor  = "#0000CD";
                                 MyTitleFONTColor = "#FFFF00";
                                 break;
                      case 'C':  MyBGIMG = "CompanyBack.jpg";
                                 MyTitleBGColor  = "#0000CD";
                                 MyTitleFONTColor = "#FFFF00";
                                 break;
                      case 'G':  MyBGIMG = "dgrey042.jpg";
                                 MyTitleBGColor  = "#C9C9C9";
                                 MyTitleFONTColor = "#000000";
                                 break;
                      case 'L':  MyBGIMG = "AlphaBack.jpg";
                                 MyTitleBGColor  = "#E1A28F";
                                 MyTitleFONTColor = "#000000";
                                 break;
                      case 'M':  MyBGIMG = "Country.jpg";
                                 MyTitleBGColor  = "#C9C9C9";
                                 MyTitleFONTColor = "#000000";
                                 break;
                      case 'R':  MyBGIMG = "red136.gif";
                                 MyTitleBGColor  = "#FBB2D1";
                                 MyTitleFONTColor = "#862B44";
                                 break;
                      case 'Y':  MyBGIMG = "yankeeBack2.jpg";
                                 MyTitleBGColor  = "#4B5670";
                                 MyTitleFONTColor = "#FFFFFF";
                                 break;
                      case 'Z':  MyBGIMG = "GreaseBack.jpg";
                                 MyTitleBGColor  = "#F6CEDF";
                                 MyTitleFONTColor = "#000000";
                                 break;
                       default:  MyBGIMG = "StatsBack.jpg";
                                 MyTitleBGColor  = "#C9C9C9";
                                 MyTitleFONTColor = "#000000";
                                 break;
                     }
                // +----------------------------------------------------------------------+ //
                // |  SHOWFULLSIZE Picture                                                | //
                // |   Testing purposes                                                   | //
                // |     define where imageis on DISK or WEB if not in the same           | //
                // |     folder as the page. My preference in design different folders    | //
                // +----------------------------------------------------------------------+ //
                switch(where)
                         {
                         case "DISK":
                                      actualBGIMGPATH = MyDisk_BGIMGPATH + MyBGIMG;
                                      break;
                         case "WEB":
                                      actualBGIMGPATH = MyWeb_BGIMGPATH + MyBGIMG;
                                      break;
                         }
                // +----------------------------------------------------------------------+ //
                // |  SHOWFULLSIZE Picture                                                | //
                // |   Lets center the picture on the screen.                             | //
                // |     Works best for either a 1024x768 or 1280x1024 size               | //
                // |     sizes over 1280 should be fine                                   | //
                // |     OffsetX is left to right centering.                              | //
                // |     OffsetY is top to bottom [always 50 for me]                      | //
                // |                                                                      | //
                // +----------------------------------------------------------------------+ //
               image.vspace  = 3;
               image.hspace  = 3;
               MyPicture_WIDTH  =  image.width;
               if ( screen.height < 800 ) MyPicture_WIDTH = 270;
               MyPicture_OffsetY  = -20;
//             if ( image.width > 680 )
//                {
//                  MyPicture_WIDTH    =  MyPicture_WIDTH - ( image.width / 10 );
//                }
//             if ( image.height > 600  )
//                {
//                  MyPicture_WIDTH    =  MyPicture_WIDTH - ( image.width / 85 );
//                }

               MyPicture_WIDTH    = " width=\'" + MyPicture_WIDTH + "\' "
                // +----------------------------------------------------------------------+ //
                // |  SHOWFULLSIZE Picture                                                | //
                // |   Centering on the screen                                            | //
                // |     Opera works different than Mozilla and IE                        | //
                // |     So we have to add to the offset from top of screen for it        | //
                // |     the others are a minus offset                                    | //
                // |                                                                      | //
                // +----------------------------------------------------------------------+ //
               var titleText = image.name + spacer +  image.alt;
               actualPicture = "<img src='"
               actualPicture = actualPicture  + image.src;
               actualPicture = actualPicture + "' ";
               actualPicture = actualPicture + MyPicture_WIDTH;
               actualPicture = actualPicture + "vspace='" + image.vspace + "' ";
               actualPicture = actualPicture + "hspace='" + image.hspace + "' ";
               return Tip(actualPicture,BGIMG,actualBGIMGPATH,TITLEFONTFACE,MyTitleFontFace_Full,TITLEFONTSIZE,MyTitleFontSize_Full,TITLEFONTCOLOR,MyTitleFONTColor,TITLEBGCOLOR,MyTitleBGColor,TITLE, titleText,TITLEALIGN,'center',CLICKCLOSE,true,CLOSEBTN,true,STICKY, true,FOLLOWSCROLL, true,OFFSETY,MyPicture_OffsetY,CENTERWINDOW,true,CENTERALWAYS, true,SHADOW,false,BORDERWIDTH,0);
              }

// +----------------------------------------------------------------------+ //
// |  SCROLLOFFSET    function                                            | //
// |   Get the window / viewport scroll offset in order to show           | //
// |   the picture                                                        | //
// |   return the TOP offset only -- Left to Right not needed             | //
// +----------------------------------------------------------------------+ //
function scrollOffset()
{
var x,y;
  if (self.pageYOffset) // all except Explorer
     {
        x = self.pageXOffset;
        y = self.pageYOffset;
     }
  else if (document.documentElement && document.documentElement.scrollTop)
          {
            // Explorer 6 Strict
            x = document.documentElement.scrollLeft;
            y = document.documentElement.scrollTop;
          }
      else if (document.body) // all other Explorers
              {
                x = document.body.scrollLeft;
                y = document.body.scrollTop;
              }
   return(y);
}