function change_src(image_id, new_src) {
    document.getElementById (image_id).src = new_src;
    return true;
}

function getHeaderOnly() {
    document.body.innerHTML =    
	'<div id="header">' +
	'<a href="index.html">' + 
	'<img id="logo" src="images/GNGlogo_medium_comic.png" alt="Global Newt Games logo" />' +
	'<div id="tagline">' +
	'  <span>Where kids meet science...</span><br/><span style="margin-left: 6em;">one step at a time</span>' +
	'</div>' + 
	// '<img id="tagline" src="images/tagline3.png" alt="Where kids meet science... one step at a time" />' + 
	'</a>' + 
	'</div>' +
	'<div class="box green" id="contact">' +
	'Contact us at <br />' +
	'<a href="mailto:info@benchmarkpublishing.com">' +
	'info@benchmarkpublishing.com' +
	'</a>' +
	'</div>' +
	document.body.innerHTML;

}

function getSidebar() {

}
function getHeader() {
    // prepare thumbnails for sidebar
    var thumbs =
	'<div style="position: absolute; top: 440px; left: 25px; ">' +
	'  <a href="globalmaniagame.html"><img  style="width: 200px;" src="resources/globalmania.jpg"></a><br /><br />' + 
	'  <a href="aquamaniagame.html"><img  style="width: 200px;" src="resources/aquamania.jpg"></a><br /><br />' + 
	'  <a href="biomemaniagame.html"><img  style="width: 200px; " src="resources/biomemania.jpg"></a><br /><br />' + 
	'  <a href="termitemoundgame.html"><img  style="width: 200px;" src="resources/TMboardforweb.jpg"></a><br /><br />' + 
	'  <a href="beehivegame.html"><img  style="width: 200px;" src="resources/beehive.jpg"></a><br /><br />' + 
	'  <a href="antcolonygame.html"><img  style="width: 200px;" src="resources/antcolony.jpg"></a><br /><br />' +
	'</div></div>';
    
    // add header
   	getHeaderOnly();

    // add sidebar    
    document.body.innerHTML = 
'    <div id="sidebar">' +
'      <table>' +
'       <tr><td><a href="index.html"><div><img src="images/world.png"> Start</div></a></td></tr>' + 
'	<tr><td><a href="pricing.html"><div><img src="images/basket%20rhs.png" /> Order and Pricing</div></a></td></tr>' +
'	<tr><td><a href="foodchaingames.html"><div><img src="images/foodchain.png" /> Food Chain Games</div></a></td></tr>' +
'	<tr><td><a href="socialinsectsgames.html"><div><img src="images/bee.png" /> Social Insect Games</div></a></td></tr>' +
'	<tr><td><a href="playstrategies.html"><div><img src="images/group.png" /> Play Strategies</div></a></td></tr>' +
'	<tr><td><a href="mailto:info@benchmarkpublishing.com"><div><img src="images/email.png" /> Email Us</div></a></td></tr>' +
'      </table>' +
'    </div>' +

'    <img id="paw_1" src="images/paw_small.png" alt="PaW pRiNtS"  />' +
'    <img id="paw_2" src="images/paw_small.png" alt="PaW pRiNtS"  />' +
'    <img id="paw_3" src="images/paw_small.png" alt="PaW pRiNtS"  />' +

	thumbs + 
	document.body.innerHTML;
}


var index = 0;

function make_button_html (text, target_href, button_type, dir_right) {
    index = index + 1;

    if (dir_right == undefined) {
	dir_right = true;
    }

    var button_text = "<a class='handy' href='" + target_href + "' onMouseOver='change_src(\"btn_" + index + "\", \"images/" + button_type + "2.png\")' " +   
	" onMouseOut='change_src(\"btn_" + index + "\", \"images/" + button_type + ".png\")'>" +
	text +
	"</a> ";
    var button_img = "<a href='" + target_href + "' onMouseOver='change_src(\"btn_" + index + "\", \"images/" + button_type + "2.png\")' " +   
	" onMouseOut='change_src(\"btn_" + index + "\", \"images/" + button_type + ".png\")'>" +
	"<img src='images/" + button_type + ".png' id='btn_" + index + "' />" +
	"</a>";
    var button = "";

    if (dir_right) {
	button = button_text + " " + button_img;
    } else {
	button = button_img + " " + button_text;
    }
	    
    return button;
}

function make_button(text, target_href, button_type, dir_right) {
    var button = make_button_html (text, target_href, button_type, dir_right);
    
    document.write (button);
}



function getGameDirectory() {
    divbody = document.getElementById ("bodynosidebar");
    divbody.innerHTML = divbody.innerHTML +
'  <div class="gamesdirectory">' +
'  <table width="800" border="0" cellspacing="0" cellpadding="0" align="center">' +
'' +
'    <tr>' +
'      <th style="width: 320px; background-color: #000090;" >' +
make_button_html ("Food Chain Games", "foodchaingames.html", "forward", false) +
'      </th>' +
'      <th style="width: 40px;"></th>' +
'      <th style="width: 320px; background-color: #007500;">' +
make_button_html ("Social Insects Games", "socialinsectsgames.html", "forward", false) +
'      </th>' +
'    </tr>' +
'' +
'    <tr>' +
'      <td style="background-color: #5BA03A;">' +
make_button_html ("Global-Mania", "globalmaniagame.html", "forward", false) +
'      </td>' +
'      <td></td>' +
'      <td style="background-color: #8C028C;">' +
make_button_html ("Termite Mound", "termitemoundgame.html", "forward", false) +
'      </td>' +
'    </tr>' +
'' +
'    <tr>' +
'      <td style="background-color: #01A0AD;">' +
make_button_html ("Aqua-Mania", "aquamaniagame.html", "forward", false) +
'      </td>' +
'      <td></td>' +
'      <td style="background-color: #E4B803;">' +
make_button_html ("Bee Hive", "beehivegame.html", "forward", false) +
'      </td>' +
'    </tr>' +
'	' +
'    <tr>' +
'      <td style="background-color: #B38704;">' +
make_button_html ("Biome-Mania", "biomemaniagame.html", "forward", false) +
'      </td>' +
'      <td></td>' +
'      <td style="background-color: #AE0000;">' +
make_button_html ("Ant Colony", "antcolonygame.html", "forward", false) +
'      </td>' +
'    </tr>' +
'' +
'  </table>' +
'  <br>' +
'' +
'' +
'  <table style="margin-left: auto; margin-right: auto;">' +
'  <tr>' +
'	  <td>' +
make_button_html ("Home", "index.html", "backward", false) +
'     </td>' +
'' +
'	  <td><a href="http://www.bluegreendreams.com/index.html"><img src="resources/BGDlogo3.gif" style="border: solid 2px black;" /></a></td>' +
'' +
'    <td>' +
make_button_html ("Checkout", "pricing.html", "forward") +
'    </td>' +
'  </tr>' +
'  </table>' +
'  </div>';

}