// copyright Ingo Schmidt-Philipp@spsoft.de
// free to use for anybody as long as copyright notice is retained
// Please notify me if you use it at  Isp.JavaScript@spsoft.de 
// please don't modify but send change suggestions. Thank You
// This JS is used to display a big version of a given thumbnail, including a text box (for description)
// it is called by onmouseover="sbig('XPIX.JPG','optional text')" 
// or              onmouseover="sbig('XPIX.JPG',this)"            then using the alt= text!       
// in your <img tag.  "XPIX.JPG" may be any relative or absolute path
// OR a text only in any tag with onmouseover="sbig('text: my <i>explanation</i> to <br> this link or whatever',this)" 
// OR in an <a-tag an explanation box with the name of the href (after '#') in the same html file (must be present as anything with the same id=) 
// text/image insertion   disappears if cursor is moved out  (as long as ",this" is specified) 
// otherwise it disappears after a fixed time of 25 seconds
//touch it: to pop up enlarged picture
//leave it: to return to normal screen
//click it: to establish permanent large display (leave this to discard)
//(click it on a <a tag: go to the tag's target 
// may reference "bilder/transparent.gif" (should be a transparent pixel)
// simplification:   <img src=images/xanything.jpg onmouseover="sbig(this)"  (small 'x' or 'TN_' or "_t" in image name) : guesses  "bilder/anything.jpg" for big pic
// simplification:   <a href=#abc onmouseover="sbig(this)" : guesses to display the content of a html named "abc" on the same page as an insertion
// Examples at www.abhyanga.de
if (typeof testmodus == 'undefined') testmodus=0
var showbig_stabilized = false;
var sbig_timeoutID ="none";
var sbig_lastlink ="none";
var sbigmouseY=0;
var sbigmouseX=0;
var sbig_posiabs = "position:absolute;"
if (typeof showbigloc == 'undefined') showbigloc = "V";
if  (!document.getElementById)  {
var notevers = "<br>Mit neueren Versionen von Netscape (ab 6) oder <a href=\"http://www.mozilla.org\">Gecko/Mozilla (=neuestes Netscape)</a> "
+" oder MSIE ab 6 werden verbesserte grosse Bildeinblendungen angezeigt.<br>";
document.write(notevers);
sbig_posiabs = " ";
} 
else {
var ctyp="div";
if  (document.layers)  {ctyp="layer"}; 
var sbig_mousecontrol = " onmouseOver=\"sbig('notimeout')\" onmouseOut=\"sbig('clear') \"   "
var sbig_text_styl = "font-size:14pt;color:black;background-color:beige;"
 +                      "border-style: ridge; border-color: olive;" //  border-width: thick;"
var sbig_txt_cont = ""
 + "<div id=bigtxt style=\""+ sbig_text_styl + " \" " + sbig_mousecontrol + ">  " 
+ "  <br>  </div>  "
 ;
var sbig_containerinhalt = ""
 +  sbig_txt_cont
 + " <img id=\"bigpic\" src=\"bilder/transparent.gif\" halign=top " 
 + sbig_mousecontrol
 + "onClick=\"sbig('openlastlink') \" "

 + "   height=\"100%\"  alt=\"(loading...)\"> " 
 ;
var sbig_cont_for_both= sbig_posiabs +"  width: 10;  height:10;   top:10;  left:10;  margin: 0;  padding: 0;  border: 0;"
 + "  background-color:transparent; VISIBILITY: hidden; Z-INDEX:0";
var makecontainer = 
   "<"  +ctyp  + " id=\"bigpicd\" style=\"" +  sbig_cont_for_both+"\"   > "
  + sbig_containerinhalt
+"</" + ctyp + "> " ; 

document.write(makecontainer);

var isNN = document.layers ? true : false;
var isIE = document.all ? true : false;
 var dom = (document.getElementById) ? true : false;
var ns5 = ((navigator.userAgent.indexOf("Gecko")>-1) && dom) ? true: false ;
var ie5 = ((navigator.userAgent.indexOf("MSIE")>-1) && dom) ? true : false ;
var ns4 = (document.layers && !dom) ? true : false ;
var ie4 = (document.all && !dom) ? true : false ;
var nodyn = (!ns5 && !ns4 && !ie4 && !ie5) ? true : false ;
function handleMouseMove(evt) {
  if (isIE)
  {sbigmouseX = window.event.clientX;
   sbigmouseY = window.event.clientY;
   } 
  else
  {sbigmouseX = evt.pageX ;
   sbigmouseY = evt.pageY ;
  }
    return false;
}//function

if (typeof testmodus == "undefined" || testmodus==0 ){
  if ( isNN )
    document.captureEvents(Event.MOUSEMOVE)
  document.onmousemove = handleMouseMove;
}
function handleMouseOut(evt) {
if (showbig_stabilized)
  { showbig_stabilized=false; }
else   sbig('clearsoon');
  return false;
}

function img_onclick_handler(evtl) {
showbig_stabilized=true ;
return true;
//stabilize pic, disable mouseout
}

} //=====================neuere browser

function sbig(id ,a2 ,parm3,addtext,fontsize) {
var iframeloading=0;

if (typeof addtext=="undefined")addtext="";
var ifont="";var efont="";
if (typeof fontsize=="undefined") {ifont="<font size="+fontsize+">";efont="</font>"}
var atext;
var oripicname=""
if ( typeof id =="object" && id.tagName=="IMG" ) { // sbig(this) im img-> grossen bildnamen raten
a2=id;
var picname=id.src;
oripicname=id.src;// fuer anzeige quellbild
var path="";
var last_slash = picname.lastIndexOf('/');

if (last_slash> -1) {path = picname.substr(0,last_slash+1) ; picname  = picname.substr(last_slash + 1);}
var last_dot = picname.lastIndexOf('.') ;
var altpicname=picname;

if (picname.substr(0,1)=="x") altpicname = picname.substr(1); else
if (picname.substr(last_dot-2,2)=="_t") { altpicname = picname.substr(0,last_dot-2)+ picname.substr(last_dot);  } else
if (picname.substr(0,3)=="TN_") altpicname = picname.substr(3);
altpicname=path + altpicname;
id=altpicname; 
alertt=(picname+"->"+altpicname);
}
if ( typeof id =="object" && id.tagName=="A" ) { // sbig(this) im <a tag: htmlof annehmen
a2=id;
id="htmlof" 
}

var a2typ= typeof a2;
if      (a2typ == 'undefined')    {a2=new Image;atext=id;a2.alt='undefined a2';}
else if (a2typ == 'string')    {atext=a2;}
else if (a2typ == 'object') // ,this ..
  {atext=a2.alt;

    if  (!document.getElementById)   { if (id == "htmlof") return; /* wg ns 4.7 */ } 
   else {a2.onmouseout=  handleMouseOut; // disappear on mouse out

         if (a2.tagName=="IMG"&&id != "htmlof") a2.onclick=img_onclick_handler;//click stabilizes big pic
         if (id =="htmlof") {var htname=" ";
             if ( typeof parm3 =="undefined") 
                { if (a2.tagName=="A"){ htname = a2.href; htname=htname.split('#')[1];  }  }// bei a href, sonst alt
                  else {htname=parm3};
                   if (htname =="title"){atext=a2.title} 
                   else if (htname=="alt"){atext=a2.alt} 
                   else {
              
                        // anker mit htmlelem gleichen namens
                       var refo= document.getElementById(htname); 
                       if (refo != null) 
                                { atext= refo.innerHTML; 
                                   if (refo.tagName =="TABLE") {atext='<table>'+atext+'</table>'}  
                               }  
                       else  { //gibts nicht als internes element, also ganze href in iframe laden
                               if (typeof a2.href == "undefined") return true;
                               atext= '<font size=-2>Laden von '+ a2.href+'... ';
                               clearcall="sbig('clear')";  
                               atext+= '<a href="#" onclick="'+clearcall+';return false;">(schliessen)</a>';
                               atext+= '</font><br>';

                               atext+='<iframe width="100%" height="100%" src="'+a2.href+'" ' +'> </iframe> ';
                               iframeloading=1;
                               //sbig_mousecontrol='  onmouseout="'+clearcall+';" ';
                               //doch   a2.onmouseout='';//nicht gleich loeschen
                             }              
             }  // innerhtml aus namen umsetzen 
         }// ('htmlof',this)
        }// nur neuere
   }
else //  if (a2typ == 'undefined') 
  {atext=" ";}



var lastlink=sbig_lastlink;
if (typeof parm3 != 'undefined') {lastlink=parm3;sbig_lastlink =lastlink;}
var loc="V";
var fullid = id;


if  (   !document.getElementById )  { // aelterer browser open machen
  if  (id=="" || id=="clear") {; } else  {
  picwin=window.open(fullid,"picwindow","width=800,height=600,resize=yes,scrollbars=yes,status=0,toolbar=yes,menubar=no");
  picwin.document.bgColor="yellow";
  picwin.focus();} 
  return false; 
} // aelt browser

else { // neuere browser

if (sbig_timeoutID !="none") 
   {clearTimeout(sbig_timeoutID); 
    sbig_timeoutID  ="none"; 
   };//loeschen inaktivieren


var cont = (ns4)? document.bigpicd.document: (ie4)? document.all['bigpicd']: (ie5||ns5)? document.getElementById('bigpicd'): null;

if  (id=="openlastlink" && lastlink!="none") {
picwin=window.open(lastlink,"linkwindow","width=800,height=800,resize=yes,scrollbars=yes,toolbar=yes,menubar=no");
picwin.focus(); 
 }
else if  (id=="clear") {
cont.style.zIndex = 0;
cont.style.visibility='hidden';
cont.innerHTML='nothing';
 }
else if  (id=="clearsoon") {
sbig_timeoutID=setTimeout("sbig('clear') ",200); 
 }
else if  (id== "textcss" ) { 
cont.style.cssText = atext ;   //  color:white;background-color:black;
 
 }
else if  (id== "notimeout" ) { 
 // disable timeout as sole action
 // is done at first anyway
 }
else  { // start display text or text plus (optional) pic

var doc_width  = isIE ? document.body.clientWidth  : window.innerWidth;
var doc_height = isIE ? document.body.clientHeight : window.innerHeight;
var scrolledY  = isIE ? document.body.scrollTop    : window.scrollY ;
var scry = isIE ? screen.scrollY : scrollY;
var scrx = isIE ? screen.scrollX : scrollX;
if (isIE) sbigmouseY += scrolledY;
scry= scrolledY;
var platzdrueber = sbigmouseY-scry; 

var textonly = ( (id.substr(0,5) =="text:" || id == "htmlof"  ) ) ? true : false  
if (typeof a2 =="object")
 if ( a2.tagName == "IMG") 
        { if ( id.indexOf(".")== -1 && !textonly) id += '.JPG'    }  // img: default = jpg 
 else { if  ( id.indexOf(" ") > 1 ) textonly = true; } // other: a blank in the text makes textonly

if  (textonly)
{  
 if ( id.substr(0,5) =="text:" ) 
     {atext=id.substr(5);}
 else if ( id =="htmlof" ) 
           { /* atext bleibt von oben */  }
 else  {atext=id;} 

atext = addtext + ifont+  atext+efont;
var trac = " id="+id+htname+" l="+atext.length + "<br>"; 
trac=""
atext = trac +atext;
if (atext == "") {return;}//keine texte im doc gefunden
cont.innerHTML="nothing";
cont.style.cssText = sbig_posiabs + sbig_text_styl ;
cont.innerHTML='<div' +  sbig_mousecontrol + '>' +  atext+ '</div>';//same code below
cont.style.zIndex = 99;
cont.style.visibility='visible';

//cont.style.height=doc_height/8;
cont.style.width=doc_width/4;
if ( id =="htmlof" ) 
 {//cont.style.height=doc_height/2-20;
  cont.style.width=doc_width/2 - 22;}
else  {//cont.style.height=doc_height/8;
         cont.style.width=doc_width/4;}
if (iframeloading) cont.style.height=doc_height/2;

//??cont.style.width='';
var txtW = (ns4)?  cont.width: (ie4||ie5)?  cont.clientWidth:  cont.offsetWidth ;
var txtH = (ns4)?  cont.height: (ie4||ie5)?  cont.clientHeight:  cont.offsetHeight ;

if (txtH*1.2 > doc_height )   // || (atext.length/100)> (doc_height*doc_width/4)) 
  { atext = '<font size=-1>' + atext + '</font>' ;//+sbig_mousecontrol??
    cont.innerHTML='<p' +  sbig_mousecontrol + '>' +   atext+ '</p>';//same code above
    txtH = (ns4)?  cont.height: (ie4||ie5)?  cont.clientHeight:  cont.offsetHeight ;
  }
if  ( sbigmouseX > doc_width*0.60 && atext.length > 200)
     cont.style.left=0 ;   // cursor ganz rechts: links anzeigen (sonst geht box zuweit runter)
else if  (sbigmouseX - txtW >20 )
         { cont.style.left= sbigmouseX-txtW-20 ;} // sonst links links
else  {  cont.style.left= sbigmouseX + 20; } // rechts geht

if (platzdrueber > txtH+50 ) // grosse reserve, da's evtl ausgedehnt wird
        {   var toptemp = sbigmouseY -txtH -50;   cont.style.top= toptemp;} //drueber geht
else if (sbigmouseY + txtH +50 < doc_height  ) // grosse reserve, da's auch ausgedehnt wird
        {  cont.style.top = sbigmouseY +20;} // drunter
else {  cont.style.top = scry;} // sonst einfach ganz oben

alertt=  (htname+"id="+id+" ct="+cont.style.top+ " cle="+cont.style.left+"  ll="+atext.length +"drueber="+platzdrueber+ " mY"+sbigmouseY + " scrolly"+scry+" tH="+txtH );
//alert(alertt);
// cont.innerHTML=alertt + '<br>' +btxt.innerHTML ;
}
else { //hier nach echter pic-angabe

cont.innerHTML=" ";
cont.style.cssText = sbig_cont_for_both;
cont.innerHTML=sbig_containerinhalt;

cont.style.zIndex = 99;
cont.style.visibility='visible';

var tempim = new Image;
tempim.src=fullid;// pic  schon mal laden

var pict=eval(document.getElementById("bigpic"));
if (pict==null) pict=eval(document.getElementById("bigpic"));
if (pict==null) alert("showbig not found: bigpic ");
var btxt=eval(document.getElementById("bigtxt"));
if (btxt==null)btxt=eval(document.getElementById("bigtxt"));
cont.style.height="70%";
cont.style.width="40%";
pict.src=fullid;// pic laden
btxt.innerHTML=atext;
if (testmodus==1) {
btxt.innerHTML+="<br>"+oripicname; 
btxt.innerHTML+="<br>"+fullid; 
 btxt.innerHTML+=' pic id='+a2.id;
}
var picw = (ns4)?  cont.width: (ie4||ie5)?  cont.clientWidth:  cont.offsetWidth ;
var pich = (ns4)?  cont.height: (ie4||ie5)?  cont.clientHeight:  cont.offsetHeight ;

var cm=""
 var l = sbigmouseX+30;
 if (sbigmouseX-picw-30  > 0) {l= 10;cm+="links geht"} 
 var restrechts = (doc_width - sbigmouseX -picw);
 if (restrechts > 30) { l= sbigmouseX+ 30 ; cm+= "weiter rechts geht" }
     
 // mal angenommen die x-plazierung stimmt schon, y kann also auch in der Mitte sein
      
 var t = scry;// default: ganz oben
 var pich_halbe = pich / 2; 
 if      (platzdrueber - pich > 20)            {t= sbigmouseY-pich-20 ;cm+=" drüber geht";} 
 else if (platzdrueber - pich >  0)            {t= 1                  ;cm+=" drüber geht so";} 
 else if (sbigmouseY+pich+20    <= doc_height) {t= sbigmouseY+10      ;cm+=" drunter geht";}  
 else if (sbigmouseY+pich > doc_height)        {t= sbigmouseY-pich_halbe;cm+=" drunter halb";} 
 else {t=sbigmouseY-pich;cm+=" letzte wahl, genau drüber";}
 t=scrolledY;      
 cont.style.left= l;
 cont.style.top = t;
 //btxt.innerHTML+=
alertt=    ("l="+l +" t="+t +" mouseY="+sbigmouseY    +" pich="+pich    +" picw="+picw  +" doc_height="+doc_height+ " sh="+
        screen.height    +"=>"+cm+" platzdrüber="+platzdrueber+" restrechts="+restrechts);  

sbig_timeoutID=setTimeout("sbig('clear');",25000); // nach 10 sek autom loeschen 
}//echtes pic

  }
} // neuere browser
//self.status=alertt;
//alert(alertt);
return true;
} // sbig