/////////////////////////////////////////////////////////////////
//
//  Alpine Meadow Productions  
//
//  Donn Ault
//  Copyright (C) 2009 All Rights Reserved
//  www.alpinemeadow.com
//
/////////////////////////////////////////////////////////////////

var ContainerCount = 0;
var JumpTotal = 0;

function AddWebsite (PageTitle, PageURL, ImageSrc, PageDesc, IsOpen, UpdatedOn)
{
  var TargetDiv = document.getElementById ("WebsiteList");

  if (JumpTotal == 0)
  {
    /////////////////////////////////////////////////////////////////
    //
    //  Create Container Div - Bag of All Holding
    //
    /////////////////////////////////////////////////////////////////
 
    var ContainerDiv = document.createElement ('div');
    ContainerDiv.id             = "Website"+'Container'+ContainerCount;
    ContainerDiv.style.position = "relative";
    ContainerDiv.style.overflow = "visible";
    ContainerDiv.style.width    = 1160+'px';
    ContainerDiv.style.height   = 150+'px';
    ContainerDiv.style.marginTop = 10+'px';
//    ContainerDiv.style.border   =  "1px dashed green";
  
    TargetDiv.appendChild(ContainerDiv);     
  }
  else
  {
    var ContainerDiv = document.getElementById ("Website"+'Container'+ContainerCount);
    ContainerCount += 1;
  }

  /////////////////////////////////////////////////////////////////
  //
  //  Create Container Div - Bag of Single Item Holding
  //
  /////////////////////////////////////////////////////////////////
 
  var SingleItemDiv = document.createElement ('div');
  SingleItemDiv.style.position = "absolute";
  SingleItemDiv.style.top      = 0+'px';

  if (JumpTotal == 0) 
  {
    SingleItemDiv.style.left     = 0+'px';
  }
  else
  {
    SingleItemDiv.style.left     = 605+'px';
  }

  SingleItemDiv.style.overflow = "hidden";
  SingleItemDiv.style.width    = 555+'px';
  SingleItemDiv.style.height   = 150+'px';
//  SingleItemDiv.style.border   =  "1px dashed blue";
  
  ContainerDiv.appendChild(SingleItemDiv);     


  /////////////////////////
  //
  //  Home Anchor
  //
  /////////////////////////

  var PicAnchor = document.createElement ('a');
//  PicAnchor.id   = "Website"+JumpTotal+'PicAnchor';
  PicAnchor.href = PageURL;

  /////////////////////////
  //
  //  Preview Image
  //
  /////////////////////////

  var PreviewImg = document.createElement ('img');
//  PreviewImg.id             = "Website"+JumpTotal+'Preview';
  PreviewImg.style.overflow = "hidden";
  PreviewImg.style.position = "absolute";
  PreviewImg.style.top      = 0+'px';


  if (JumpTotal == 0) 
  {
    PreviewImg.style.left     = 0+'px';
  }
  else
  {
    PreviewImg.style.left     = 305+'px';
  }

  PreviewImg.style.width    = '250px';
  PreviewImg.style.height   = '150px';
  PreviewImg.style.border   = 0;
  PreviewImg.src            = ImageSrc;
  PicAnchor.appendChild(PreviewImg); 
  SingleItemDiv.appendChild(PicAnchor); 

  /////////////////////////
  //
  //  Information DIV
  //
  /////////////////////////

  var InfoDiv = document.createElement ('div');
//  InfoDiv.id             = "Website"+JumpTotal+'Info';
  InfoDiv.style.overflow = "hidden";
  InfoDiv.style.position = "absolute";
  InfoDiv.style.top      = 0+'px';

  if (JumpTotal == 0) 
  {
    InfoDiv.style.left     = 270+'px';
  }
  else
  {
    InfoDiv.style.left     = 0+'px';
  }

  InfoDiv.style.width    = '275px';
  InfoDiv.style.height   = '140px';
  InfoDiv.style.padding  = '5px';
//  InfoDiv.style.border   = "1px dashed green";

  SingleItemDiv.appendChild(InfoDiv); 


    /////////////////////////
    //
    //  Home Anchor
    //
    /////////////////////////

    var HomeAnchor = document.createElement ('a');
    HomeAnchor.id   = "Website"+JumpTotal+'HomeAnchor';
    HomeAnchor.href = PageURL;

    /////////////////////////
    //
    //  Home Image
    //
    /////////////////////////

    var HomeImg = document.createElement ('img');
    HomeImg.id             = "Website"+JumpTotal+'Home';
    HomeImg.style.overflow = "hidden";
    HomeImg.style.position = "absolute";
    HomeImg.style.top      = 0+'px';
    HomeImg.style.left     = 0+'px';
    HomeImg.style.width    = '60px';
    HomeImg.style.height   = '60px';

    if (IsOpen)
    {
      HomeImg.src            = 'media/diamond_green_gas_out.gif'; 
    }
    else
    {
      HomeImg.src            = 'media/diamond_fire_out.gif'; 
    }

    HomeImg.style.border   = 0;
  
    HomeAnchor.appendChild(HomeImg); 

    InfoDiv.appendChild(HomeAnchor); 

    /////////////////////////
    //
    //  Divider Image
    //
    /////////////////////////

    var DividerImg = document.createElement ('img');
//    DividerImg.id             = "Website"+JumpTotal+'Divider';
    DividerImg.style.overflow = "hidden";
    DividerImg.style.position = "absolute";
    DividerImg.style.top      = 27+'px';
    DividerImg.style.left     = 65+'px';
    DividerImg.style.width    = '100%';
    DividerImg.style.height   = '5px';
    DividerImg.src            = 'media/Divider.png'; 
  
    InfoDiv.appendChild(DividerImg); 

    /////////////////////////
    //
    //  Information Title DIV (To Contain Anchor)
    //
    /////////////////////////

    var TitleDiv = document.createElement ('div');
//    TitleDiv.id             = "Website"+JumpTotal+'Title';
    TitleDiv.style.overflow = "hidden";
    TitleDiv.style.position = "absolute";
    TitleDiv.style.top      = 6+'px';
    TitleDiv.style.left     = 65+'px';
    TitleDiv.style.width    = '100%';
    TitleDiv.style.height   = '22px';
//    TitleDiv.style.border   = "1px dashed red";
    TitleDiv.style.fontFamily = 'DejaVuSerif';
    TitleDiv.style.fontSize  = 14+'px';

    /////////////////////////
    //
    //  Information Update DIV
    //
    /////////////////////////

    var UpdatedDiv = document.createElement ('div');
//    UpdatedDiv.id             = "Website"+JumpTotal+'Update';
    UpdatedDiv.style.overflow = "hidden";
    UpdatedDiv.style.position = "absolute";
    UpdatedDiv.style.top      = 35+'px';
    UpdatedDiv.style.left     = 65+'px';
    UpdatedDiv.style.width    = '100%';
    UpdatedDiv.style.height   = '22px';
//    UpdatedDiv.style.border   = "1px dashed red";
    UpdatedDiv.style.fontFamily = 'LiberationMonoRegular';
    UpdatedDiv.style.fontSize  = 12+'px';

    UpdatedDiv.innerHTML = 'Updated on '+UpdatedOn;

    InfoDiv.appendChild(UpdatedDiv); 

    /////////////////////////
    //
    //  Title Anchor
    //
    /////////////////////////

    var TitleAnchor = document.createElement ('a');
//    TitleAnchor.id   = "Website"+JumpTotal+'HomeAnchor';
    TitleAnchor.style.textDecoration = 'none';
    TitleAnchor.href = PageURL;
    TitleAnchor.style.fontFamily = 'DejaVuSerifBold';
    TitleAnchor.style.fontSize  = 12+'px';
    TitleAnchor.innerHTML = PageTitle;
    TitleDiv.appendChild(TitleAnchor);

    InfoDiv.appendChild(TitleDiv); 


    /////////////////////////
    //
    //  Information Details DIV
    //
    /////////////////////////

    var DetailsDiv = document.createElement ('div');
//    DetailsDiv.id             = "Website"+JumpTotal+'Details';
    DetailsDiv.style.overflow = "hidden";
    DetailsDiv.style.position = "absolute";
    DetailsDiv.style.top      = 60+'px';
    DetailsDiv.style.left     = 0+'px';
    DetailsDiv.style.width    = '100%';
    DetailsDiv.style.height   = '100%';
    DetailsDiv.style.fontFamily = 'Dateline';
    DetailsDiv.style.fontSize  = 16+'px';

//    DetailsDiv.style.border   = "1px dashed red";

    DetailsDiv.innerHTML = PageDesc;

    InfoDiv.appendChild(DetailsDiv); 

  if (JumpTotal == 0) 
  {
    JumpTotal = 1;
  }
  else
  {
    JumpTotal = 0;
  }

}

//+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
//
// Initialize the webpage
//
//+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

function LoadWebsiteList()
{
  AddWebsite 
  (
    "Family Genealogy", 
    "Websites/Genealogy/index.html",
    "media/preview/family.jpg",
    "Genealogy resources for the Ault and Redd families",
    true,
    "September 6, 2009"
  );

//  AddWebsite 
//  (
//    "Computer System Design",
//    "Websites/Computer/index.html",
//    "media/preview/computer.jpg",
//    "All things related to building custom computers and cases",
//    false,
//    "September 6, 2009"
//  );

  AddWebsite 
  (
    "Movies of Note",
    "Websites/Movies/index.html",
    "media/preview/Movies.jpg",
    "Movies that in one way or another are special",
    true,
    "September 6, 2009"
  );

  AddWebsite 
  (
    "Books of Note",
    "Websites/Books/index.html",
    "media/preview/Books.jpg",
    "Authors and Books that require your attention",
    true,
    "September 6, 2009"
  );

//  AddWebsite 
//  (
//    "In My Opinion",
//    "Websites/InMyOpinion/index.html",
//    "media/preview/InMyOpinion.jpg",
//    "Everyone is entitled to my opinion, so here it is",
//    false,
//    "September 6, 2009"
//  );

  AddWebsite 
  (
    "The Hanford Jackalope",
    "Websites/Jackalope/index.html",
    "media/preview/Jackalope.jpg",
    "The History, Biology, and Habits of the Handford Jackalope",
    true,
    "September 6, 2009"
  );

//  AddWebsite 
//  (
//    "Delphi Programming",
//    "Websites/Delphi/index.html",
//    "media/preview/delphi.jpg",
//    "Delphi Projects - Programming Principles, Examples, Units, and Complete Projects",
//    false,
//    "September 6, 2009"
//  );

  AddWebsite 
  (
    "A Sampling of Liqueurs",
    "Websites/liqueurs/index.html",
    "media/preview/Liquers.jpg",
    "I love a good liqueur.  As I sample them, I'll file reports.  Note that I'm not a wine connoisseur, just an interested sampler.",
    true,
    "September 6, 2009"
  );

//  AddWebsite 
//  (
//    "Columbia Plateau Cemeteries",
//    "Websites/ColumbiaPlateauCemeteries/index.html",
//    "media/preview/ColumbiaPlateauCemeteries.jpg",
//    "A photographic journey through the cemeteries of the Columbia Plateau",
//    false,
//    "September 6, 2009"
//  );

//  AddWebsite 
//  (
//    "Geography & History",
//    "Websites/Geography/index.html",
//    "media/preview/geography.jpg",
//    "Regional, national, and international articles focusing on geography (physical and cultural) and History",
//    false,
//    "September 6, 2009"
//  );

//  AddWebsite 
//  (
//    "AMP Weather Station",
//    "Websites/Weather-AMP/index.html",
//    "media/preview/Weather-AMP.jpg",
//    "Live weather feed for the AMP Weather Station in Richland, Washington",
//    false,
//    "September 6, 2009"
//  );

//  AddWebsite 
//  (
//    "Weather Station Design",
//    "Websites/Weather-Design/index.html",
//    "media/preview/Weather-Design.jpg",
//    "Weather Station Design and Construction.  The System is based on the 1-Wire system from Motorolla.",
//    false,
//    "September 6, 2009"
//  );

//  AddWebsite 
//  (
//    "Panoramic Photography",
//    "Websites/Panoramic-Photography/index.html",
//    "media/preview/Panoramic-Photography.jpg",
//    "Experiments in Panoramic Photography",
//    false,
//    "September 6, 2009"
//  );

//  AddWebsite 
//  (
//    "Windows Gadgets",
//    "Websites/Gadgets/index.html", 
//    "media/preview/gadgets.jpg", 
//    "Windows gadgets programming and a small collection of my gadgets",
//    true,
//    "March 23, 2010"
//  );

//  AddWebsite 
//  (
//    "Wallpaper",
//    "Websites/Wallpaper/index.html",
//    "media/preview/wallpaper.jpg",
//    "Computer Wallpaper and Other Desktop Graphics",
//    false,
//    "September 6, 2009"
//  );

//  AddWebsite 
//  (
//    "Backpacking and Dayhikes",
//    "Websites/Backpacking/index.html",
//    "media/preview/Backpacking.jpg",
//    "Backpacking trips and Dayhikes I've taken",
//    false,
//    "September 6, 2009"
//  );

//  AddWebsite 
//  (
//    "Tutorials on Graphics",
//    "Websites/Tutorials-Graphics/index.html",
//    "media/preview/Tutorials-Graphics.jpg",
//    "How-to articles on using Photoshop and Illustrator (and others as needed) to create graphics.",
//    false,
//    "September 6, 2009"
//  );

//  AddWebsite 
//  (
//    "Website Design Principles",
//    "Websites/Website/index.html",
//    "media/preview/website.jpg",
//    "Website Design Principles and Practices",
//    false,
//    "September 6, 2009"
//  );

//  AddWebsite 
//  (
//    "Travel Guides",
//    "Websites/Travel/index.html",
//    "media/preview/travel.jpg",
//    "Photographic Guides to Local, National, and International Travel",
//    false,
//    "September 6, 2009"
//  );


}