<script type="text/javascript" src="js/mapevents.js"></script>
<SCRIPT language="JavaScript">
<!--
if (document.images)
{
  preload_image = new Image(25,25);
  preload_image.src="/images/bt.gif";
}
//-->
</SCRIPT>

<style media="all" type="text/css">





/* ---------=====------- Dragger Div UI -------=====------ */

#faderbox {
	filter:alpha(opacity=50);-moz-opacity:.50;opacity:.50;
	background:url(images/fade.png) repeat;
	margin-top: -100px;
	margin-left: 0px;
	visibility: hidden;
	width: 3000px;
	height: 2100px;
	z-index: 14;
}

#InfoText {
	filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;
	background: #606060;
	color: #ffffff;
	padding-left: 5px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-right: 3px;
	Position: absolute;
	width: 213px;
	z-index: 6;
	left: 600px;
	top: 7px;
	font-size:12px;
}

#ZoomText {
	filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;
	background: #606060;
	color: #ffffff;
	padding-left: 5px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-right: 3px;
	Position: absolute;
	width: 125px;
	z-index: 6;
	left: 6px;
	top: 7px;
	font-size:12px;
}


/* ----=============----- Dragging DIV -----================---- */
.VEPart {
  border:0px solid gray;
  padding:2px;
  position:absolute;
  z-index: 0;
  top:-600px;
  height: 4000px;
  left:-25px;
  background-repeat: no-repeat;
  background-position: 0px 0px;
}


#Wrapper {
position: absolute;
background-color:#9ec7f3;
left: 5px;
top: 5px;
width: 812px;
height: 576px;
border-top:  2px solid #666;
border-left:  2px solid #666;
border-bottom: 2px solid #666;
border-right: 2px solid #666;
z-index: 5;
overflow: hidden;
}


#moveme{
background-image:url(images/map/fullmap.jpg);
left: 0px; top: 0px;
}
#nomove{
background-image:url(images/map/smallmap.jpg);
background-repeat:no-repeat;
width:812px;
height:576px;

}
</style>

<?php

	$db = mysql_connect('mysql4-3.wc1', '334769_sitebot', 'finaid') or die("Couldn't connect to the database.");
	mysql_select_db('334769?_siteContent') or die("Couldn't select the database");

	$letterData = mysql_query("SELECT * FROM letters WHERE display = 'Y'") or die("Couldn't query the user-database2.");
	$letterData2 = mysql_query("SELECT * FROM letters WHERE display = 'Y'") or die("Couldn't query the user-database2.");
?>

<div id="position" style="position: absolute; left: 0px; top: 0px;">
	<div id="InfoText" style="visibility: hidden;">
		Click and Drag Mouse to move Image
	</div>
	<div id="ZoomText" style="display:none;">
		<a id="zoomin" style="color:#FFFFFF;" href="#" onclick="zoom();">Zoom In</a>
		<a id="zoomout" style="color:#FFFFFF;visibility: hidden;" href="#" onclick="zoom();">Zoom Out</a>
	</div>
	<div id="Wrapper">

		<div name="moveme" id="moveme" class="VEPart" style="width: 3000px; height: 2100px;visibility: hidden;">

			<?php
				while($letter_info = mysql_fetch_array($letterData)){

					echo "<!-- ".$letter_info['name']." --> <a target='_parent' href='";
					echo "/decode.php?p=".$letter_info['letter'];
					echo "'><img border=0 style='position:absolute;left:";
					echo $letter_info['xcord']."px;top:";
					echo $letter_info['ycord']."px;' src='images/map/school.gif'>";

					echo "</a>";
				}
			?>

		</div>
		<div id="nomove" style="visibility: visible;">

			<?php

				while($letter_info2 = mysql_fetch_array($letterData2)){

					$tmp = $letter_info2['xcord'];
					$xcord = $tmp - 410;

					$tmp2 = $letter_info2['ycord'];
					$ycord = $tmp2 - 290;

					$tmp3 = $letter_info2['xcord'];
					$leftcord = intval(($tmp3 * 0.32))+5;

					$tmp4 = $letter_info2['ycord'];
					$topcord = intval(($tmp4 * 0.32))+1;


					//With Zoom Function
					//echo '<!-- '.$letter_info2["name"].' --> <a href="javascript:zoom();';
					//echo "zoomTo('-";
					//echo $xcord."px','-";
					//echo $ycord."px')";



					echo '<div onMouseOut="javascript:hideToolTip(\'';
					echo $letter_info2['letter'];
					echo '\')" onMouseOver="javascript:showToolTip(\'';
					echo $letter_info2['letter'];
					echo '\')" style="position:absolute;left:';
					echo $leftcord."px;top:";
					echo $topcord.'px;">';

					//Without Zoom
					echo '<!-- '.$letter_info2['name'].' --> <a target="_parent" href="';
					echo "/decode.php?p=".$letter_info2['letter'];
					echo '">';

					echo '<img border=0 src="images/map/school.gif"></a><br/>';
					echo '<div id="'.$letter_info2['letter'].'tip" style="z-index:65;position:relative;left:-50px;display:none;background-image:url(\'/images/bt.gif\');background-repeat:no-repeat;width:154px;height:160px;padding-top:24px;text-align:center;font-size:12px;">';

					//Without Zoom
					echo '<!-- '.$letter_info2['name'].' --> <a target="_parent" href="';
					echo '/decode.php?p='.$letter_info2['letter'].'">';

					echo $letter_info2["name"];
					echo '<br /><img border=0 src="/images/aidletters/'.$letter_info2['letter'].'sm.jpg"></a></div>';
					echo '</div>';


					echo '<SCRIPT language="JavaScript">';
					echo '<!--';
					echo 'if (document.images)';
					echo '{';
					echo '  preload_image = new Image(25,25);';
					echo '  preload_image.src="';
					echo '/images/aidletters/'.$letter_info2['letter'].'sm.jpg";';
					echo '}';
					echo '//-->';
					echo '</SCRIPT>';

				}

			?>

		</div>

	</div>
</div><!-- End of Position Div -->




  <script type="text/javascript">





var MoverBehaviour = {
    mo: null, // reference to the movable obj,
    x: 0, y: 0,

    // ----- Events -----
    onmousedown: function (evt) {
      evt = evt || window.event;
      var src = jcl.FindBehaviourElement(evt.srcElement, MoverBehaviour);
      src.MoveStart(evt);
    }, // onmousedown


    // track mouse moves. This handler will be attached to the document level !
    _onmousemove: function (evt) {
      evt = evt || window.event;
      MoverBehaviour.MoveIt(evt);
    }, // onmousemove


    // track mouse button up. This handler will be attached to the document level !
    _onmouseup: function (evt) {
      evt = evt || window.event;
      MoverBehaviour.MoveEnd(evt);
    }, // onmouseup


    // ----- Methods -----
    MoveStart: function (evt) {
      // find the moving part (position:absolute or class="VEPart")
      var mo = this;
      while ((mo != null) && (mo.className != "VEPart"))
        mo = mo.parentNode;

      if (mo == null)
        return; // don't move
      MoverBehaviour.mo = mo;

      // calculate mousepointer-object distance
      mo.x = mo.y = 0;
      obj = mo;
      while (obj != null) {
        mo.x += obj.offsetLeft;
        mo.y += obj.offsetTop;
        obj = obj.offsetParent;
      } // while
      mo.x = evt.clientX - mo.x;
      mo.y = evt.clientY - mo.y;

      // make the moving object globally evailable when mouse is leaving this object.
      jcl.AttachEvent(document, "onmousemove", this._onmousemove);
      jcl.AttachEvent(document, "onmouseup", this._onmouseup);
    }, // MoveStart


    MoveIt: function (evt) {
      var mo = MoverBehaviour.mo;
	  var xmov = (document.getElementById('position').style.left.substring(0, document.getElementById('position').style.left.lastIndexOf('px')));
	  var ymov = (document.getElementById('position').style.top.substring(0, document.getElementById('position').style.top.lastIndexOf('px')));
      if (mo != null) {
        var p = (evt.clientX - mo.x)-xmov + "px";
        if (p != mo.style.left) mo.style.left = p;
        p = (evt.clientY - mo.y)-ymov + "px";
        if (p != mo.style.top) mo.style.top = p;
      } // if
      // cancel selecting anything
      evt.cancelBubble = true;
      evt.returnValue = false;
    }, // MoveIt


    MoveEnd: function () {
      var mo = MoverBehaviour.mo;
      if (mo != null) {
        MoverBehaviour.mo = null;
        jcl.DetachEvent(document, "onmousemove", this._onmousemove);
        jcl.DetachEvent(document, "onmouseup", this._onmouseup);
      } // if
    } // MoveEnd

} // MoverBehaviour

  jcl.LoadBehaviour("moveme", MoverBehaviour);
  </script>