var curpic = 0;
var curdiv = 0;
var gmap = null;
var gmarker = null;
var slideint = null;
var looped = false;

var marker_icons = {};
var gIconSize3232 = new  GSize(32,32);
var gShadowSize = new GSize(59, 32);
var gIconAnchor = new GPoint(16, 32);
var gInfoWindowAnchor = new GPoint(16, 2);

var default_icon_name = "geopost";


marker_icons["default"] = getIcon( default_icon_name );
marker_icons["def"] = getIcon( default_icon_name );
var default_icon = marker_icons["def"];

function iconName( iconimg )
{
    return (iconimg=="default" || iconimg == "def" || iconimg == "" ) ? default_icon_name : iconimg;
}

function iconRule( post )
{
    return iconName(post.iconimg);
}

function shadowIcon( name )
{
    return "geogroups/icons/" + name + ".shadow.png" ;
}

function getIcon( name )
{
    var ic = marker_icons[name];
    if (  ic == null )
    {
        ic = new GIcon();
        ic.image = "geogroups/icons/" + name + ".png";
        ic.iconSize = gIconSize3232;
        ic.shadow = shadowIcon( name );
        ic.iconAnchor = gIconAnchor;
        ic.infoWindowAnchor = gInfoWindowAnchor;
        marker_icons[name] = ic;
    }
    return ic;
}

function showDiv( which, show )
{
    document.getElementById( "pic" + which ).style.visibility = show ? "visible" : "hidden";
}

function setOpacity( which, opacity )
{
  var curimg = document.getElementById( "img" + which );
  if ( curimg ) {
    curimg.style.opacity = opacity / 100.0;
    curimg.style.filter = "alpha(opacity="+opacity+")";
  }
}
function zoomout()
{
  var olatlng = gmap.getCenter();
  var gpoint = gmap.fromLatLngToDivPixel( olatlng );
  gpoint.x += 70;
  var latlng = gmap.fromDivPixelToLatLng( gpoint );  
  gmap.zoomOut( latlng, true );
}
var llatlng = null;
function zoomin()
{
    if ( llatlng )
    {
        gmap.zoomIn( llatlng, false, true );
    }
}
function nextPic()
{
    var nextdiv = 1 - curdiv;

    var curimg = document.getElementById( "img" + curdiv );
    var post = pics[curpic];
    if ( curimg )
    {
        if ( curimg.height > 180 ) 
        {
            var ar = curimg.width / curimg.height;
            curimg.height = 180;
            curimg.width = 180 * ar;
        }
        curimg.style.opacity = "0.2";
        curimg.style.filter = "alpha(opacity=20)";
        showDiv( curdiv, true );
        if ( curpic == (pics.length-1) )
        { 
            window.clearInterval( slideint ); 
            slideint = null;
        }
    }

    showDiv( nextdiv, false );
    var nextpicdiv = document.getElementById( "pic" + nextdiv );
    var previmg = document.getElementById( "img" + nextdiv );
    if ( previmg )
    {
        nextpicdiv.removeChild( previmg );
        previmg = null;
    }
    nextpicdiv.innerHTML=
      "<img id='img" +nextdiv +"' style='border-radius:3px;-moz-border-radius:3px;' width='200' src='geogroups/pic/" + pics[curpic].picurl + ".jpg' />";

    if ( gmarker )
        gmap.removeOverlay( gmarker );
    gmarker = null;
    if ( curpic > 0 )
    {
      var post = pics[curpic-1];
      var latlng = new GLatLng( post.latitude, post.longitude );

      var opts = { labelText: "<img src='/images/camera16.png'>", 
                   labelClass: "LabeledMarker_Home" 
                 };
      if ( post.iconimg != "blue-pushpin" )
          opts.icon = getIcon( iconName( post.iconimg ) );

      gmarker = new LabeledMarker( latlng, opts );
      gmap.addOverlay( gmarker );

      var gpoint = gmap.fromLatLngToDivPixel( latlng );
      gpoint.x -= 70;
      var olatlng = gmap.fromDivPixelToLatLng( gpoint );
      
      gmap.panTo( olatlng );

      llatlng = latlng;

      window.setTimeout( "zoomin()", 100 );

      window.setTimeout( "setOpacity(" + curdiv + ", 40 )", 200 );
      window.setTimeout( "setOpacity(" + curdiv + ", 60 )", 600 );
      window.setTimeout( "setOpacity(" + curdiv + ", 80 )", 800 );
      window.setTimeout( "setOpacity(" + curdiv + ", 90 )", 900 );
      window.setTimeout( "setOpacity(" + curdiv + ", 100 )", 1000);

      window.setTimeout( "zoomout()", 3000 );

      window.setTimeout( "setOpacity(" + curdiv + ", 80 )", 3200);
      window.setTimeout( "setOpacity(" + curdiv + ", 60 )", 3300);
      window.setTimeout( "setOpacity(" + curdiv + ", 40 )", 3400);


    }


    curpic++; 
    if ( curpic >= pics.length ) { curpic = 0; }
    curdiv = nextdiv;
 
}

function onload()
{
    if ( GBrowserIsCompatible() )
    {
        gmap = new GMap2( document.getElementById("gmap") );
        gmap.setCenter(new GLatLng(37, -122), 3);
        gmap.enableContinuousZoom();
        gmap.setUIToDefault();
    }
    nextPic();
    goNow();
    //window.setTimeout( "nextPic()", 500 );
    //slideint = window.setInterval( "nextPic()", 3500 );
}
function onunload()
{
    if ( slideint != null ) window.clearInterval();
    GUnload();
}