<title>MapServer Demo Interface (dBox)</title>


<script language="JavaScript" src="/box/itasca/javascript/dbox.js"></script>


<script language="JavaScript" src="/box/itasca/javascript/cross-browser.com/x/x_core.js"></script>
<script language="JavaScript" src="/box/itasca/javascript/cross-browser.com/x/x_event.js"></script>
<script language="JavaScript" src="/box/itasca/javascript/cross-browser.com/x/x_dom.js"></script>
<script language="JavaScript" src="/box/itasca/javascript/cross-browser.com/x/x_drag.js"></script>

<SCRIPT LANGUAGE="JavaScript">

// Step 3: Create the dBox object (initialize a few things)
var main = new dBox("main_image");
main.box = [box];

function setbox_handler(name, minx, miny, maxx, maxy) {
   document.mapserv.imgbox.value = minx + " " + miny + " " + maxx + " " + maxy;
   document.mapserv.imgxy.value = minx + " " + miny;
   document.mapserv.submit();
}

function seterror_handler(message) {
   alert(message);
}

function reset_handler(name, minx, miny, maxx, maxy) { }

function startup() {
   // Step 4: Initialize the dBox object
   main.initialize();
}
</SCRIPT>

</head>
<body bgcolor=#FFFFFF onload=startup()>

<center><h1>MapServer Demo Interface</h1></center>
<hr>
<form name="mapserv" method=GET action="[program]">
<center>
<table border=0 cellspacing=0 cellpadding=4 bgcolor="#000000">
<tr>
<td valign="top" align=center>
   <table cellpadding="0" cellspacing="0" border="0">
      <tr>
         <td colspan="2">
               
               <img id="main_image" src="[img]">
            </td>
         </tr>
      <tr>
         <td> <font size=-1 face="arial,helvetica" color="#FFFFFF"><b>Powered by MapServer</b></font></td>
         <td align="right"><img src="[scalebar]"></td>
      </tr>
   </table>
</td>
<td valign="top" bgcolor=#ffffff>
   <table cellpadding="5" cellspacing="0" border="0" bgcolor="#ffffff">
      <tr><td>
         <center><input type="submit" value="Refresh/Query"></center>
         <p>

         
         <input type="radio" name="mode" value="browse" checked>
            Browse map><br>

         <input type="radio" name="mode" value="query"
            onClick="main.boxoff();
            document.mapserv.box.value='false';
            document.mapserv.drag.value='false';">
         Query feature<br>

         <input type="radio" name="mode" value="nquery"
            onClick="main.boxon();
            document.mapserv.box.value='true';
            document.mapserv.drag.value='false';">
         Query multiple features

      <hr>

      <p>
      <b>Select Layers to Display: </b><br>
      <select multiple name="layer" size=3>
         <option value="airports" [airports_select]> Airports
         <option value="cities" [cities_select]> Cities
         <option value="lakespy2" [lakespy2_select]> Lakes & Rivers
         <option value="dlgstln2" [dlgstln2_select]> Streams
         <option value="roads" [roads_select]> Roads
         <option value="twprgpy3" [twprgpy3_select]> Townships
      </select>
      <p>

      
      <input type=radio name=zoomdir value=1 [zoomdir_1_check]
         onClick="main.boxon();
         document.mapserv.box.value='true';
         document.mapserv.drag.value='false';
         document.mapserv.mode[0].checked='true';">
      Zoom In<BR>

      <input type=radio name=zoomdir value=0 [zoomdir_0_check]
         onClick="main.boxoff();
         document.mapserv.drag.value='false';
         document.mapserv.box.value='false';
         document.mapserv.mode[0].checked='true';">
      Pan<BR>

      <input type=radio name=zoomdir value=-1 [zoomdir_-1_check]
         onClick="main.boxoff();
         document.mapserv.box.value='false';
         document.mapserv.drag.value='false';
         document.mapserv.mode[0].checked='true';">
      Zoom Out

      <p>
      Zoom Size <input type=text name=zoomsize size=4 value=[zoomsize]>
      <p>

      <font size=+1><b>Legend</b></font><br><hr>
      <img src="[legend]"><hr>

      <p>
      <center><INPUT NAME="ref" TYPE="image" SRC="[ref]" border="0"></center>
      </td></tr></table>

      </td></tr>
</table>
</center>

box = <input type="text" name="box" value=[box]>
drag = <input type="text" name="drag" value=[drag]>

<input type="hidden" name="imgxy" value="299.5 299.5">
<input type="hidden" name="imgext" value="[mapext]">
<input type="hidden" name="map" value="[map]">
<input type="hidden" name="savequery" value="true">
<input type="hidden" name="program" value="[program]">
<input type="hidden" name="map_web_imagepath" value="[map_web_imagepath]">
<input type="hidden" name="map_web_imageurl" value="[map_web_imageurl]">
<input type="hidden" name="imgbox" value="-1 -1 -1 -1">

</form>
<p><hr><p>

</body>
</html>