var pic_id=-1;
var pic_left=0;
var pic_right=0;


/*
icon=document.getElementById("container");

pic_div=document.createElement('div');
icon.appendChild(pic_div);
pic_div.id = 'pic_div';

pic=document.createElement('img');
pic_div.appendChild(pic);
pic.id = 'pic';
pic.onclick=next_pic;
pic.onload=resize_pic_div;
pic.src="images/link_back.png";

close_button=document.createElement('div');
pic_div.appendChild(close_button);
close_button.id = 'close_button';
pic.onclick=hide_pic;

left_button=document.createElement('div');
pic_div.appendChild(left_button);
left_button.id = 'left_button';
pic.onclick=prev_pic;

right_button=document.createElement('div');
pic_div.appendChild(right_button);
right_button.id = 'right_button';
pic.onclick=prev_pic;
*/

document.onkeyup = hide_pic;
document.onmouseup = hide_pic;




function show_pic(id, pic)
  {
  document.getElementById("inner_container").style.opacity="0.2";
//  document.getElementById("inner_container").style.filter="alpha(opacity=20)";

  pic_visible=1;

  pic_id=id;
  img=document.getElementById("pic");
  div=document.getElementById("pic_div");
  img.src=pic;


  pic_id--;
  if(document.getElementById("pic_"+pic_id))
    pic_left=1;
  else
    pic_left=0;

  pic_id++;

  pic_id++;

  if(document.getElementById("pic_"+pic_id))
    {
    pic_right=1;
    }
  else
    {
    pic_right=0;
    }
  pic_id--;

  if(pic_id==id)
    {
    resize_pic_div();
    }

  }

function show_pic2(id, pic)
  {
  document.getElementById("inner_container").style.opacity="0.2";
//  document.getElementById("inner_container").style.filter="alpha(opacity=20)";

  pic_visible=1;

  pic_id=id;
  a=document.getElementById("pic");
  div=document.getElementById("pic_div");
  a.src=pic;


  pic_id--;
  if(document.getElementById("pic_"+pic_id))
    pic_left=1;
  else
    pic_left=0;

  pic_id++;

  pic_id++;

  if(document.getElementById("pic_"+pic_id))
    {
    pic_right=1;
    }
  else
    {
    pic_right=0;
    }
  pic_id--;

  if(pic_id==id)
    {
    resize_pic_div();
    }

  }


function hide_pic()
  {
  document.getElementById("inner_container").style.opacity="1";
//  document.getElementById("inner_container").style.filter="alpha(opacity=100)";
  pic_visible=0;
  if(div=document.getElementById("pic_div"))
    div.style.left="-3000px";

  var div = document.getElementById('sc_img_list');
  }

function resize_pic_div(id, pic)
  {
  if(pic_visible)
    {
    div=document.getElementById("pic_div");

    div.style.left=(get_win_size().w-div.clientWidth)/2+"px";
    div.style.top=(get_win_size().h-div.clientHeight)/2+"px";

    document.getElementById("close_button").style.left=(div.clientWidth-45)+"px";

    if(pic_left)
      {
      document.getElementById("left_button").style.left="5px";
      document.getElementById("left_button").style.height=((div.clientHeight)/3)+"px";
      document.getElementById("left_button").style.top=((div.clientHeight)/2-(div.clientHeight)/6)+"px";
      }
    else
      {
      document.getElementById("left_button").style.left="-1000px";
      }

    if(pic_right)
      {
      document.getElementById("right_button").style.left=(div.clientWidth-45)+"px";
      document.getElementById("right_button").style.height=((div.clientHeight)/3)+"px";
      document.getElementById("right_button").style.top=((div.clientHeight)/2-(div.clientHeight)/6)+"px";
      }
    else
      {
      document.getElementById("right_button").style.left="-1000px";
      }
    }
  }

function prev_pic()
  {
  if(pic_id>0)
    {
    pic_id--;
    document.getElementById("pic_"+pic_id).onclick();
    }
  }

function next_pic()
  {
  pic_id++;
  if(document.getElementById("pic_"+pic_id))
    document.getElementById("pic_"+pic_id).onclick();
  else
    pic_id--;
  }


function get_win_size()
  {   var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' )
    {
    //Non-IE
    w = window.innerWidth;
    h = window.innerHeight;
    }
  else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) )
    {
    //IE 6+ in 'standards compliant mode'
    w = document.documentElement.clientWidth;
    h = document.documentElement.clientHeight;
    }
  else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) )
    {
    //IE 4 compatible
    w = document.body.clientWidth;
    h = document.body.clientHeight;
    }
  return {w:w, h:h};
  }
