index.html

<html> 
<head> 
	<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1"> 
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
	<title> Simstadt Region Chooser </title>
	<meta name="keywords" content="polygon,creator,google map,v3,draw,paint">
	<meta name="description" content="Google Map V3 Polygon Creator for Simstadt">
	
	<link rel="stylesheet" type="text/css" href="style/style.css">
	
<script type="text/javascript" src="script/proj4.js"></script>
<script type="text/javascript" src="script/jquery-1.4.2.min.js"></script>
<!-- <link rel="stylesheet" href="http://openlayers.org/en/v3.4.0/css/ol.css" type="text/css">
<script src="http://openlayers.org/en/v3.4.0/build/ol.js" type="text/javascript"></script>
 -->
<link rel="stylesheet" href="style/ol.css" type="text/css">
<!-- <script src="ol-debug.js" type="text/javascript"></script> -->
<script src="script/ol.js" type="text/javascript"></script>
<script src="script/turf.js" type="text/javascript"></script>
	
</head>
<body>

	<div id="header">
		<ul>
			<li class="title">
				Simstadt Region Chooser
			</li>
		</ul>
	   <p>
		<span class="instruction">Demo Instruction:</span>
		Left click on the map to create markers, when last marker meets first marker, it will form a polygon.
		</p>
	</div>
        <div id="map" class="map" tabindex="0"></div>
	<div id="side">
		<input id="reset" value="Reset" type="button" class="navi" disabled/>
		<input id="send" value="Send" type="button" class="navi" disabled/>
		<div   id="dataPanel">
		</div>
	</div>
        <script src="script/simstadt_openlayers.js" type="text/javascript"></script>
</body>
</html>