Open Layers - Measure

HTML

<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
<!DOCTYPE html>
<html>
  <head>
    <title>Tiled WMS</title>
  </head>
  <body>
    <div id="map" class="map"></div>
  </body>
</html>

CSS

#map {
    width:100%;
    height:500px;
}
div.olControlScaleLine {
    background: white;
    opacity:.8;
    padding: 5px;
    left: 5px;
    bottom: 33px;
}
.distanceToolClass {
    background: white;
    opacity:.8;
    padding: 5px;
    left: 5px;
    bottom: 100px;
    font-family:Arial;
    font-size:12px;
    position: relative;
    float: none;
    z-index: 1010;
}

JavaScript

var mapOptions = {
    div: "map"
};

map = new OpenLayers.Map('map', mapOptions);
map.addLayer(new OpenLayers.Layer.OSM());
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.setCenter(new OpenLayers.LonLat(0, 0), 2);

// scalebar
var scaleline = new OpenLayers.Control.ScaleLine();
map.addControl(scaleline);

// overlay a Distance panel
var DISTANCE_TOOL_NAME = "Distance Tool: ";
var parentDiv = document.getElementById("map");
var distanceTool = document.createElement("span");
distanceTool.id = "distanceTool";
distanceTool.className = "distanceToolClass";
parentDiv.appendChild(distanceTool);
var distanceToolName = document.createElement("span");
distanceToolName.id = "distanceToolName";
distanceTool.appendChild(distanceToolName);
distanceToolName.innerHTML = DISTANCE_TOOL_NAME;
var distanceToolValue = document.createElement("span");
distanceToolValue.id = "distanceToolValue";
distanceTool.appendChild(distanceToolValue);
distanceToolValue.innerHTML = "Off";
$("#distanceToolName").click(function () {
    measureButtonClicked();
});

measureControl = new OpenLayers.Control.Measure(
OpenLayers.Handler.Path, {
    immediate: true,
    persist: true
});

measureControl.getCustomLength = function (evt, onlySum) {
    var idx = evt.geometry.components.length;

    if (idx < 2) return '';

    var geom = new OpenLayers.Geometry.LineString([
    evt.geometry.components[idx - 2],
    evt.geometry.components[idx - 1]]);

    var lastLengthArr = this.getBestLength(geom);

    var str = '';

    if (idx > 2 || onlySum) str += 'Total: ' + (evt.units === 'km' ? evt.measure.toFixed(3) : evt.measure.toFixed(1)) + ' ' + evt.units + '&nbsp;&nbsp;&nbsp;';

    if (!onlySum) str += 'Last segment: ' + (lastLengthArr[1] === 'km' ? lastLengthArr[0].toFixed(3) : lastLengthArr[0].toFixed(1)) + ' ' + lastLengthArr[1];

    return str;
}

map.addControl(measureControl);

// Update content in distanceToolValue span   
measureControl.events.on({
    'measure': function (evt) {
      ...