Added control box to show/hide markers/spawns

This commit is contained in:
fescen9 2010-12-06 02:36:53 +00:00
parent e61997183c
commit b05fde203e
3 changed files with 130 additions and 49 deletions

View File

@ -1,25 +1,32 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="Minecraft Dynamic Map" />
<meta name="keywords" content="minecraft, map, dynamic" />
<meta name="language" content="en"/>
<title>
<meta name="language" content="en"/>
<title>
Minecraft Dynamic Map
</title>
<link rel="shortcut icon" href="follow_off.png" type="image/png" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="map.js" ></script>
</head>
<!-- <body onload="initialize()"> -->
<body>
<div id="mcmap"></div>
<div id="plist"><img id="plistbtn" alt="on" src="list_on.png" onclick="plistopen()" />
<div id="lst">[Connecting]</div>
</div>
<div id="link"></div>
</body>
</html>
</title>
<link rel="shortcut icon" href="follow_off.png" type="image/png" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="map.js" ></script>
</head>
<body>
<div id="mcmap"></div>
<div id="plist"><img id="plistbtn" alt="on" src="list_on.png" onclick="plistopen()" title="Player list" />
<div id="lst">[Connecting]</div>
</div>
<div id="controls">
<form action="#" method="get">
<img src="watch.png" alt="warps" title="Warps" />
<input type="checkbox" checked="checked" id="showWarps" /><br />
<img src="sign.png" alt="marker" title="Markers" />
<input type="checkbox" checked="checked" id="showMarkers" />
</form>
</div>
<div id="link"></div>
</body>
</html>

View File

@ -553,6 +553,8 @@ function makeRequest(url, func, type, fail, post, contenttype)
makeRequest(config.updateUrl + lasttimestamp, function(res) {
var rows = res.split('\n');
var loggedin = new Array();
var showWarps = document.getElementById('showWarps').checked;
var showMarkers = document.getElementById('showMarkers').checked;
lasttimestamp = rows[0];
delete rows[0];
@ -592,33 +594,75 @@ function makeRequest(url, func, type, fail, post, contenttype)
markers[p[0]] = marker;
}
} else if(p.length == 6) {
if(p[0] in markers) {
var m = markers[p[0]];
var converted = fromWorldToLatLng(p[3], p[4], p[5]);
m.setPosition(converted);
} else {
var image = 'sign.png';
if (p[1] == 'warp')
image = 'watch.png';
else if (p[1] == 'home')
image = 'list_on.png';
else if (p[1] == 'spawn')
image = 'list_on.png';
var converted = fromWorldToLatLng(p[3], p[4], p[5]);
var marker = new MarkerWithLabel({
position: converted,
map: map,
labelContent: p[0],
labelAnchor: new google.maps.Point(-14, 10),
labelClass: "labels",
clickable: false,
flat: true,
icon: new google.maps.MarkerImage(image, new google.maps.Size(28, 28), new google.maps.Point(0, 0), new google.maps.Point(14, 14))
});
if (p[1] == 'warp')
{
if(p[0] in markers) {
var m = markers[p[0]];
if (showWarps == false) {
m.setMap(null);
continue;
}
else if (m.map == null) {
m.setMap(map);
}
var converted = fromWorldToLatLng(p[3], p[4], p[5]);
m.setPosition(converted);
} else {
if (showWarps == false) {
continue;
}
markers[p[0]] = marker;
var converted = fromWorldToLatLng(p[3], p[4], p[5]);
var marker = new MarkerWithLabel({
position: converted,
map: map,
labelContent: p[0],
labelAnchor: new google.maps.Point(-14, 10),
labelClass: "labels",
clickable: false,
flat: true,
icon: new google.maps.MarkerImage('watch.png', new google.maps.Size(28, 28), new google.maps.Point(0, 0), new google.maps.Point(14, 14))
});
markers[p[0]] = marker;
}
}
else if (p[1] == 'marker')
{
if(p[0] in markers) {
var m = markers[p[0]];
if (showMarkers == false) {
m.setMap(null);
continue;
}
else if (m.map == null) {
m.setMap(map);
}
var converted = fromWorldToLatLng(p[3], p[4], p[5]);
m.setPosition(converted);
} else {
if (showMarkers == false) {
continue;
}
var converted = fromWorldToLatLng(p[3], p[4], p[5]);
var marker = new MarkerWithLabel({
position: converted,
map: map,
labelContent: p[0],
labelAnchor: new google.maps.Point(-14, 10),
labelClass: "labels",
clickable: false,
flat: true,
icon: new google.maps.MarkerImage('sign.png', new google.maps.Size(28, 28), new google.maps.Point(0, 0), new google.maps.Point(14, 14))
});
markers[p[0]] = marker;
}
}
} else if(p.length == 1) {
lastSeen[p[0]] = lasttimestamp;
@ -721,3 +765,16 @@ function makeRequest(url, func, type, fail, post, contenttype)
map.setCenter(markers[name].getPosition());
}
}
//remove item (string or number) from an array
function removeItem(originalArray, itemToRemove) {
var j = 0;
while (j < originalArray.length) {
// alert(originalArray[j]);
if (originalArray[j] == itemToRemove) {
originalArray.splice(j, 1);
} else { j++; }
}
// assert('hi');
return originalArray;
}

View File

@ -30,6 +30,22 @@ body { height: 100%; margin: 0px; padding: 0px ; background-color: #000; }
font-size: 8pt;
color: #ddd;
}
#controls {
position: absolute;
top: 4px;
left: 30px;
border: 1px solid #808080;
background: #000;
opacity: 0.6;
padding: 2px;
font-size: 8pt;
color: #ddd;
text-align:right;
}
#controls img{
height:14px;
width:14px;
}
a, a:visited {
color: white;
text-decoration: none;
@ -39,4 +55,5 @@ a, a:visited {
font-family: sans-serif;
white-space: nowrap;
color: white;
}
display:none;
}