User:Felice/externalports.html.template

From OLPC
< User:Felice
Revision as of 13:44, 26 December 2007 by Walter (talk | contribs)
Jump to navigation Jump to search
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.
  This page is monitored by the OLPC team.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="$gettext{'lang'}" xml:lang="$gettext{'lang'}">

<head>
	<title>$gettext{'olpc'}, $gettext{'gettingstartedtitle'}: $gettext{'gettingstartedt13'}</title>
	<meta name="Description" content="$gettext{'gettingstarteddescription'}" />
	<meta name="keywords" content="$gettext{'gettingstartedkeywords'}" />
	<!--#include virtual="../../includes/meta.html" -->
	<!--#include virtual="../../includes/icon.html" -->
	<!--#include virtual="../../includes/css.html" -->
	<!--#include virtual="../../includes/javascript.html" -->

	<!-- JS -->
	<script	�type="text/javascript" src="http://yui.yahooapis.com/2.3.1/build/yahoo/yahoo-min.js" ></script>
	<script type="text/javascript" src="http://yui.yahooapis.com/2.3.1/build/dom/dom-min.js"></script>
	<script	type="text/javascript" src="http://yui.yahooapis.com/2.3.1/build/event/event-min.js" ></script>
	<script	type="text/javascript" src="../../JS/contentDisplay.js" ></script>
	<script	type="text/javascript" src="../../JS/swfObject.js" ></script>
	<!-- //JS -->

<script type="text/javascript">
function DisplayDesc(ImageName,e)
{
   var coords = e.coords;
   <!--Splitting the String to extract the left and top values-->
   var temp = new Array();
   temp = coords.split(',');
   var coordLeft = temp[0];
   var coordTop = temp[1];

   var ImageMedia = document.getElementById(ImageName);

   var xy = YAHOO.util.Dom.getXY(ImageMedia);

   var dot = document.getElementById("imgGreenDot");
   //dot.style.position = "relative";
   xy[0] += parseInt(coordLeft, 10);
   xy[1] += parseInt(coordTop, 10);

   //Display the Green Dot
   YAHOO.util.Dom.setXY(dot, xy);
   YAHOO.util.Dom.setStyle("imgGreenDot", 'cursor', 'pointer');

   switch(e.id)
   {
   case "d1":
   document.getElementById("desc_view").innerHTML = "<h3>$gettext{'externalportsh1'}</h3><p>$gettext{'externalportsp1'}</p>"
   break;

   case "d2":
   document.getElementById("desc_view").innerHTML = "<h3>$gettext{'externalportsh2'}</h3><p>$gettext{'externalportsp2'}</p>"
   break;

   case "d3":
   document.getElementById("desc_view").innerHTML = "<h3>$gettext{'externalportsh3'}</h3><p>$gettext{'externalportsp3'}</p>"
   break;

   case "d4":
   document.getElementById("desc_view").innerHTML = "<h3>$gettext{'externalportsh4'}</h3><p>$gettext{'externalportsp4'}</p>"
   break;

   case "d5":
   document.getElementById("desc_view").innerHTML = "<h3>$gettext{'externalportsh5'}</h3><p>$gettext{'externalportsp5'}</p>"
   break;

   case "d6":
   document.getElementById("desc_view").innerHTML = "<h3>$gettext{'externalportsh6'}</h3><p>$gettext{'externalportsp6'}</p>"
   break;
   }
}

function DisplayIntro()
{
   YAHOO.util.Dom.setStyle("imgGreenDot", 'position', 'static');
   YAHOO.util.Dom.setStyle("imgGreenDot", 'left', '-300px');
}
	
function DisplayRollOn()
{
   document.getElementById('rollOver').style.display = 'block'; 
   document.getElementById('clickOn').style.display = 'none';
}
	
function DisplayRollOff()
{
   document.getElementById('clickOn').style.display = 'block';
   document.getElementById('rollOver').style.display = 'none'; 
}
</script>
</head>

<body id="start" class="start" lang="$gettext{'lang'}">
	<!--#include virtual="../../includes/logo.html" -->
	<!--#include virtual="../../includes/header.html" -->

<div id="main-body" class="section clearfix">

   <div id="main-content" class="clearfix">
      <div id="tools">
			<h3>$gettext{'gettingstartedth1'}</h3>
				<ul>
				        <li><a href="index.shtml">$gettext{'gettingstartedt1'}</a></li>
					<li><a href="connecting.shtml">$gettext{'gettingstartedt2'}</a></li>
					<li><a href="activities.shtml">$gettext{'gettingstartedt3'}</a></li>
					<li><a href="invite.shtml">$gettext{'gettingstartedt4'}</a></li>
					<li><a href="sharing.shtml">$gettext{'gettingstartedt5'}</a></li>
					<li><a href="journal.shtml">$gettext{'gettingstartedt6'}</a></li>
				        <li><a href="ebook.shtml">$gettext{'gettingstartedt7'}</a></li>
					<li> </li>
					<li> </li>
				        <li><a href="homeview.shtml">$gettext{'gettingstartedt8'}</a></li>
				        <li><a href="friendsview.shtml">$gettext{'gettingstartedt9'}</a></li>
					<li><a href="neighborhoodview.shtml">$gettext{'gettingstartedt10'}</a></li>
					<li><a href="activityview.shtml">$gettext{'gettingstartedt11'}</a></li>
					<li><a href="features.shtml">$gettext{'gettingstartedt12'}</a></li>
					<li class="selected"><a href="externalports.shtml">$gettext{'gettingstartedt13'}</a><br/><br/></li>
					<li><a href="keyboard.shtml">$gettext{'gettingstartedt14'}</a></li>
					<li><a href="battery.shtml">$gettext{'gettingstartedt15'}</a></li>
					<li> </li>
					<li> </li>
					<li><a href="troubleshooting.shtml">$gettext{'gettingstartedt16'}</a></li>
				</ul>			
      </div>	<!-- /tools -->	

      <div id="content">
         <img id="imgGreenDot" alt="dot" src="../../img/GreenDot.gif" style="position:relative;left:-300px;" />
	 <div id="media_view" class="media">
         <img id="xo_map" alt="xo laptop" src="../../img/xo_view2.jpg" usemap="#xo_map" border="0" />
	 <map id="xo_map" name="xo_map">
	    <area shape="rect" id="d1" coords="329,210,343,225" onmouseover="DisplayDesc('xo_map',this)" alt="$gettext{'externalportsh1'}" />
	    <area shape="rect"   id="d2" coords="11,308,25,322" onmouseover="DisplayDesc('xo_map',this)" alt="$gettext{'externalportsh2'}" />
	    <area shape="rect"   id="d3" coords="11,266,25,280" onmouseover="DisplayDesc('xo_map',this)" alt="$gettext{'externalportsh3'}" />
	    <area shape="rect"   id="d4" coords="11,190,25,204" onmouseover="DisplayDesc('xo_map',this)" alt="$gettext{'externalportsh4'}" />
	    <area shape="rect"   id="d5" coords="11,169,25,183" onmouseover="DisplayDesc('xo_map',this)" alt="$gettext{'externalportsh5'}" />
	    <area shape="rect"   id="d6" coords="11,100,25,114" onmouseover="DisplayDesc('xo_map',this)" alt="$gettext{'externalportsh6'}" />
	 </map>
         </div> <!-- media -->
         <div id="desc_view" class="description">
	 <h3>$gettext{'externalportsh7'}</h3>
         <p>$gettext{'externalportsp7'}</p>
         </div> <!-- description -->
      </div> <!-- content -->

      <div id="sub-content">
      </div> <!-- sub-content -->

   </div> <!-- main-content -->

   <!--#include virtual="../../includes/footer.html" -->

</div> <!-- main-body -->

</body>
</html>