/////////////////////////////////////////////////////////////////
//
// Designed and coded by Michael Mike Neubig, www.LifeInPlace.org
//
// implements a liquid design 
//
// tested under 
//   Mozilla 1.7.12 
//   Firefox 1.5
//   IE      6.0.2800.1106.xpsp1.020828-1920
//
// semi-colons are not nec., but allow xemacs to 
// font-lock color correctly
//
// 2005-11-05 first version 
//
/////////////////////////////////////////////////////////////////

var Familynm = "Michael_Mike_Neubig_Copyright_2005.";

var homepage = 'http://www.lifeinplace.com'

var ra = new Array(
'r63455726',
'r06601795',
'r03182549',
'r93171600',
'r54941701',
'r42021265'
);
var native_width;
var native_height;


function wsadd(s,a,b){
  window.status += s + ': ' + a + '  ' + b + '    ';
}

function wsupdate(){
  var i, d;
  window.status = 'wsupdate:  ';

  wsadd('win',wcan(), hcan());

  wsadd('nat',native_width, native_height);

  i = document.getElementById('centerimage');
  wsadd('img', i.width, i.height);

  d = document.getElementById('imagediv');
  wsadd('img', d.offsetWidth, d.offsetHeight);
}


function place_image(ident) {
  window.status = 'place_image:  ';
  var i;
  
  i = document.getElementById('centerimage');
  // these two are necessary in both cases
  i.style.width  = 'auto';
  i.style.height = 'auto';
  i.src          = Familynm + ident + '.jpg';
  i.GALLERYIMG   = "no";
  if(0){
    // this works in mozilla
    native_width   = i.width;
    native_height  = i.height;
  }else{
    native_width   = 1024;
    native_height  = 768;
  }
  // these two are a hack for IE 
  i.style.width  = native_width  + 'px';
  i.style.height = native_height + 'px';

  native_ratio   = native_height / native_width;
  update_navbar_styles(ident);
}

function update_navbar_styles(cur_id){  
  window.status = 'update_navbar_styles:  ';
  var ii, a;
  for( ii=0; ii<ra.length; ii++ ){
    a = document.getElementById(ra[ii]);
    a.className = "offstage";
  }
  a = document.getElementById(cur_id);
  a.className = "onstage";
  resz();
}


function wcan(){
  return w_or_h_canvas(1);
}
function hcan(){
  return w_or_h_canvas(2);
}
function w_or_h_canvas(s){
  var w, h, d, dd, db;

  if (self.innerHeight){ // mozilla
    w = self.innerWidth;
    h = self.innerHeight;
  }else{
    dd = document.documentElement;
    db = document.body;
    if (dd && dd.clientHeight){
      d = dd;
    }else if (db){ 
      d = db;
    }
    w = d.clientWidth;
    h = d.clientHeight;
  }
  if(s==1){return w};
  if(s==2){return h};
}

var Hnative = 38;

function resz_navbar(hc){
  var s,ii,h, d, fct;
  fct = Math.min(1.0, hc/native_height);
  h = fct * Hnative;
  for( ii=0; ii<ra.length; ii++ ){
    s = document.getElementById(ra[ii]).style;
    s.height = h + 'px';
  }

  fct = Math.min(1.0, hc/native_height); // keeps letter shorter than box
  d = document.getElementById('navdiv');
  d.style.fontSize   = 100 * fct + '%';
  return d;
}


function resz_centerimage(wc,hc){
  var i,s,nativ;
  var wpcent = 0.90;
  var hpcent = 0.80;
  var rpcent = hpcent/wpcent;

  // Maintain native aspect ratio by setting width or height to
  // auto. The aspect ratio of the canvas deterimes which one
  // needs to be set to auto.  Native values are updated whenever 
  // a new image is placed.

  i = document.getElementById('centerimage');

  nativ = true;
  i.style.width  = 'auto';
  i.style.height = 'auto';

  if(rpcent * hc/wc > native_ratio){
    if(wc * wpcent < native_width){
      nativ = false;
      i.style.width = wpcent * wc + 'px';
    }
  }else{
    if(hc * hpcent < native_height){
      nativ = false;
      i.style.height = hpcent * hc + 'px';
    }
  }
  s = document.getElementById('glite').style;
  s.backgroundColor = (nativ) ? "#00AA00" : "#004400";
  return i;
}


function resz(){
  window.status = 'resz: ';
  var w, h, i, d, wcanvas, hcanvas;

  wcanvas = wcan();
  hcanvas = hcan();
  wsadd('win', wcanvas, hcanvas);

  wsadd('nat', native_width, native_height);
  
  d = resz_navbar(hcanvas);

  i = resz_centerimage(wcanvas,hcanvas);
  wsadd('img', i.width, i.height);

  d = update_imagediv(i.width, i.height);
  wsadd('div', d.offsetWidth, d.offsetHeight);
}


function update_imagediv(w,h){
  var d;
  d = document.getElementById('imagediv');
  d.style.position   = 'absolute';
  d.style.top        = 53 + '%';
  d.style.left       = 50 + '%';
  d.style.width      = w  + 'px';
  d.style.height     = h  + 'px';
  d.style.marginTop  = Math.floor(-h/2) + 'px';
  d.style.marginLeft = Math.floor(-w/2) + 'px';
  return d;
}


function write_mouseovers(){
  window.status = 'write_mouseovers:  ';
  var ii;
  var spc = '';
  spc +="&nbsp;";
  spc +="&nbsp;";
  spc +="&nbsp;";
  for( ii=0; ii<ra.length; ii++ ){
    s  = spc;
    s += '<a ';
    s +=   'navindex="'     + ii     + '" ';
    s +=   'title="photo '  + ii     + '" ';
    s += '>';
    s += '<img ';
    s +=   'src="' + Familynm + 't' + ra[ii].substring(1) + '.jpg' +'"';
    s +=   'class="offstage" ';
    s +=   'id="'           + ra[ii] + '"';
    s += '>'
    s += '</img>';
    s += '</a>';
    document.write(s);
  }
  document.write(spc);
  document.write(spc + "<a class='navlinks' navindex='"+ ii +"' title='next page' id='G'>Continue</a>");
  document.write(spc);
}


function prep_links(){
  var e, d, ii;
  e = document.getElementById("G");
  e.href        = "Prelude.3.html";
  e.onmouseover = function(){window.status="galleries";return true;};
  e.onmouseout  = function(){winstat_sz();return true;};
  e.onclick     = function(){this.blur();window.status='';return true;};
  for( ii=0; ii<ra.length; ii++ ){
    a = document.getElementById(ra[ii]);
    a.onmouseover = function(){s=this.getAttribute('id');place_image(s);return true;};
  }
}


function prep_images(){ 
  place_image(ra[0]);
}


function prep_divs(){
  window.status = 'prep_divs: ';
  var w, h, i, d;

  wsadd('win', wcan(), hcan());

  wsadd('nat', native_width, native_height);

  i = document.getElementById('centerimage');
  w = i.width;
  h = i.height;
  wsadd('img', w, h);
  d = update_imagediv(w,h);
  wsadd('div', d.offsetWidth, d.offsetHeight);
}


function prep_glite(){
  var s;
  s = document.getElementById('glite').style;
  s.position   = 'absolute';
  s.top        = 5  + 'px';
  s.left       = 5  + 'px';
  s.width      = 15 + 'px';
  s.height     = 15 + 'px';
}


function A_prep(){
// redefined in Prelude.A.js
}


function prep(){
  prep_links();
  A_prep();
  prep_glite();
  prep_images();
  prep_divs();
  resz();
  // not sure why the intital painting is in correct,
  // but this second pass with a timeout fixes it
  //var s = setTimeout("prep_images()",500);
}

function cref(){
  var u = document.referrer;
  if(u.length == 0 ){
    return
  }
  u = u.substr(0,homepage.length+5);
  u = u.toLowerCase();
  if(!u.match('lifeinplace') && !u.match('mikeneubig') && !u.match('michaelneubig')  && !u.match('depthsofbeauty')){
    window.location = homepage;
  }
}


function kdwn(){
  window.location = window.location;
}


function bgn(){
  cref();
  window.onkeydown = kdwn;
  window.onresize = resz;
  prep();
}