// 5/12/2009    Tien    add RecordID to output
// 10/20/2009   Tien    don't show product systems icon for UK
// 5/21/10      Tien    add Germany
// 7/21/10      Tien    translation to German
// 8/3/10       Tien    add UltraCalming
// 9/22/10      Tien    fix bug showing icons for DRM
// 11/29/10     Tien    THIS VERSION ON business.dermalogica.com (web1) IS FOR Germany
//                      the VEGlobal.urlWS variable should NOT be /proxy/...
// 1/12/11      Tien    add Age Reversal Eye Complex icon
// 5/10/11      Tien    add Derm expert status
// 9/2/11       Tien    add Canada ORS icon
    var VEGlobal = {};
    VEGlobal.map = null;
    VEGlobal.address = '';
    VEGlobal.city = '';
    VEGlobal.state = '';
    VEGlobal.zip = '';
    VEGlobal.country= '';
    VEGlobal.dermCircle = '';
    // 2/25/09
    VEGlobal.cleanStart = 'DRM';
    VEGlobal.searchRadius = '15';
    VEGlobal.maxAccounts = '25';
    //VEGlobal.urlWS = 'http://business.dermalogica.com/WSDRMLocator/locator.asmx';
    VEGlobal.urlWS = '/proxy/http/business.dermalogica.com/WSDRMLocator/locator.asmx';

    VEGlobal.aryLines;

    function buildQueryXml(pageNo) {
    // 2/25/09
        var query = '<DRMLocator><Parameters><Address>' +
        VEGlobal.address + '</Address><City>' +
        VEGlobal.city + '</City><State>' +
        VEGlobal.state + '</State><Zip>' +
        VEGlobal.zip + '</Zip><Country>' +
        VEGlobal.country + '</Country><DermCircle>' +
        VEGlobal.dermCircle + '</DermCircle><PageNo>' +
        pageNo + '</PageNo><PageLength>10</PageLength><CleanStart>' +
        VEGlobal.cleanStart + '</CleanStart><SearchRadius>' +
        VEGlobal.searchRadius + '</SearchRadius><MaxAccounts>' +
        VEGlobal.maxAccounts + '</MaxAccounts>' +
        '</Parameters></DRMLocator>';
        return query;
    }
    function clearResultTable() {
       // clear all rows first
       var tblBRes = document.getElementById('tblBodyResult');
       while (tblBRes.rows.length > 0) {
            tblBRes.deleteRow(0);
       }
    }
    function clearDirectionsTable() {
       // clear all rows first
       var tblB = document.getElementById('tblBodyDir');
       while (tblB.rows.length > 0) {
            tblB.deleteRow(0);
       }
    }
   
    function populateResult(r){
    // 10/6/09  Tien    add movember icon
    // 1/12/11  Tien    add AREC
    // 4/8/11   Tien    add Partnership school
    // 5/10/11  Tien    add Derm expert status
   // the result returned by the web service is a string, a "end record" is represented by \n\n
   // a field is delimited by |
   // layout of a record (representing a skin care center)
   // center_no|center_name|center_address|center_city|center_state|center_zip|center_phone|
   // center_distance|imgDC|imgIcons|imgMBC|imgSkinBar|imgSheerTint|imgAgeSmart|imgPC|imgVIP|imgSolar|
   // imgShave|imgChromaWhite|latitude|longitude|CleanStart|RecordID|imgMovember|imgUltraCalming|imgAREC|
   // imgPS|imgDermExpert|imgORS
        var distUnit = ' mi';
        if (VEGlobal.country == 'Australia' || VEGlobal.country == 'United Kingdom' ||
            VEGlobal.country == 'Germany') distUnit = ' km';
        clearResultTable();
        if (r == null) {
            document.getElementById('tblResult').style.display = 'inline';
            document.getElementById('tblLoading').style.display = 'none';
            return;
        }
       var regX = /{~}/g; // escaped the | in the data, restore it here
       var res = r.replace(regX, '|');
       VEGlobal.aryLines = res.split('\n\n');
       var tblBRes = document.getElementById('tblBodyResult');
       for (var l = 0; l < VEGlobal.aryLines.length; l++) {
           var aryFld = VEGlobal.aryLines[l].split('|');
           if (aryFld.length < 2) break;
           // row center number and name, address
           var tr = document.createElement('tr');
           tblBRes.appendChild(tr);
           // cell center number
           var td = document.createElement('td');
           tr.appendChild(td);
           td.vAlign = 'top';
           td.innerHTML = '<div style="background-image:url(images/results.gif); ' +
                        'color:white; font-family:Arial; ' +
                        'width:20px; height:17px; font-size:12px;font-weight: normal; ' +
                        'text-decoration: none; padding-top:3px; ' +
                        'vertical-align: middle; text-align: center;">' +
                        '<a href="" style="text-decoration:none; color:White" ' +
                        'onclick="return centerAndZoomOnStore(' + aryFld[19] + ',' + aryFld[20] + ');" ' +
                        'title="Click to center and zoom to this center">' +
                        aryFld[0] + '</a></div>';
                                
            // cell center name
           td = document.createElement('td');
           tr.appendChild(td);
           td.vAlign = 'top';
           td.innerHTML = '<a href="" style="text-decoration:none;" ' +
                        'onclick="return centerAndZoomOnStore(' + aryFld[19] + ',' + aryFld[20] + ');" ' +
                        'title="Click to center and zoom to this center">' +
                        '<span class="style25">' + aryFld[1] + '</span></a><br/><span class="style29">' +
            aryFld[2] + '<br/>' + 
            aryFld[3] + ', ' + aryFld[4] + ' ' + aryFld[5] + '<br/>' +
            aryFld[6] + '</span>';
            // cell icons
           td = document.createElement('td');
           tr.appendChild(td);
           td.vAlign = 'top';
           td.style.width = '130px';
           var img;
           if (VEGlobal.cleanStart == 'CS') {
           // clearn start site
               if (aryFld[21] == 'ALL') {
               // Derm + CS
                    img = document.createElement('img');
                    img.src = 'images/skinhealthexpert.gif';
                    img.title = 'Skin Health Expert';
                    img.border = '0';
                    td.appendChild(img);
               }
           }
           else { // Dermalogica site
               if (aryFld[8].length > 0) {
                    img = document.createElement('img');
                    img.src = aryFld[8];
                    img.title = 'Dermalogica Circle centers are recognized for their high level of commitment to Dermalogica';
                    img.border = '0';
                    td.appendChild(img);
               }
           }
           if (VEGlobal.cleanStart == 'CS' &&
                (aryFld[21] == "CS" || aryFld[21] == "ALL")) {
           // CS or ALL
                img = document.createElement('img');
                img.src = 'images/cleanstart.gif';
                img.title = 'CleanStart available here!';
                img.border = '0';
                td.appendChild(img);
           }
           if (aryFld[14].length > 0) {
                img = document.createElement('img');
                img.src = aryFld[14];
                img.title = 'Platinum Circle';
                img.border = '0';
                td.appendChild(img);
           }
           if (aryFld[15].length > 0) {
                img = document.createElement('img');
                img.src = aryFld[15];
                img.title = 'VIP';
                img.border = '0';
                td.appendChild(img);
           }
           // on Derm site, show all product, not on CS site
           if ((VEGlobal.cleanStart != 'CS' ||
                VEGlobal.cleanStart == 'DRM' || VEGlobal.cleanStart == 'ALL') &&
                (aryFld[10].length > 0 || aryFld[11].length > 0 ||
                aryFld[12].length > 0 ||
                aryFld[13].length > 0 || aryFld[16].length > 0 ||
                aryFld[17].length > 0 || aryFld[18].length > 0 ||
//                (aryFld[21].length > 0 && (aryFld[21] == "CS" || aryFld[21] == "ALL")))) {
                (aryFld[21].length > 0 && (aryFld[21] == "CS" || aryFld[21] == "ALL" || aryFld[21] == "DRM")))) {
                // don't show this icon for UK
                if (VEGlobal.country != 'United Kingdom') {
                    img = document.createElement('img');
                    img.src = 'images/productsystems.gif';
                    img.title = '';
                    img.border = '0';
                    td.appendChild(img);
                }
               if (aryFld[21] == "CS" || aryFld[21] == "ALL") {
               // CS or ALL
                    img = document.createElement('img');
                    img.src = 'images/cleanstart.gif';
                    img.title = 'CleanStart available here!';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[18].length > 0) {
               // ChromaWhite Trx
                    img = document.createElement('img');
                    img.src = aryFld[18];
                    img.title = 'ChromaWhite Treatment available here!';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[10].length > 0) {
                    img = document.createElement('img');
                    img.src = aryFld[10];
                    img.title = 'Medibac';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[11].length > 0) {
                    img = document.createElement('img');
                    img.src = aryFld[11];
                    img.title = 'Skin Bar available here!';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[13].length > 0) {
                    img = document.createElement('img');
                    img.src = aryFld[13];
                    img.title = 'AGE Smart available here!';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[16].length > 0) {
                    img = document.createElement('img');
                    img.src = aryFld[16];
                    img.title = 'Solar';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[17].length > 0) {
                    img = document.createElement('img');
                    img.src = aryFld[17];
                    //img.title = 'MultiVitamin Thermafoliant';
                    img.title = 'Shave';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[23].length > 0) {
               // movember
                    img = document.createElement('img');
                    img.src = aryFld[23];
                    img.title = 'Movember available here!';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[24].length > 0) {
               // Ultracalming
                    img = document.createElement('img');
                    img.src = aryFld[24];
                    img.title = 'UltraCalming available here!';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[25].length > 0) {
               // AREC
                    img = document.createElement('img');
                    img.src = aryFld[25];
                    img.title = 'Age Reversal Eye Complex available here!';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[26].length > 0) {
               // Partnership school
                    img = document.createElement('img');
                    img.src = aryFld[26];
                    img.title = 'Partnership school';
                    img.border = '0';
                    td.appendChild(img);
               }
               if (aryFld[27].length > 0) {
               // Dermalogica expert status
                    img = document.createElement('img');
                    img.src = aryFld[27];
                    if (aryFld[27].indexOf('specialist') > -1)
                        img.title = 'Dermalogica Specialists on staff';
                    if (aryFld[27].indexOf('expert') > -1)
                        img.title = 'Dermalogica Experts on staff';
                    img.border = '0';
                    td.appendChild(img);
               }
                if (aryFld[28].length > 0) {
                    // ORS
                    img = document.createElement('img');
                    img.src = aryFld[28];
                    img.title = 'ORS';
                    img.border = '0';
                    td.appendChild(img);
                }
                if (aryFld[12].length > 0) {
                    for (var idx = 0; idx < aryFld[12].length; idx++) {
                        switch (aryFld[12].substr(idx, 1)) {
                            case 'A':
                                img = document.createElement('img');
                                img.src = 'images/' + aryFld[12].substr(idx,1) + '.gif';
                                img.title = 'Power Rich';
                                img.border = '0';
                                td.appendChild(img);
                                break;
                            case 'B':
                                img = document.createElement('img');
                                img.src = 'images/' + aryFld[12].substr(idx,1) + '.gif';
                                img.title = 'Daily Resurfacer';
                                img.border = '0';
                                td.appendChild(img);
                                break;
                            case 'C':
                                img = document.createElement('img');
                                img.src = 'images/' + aryFld[12].substr(idx,1) + '.gif';
                                img.title = 'Face Mapping available here!';
                                img.border = '0';
                                td.appendChild(img);
                                break;
                            default:
                            break;
                        }
                    }
               }
           }

           // row directions
           tr = document.createElement('tr');
           tblBRes.appendChild(tr);
           td = document.createElement('td');
           tr.appendChild(td);
           td = document.createElement('td');
           tr.appendChild(td);
           td.colSpan = 2;
           // table to format distance and direction
           var tblDir = document.createElement('table');
           td.appendChild(tblDir);
           var tblBod2 = document.createElement('tbody');
           tblDir.appendChild(tblBod2);
           tblDir.width = '100%';
           var tr2 = document.createElement('tr');
           tblBod2.appendChild(tr2);
           var td2 = document.createElement('td');
           tr2.appendChild(td2);
           td2.className = 'style11';
           td2.innerHTML = "";
           // directions
           if (((VEGlobal.country == 'United States' || VEGlobal.country == 'Australia') &&
                VEGlobal.address.length > 0 && VEGlobal.city.length > 0 && VEGlobal.state.length > 0) ||
                (VEGlobal.country == 'Germany' &&
                VEGlobal.address.length > 0 && VEGlobal.city.length > 0))
           {
                var z2 = '';
                if (aryFld[5].length != 0) z2 = ' ' + aryFld[5];
                var name = aryFld[1].replace(/\'/g,'\\\'');
                var a = '<a href="" onclick="return getDirections(\'' +
                   aryFld[2].replace(/\'/g,'\\\'') + ',' +
                   aryFld[3].replace(/\'/g,'\\\'') + ',' + aryFld[4].replace(/\'/g,'\\\'') + 
                   z2 + '\',\'' +
                   name + '\')">';
                if (VEGlobal.country == 'Germany') {
                    td2.innerHTML = a + 'Wegbeschreibung' + '</a>';
                }
                else {
                    td2.innerHTML = a + 'Get directions' + '</a>';
                }
           }
           // distance
           td2 = document.createElement('td');
           tr2.appendChild(td2);
           td2.className = 'style11';
           td2.align = 'right';
           if (VEGlobal.country == 'Germany') {
                td2.innerHTML = 'Entfernung: ' + parseFloat(aryFld[7]).toFixed(1) + distUnit;
           }
           else {
                td2.innerHTML = 'Distance: ' + parseFloat(aryFld[7]).toFixed(1) + distUnit;
           }
            // separator row
           tr = document.createElement('tr');
           tblBRes.appendChild(tr);
           td = document.createElement('td');
           tr.appendChild(td);
           td = document.createElement('td');
           tr.appendChild(td);
           td.colSpan = 2;
           td.className = 'style13';
           td.innerHTML = '.................................................................................';
        }
        // paging
        if (VEGlobal.country.toLowerCase() == 'united states' &&
            VEGlobal.cleanStart == 'CS') {
            if (VEGlobal.aryLines[VEGlobal.aryLines.length - 2].indexOf('PageNo=') > -1) {
                var pgNo = VEGlobal.aryLines[VEGlobal.aryLines.length - 2].substr(7);
            }
            if (VEGlobal.aryLines[VEGlobal.aryLines.length - 1].indexOf('PageCount=') > -1) {
                var pgCnt = VEGlobal.aryLines[VEGlobal.aryLines.length - 1].substr(10);
            }
            document.getElementById('tblResult').style.display = 'inline';
            document.getElementById('tblLoading').style.display = 'none';
            var sLnk = '';
            var sep = '';
            for (var idx = 1; idx <= pgCnt; idx++) {
                if (idx == pgNo) {
                    sLnk += sep + '<b>' + idx + '</b>';
                }
                else {
                    sLnk += sep + '<a href="" onclick=\'return getPage(' + idx + ');\'>' +
                            idx + '</a>';
                }
                sep = '&nbsp;|&nbsp;';
            }
            document.getElementById('divPages').innerHTML = sLnk;
        }
        else {
            if (VEGlobal.aryLines[VEGlobal.aryLines.length - 1].indexOf('PageCount=') > -1) {
                var pgCnt = VEGlobal.aryLines[VEGlobal.aryLines.length - 1].substr(10);
                var spnPg;
                document.getElementById('spnPage1').style.display = 'none';
                document.getElementById('spnPage2').style.display = 'none';
                document.getElementById('spnPage3').style.display = 'none';
                if (pgCnt == 0) {
                    // separator row
                   tr = document.createElement('tr');
                   tblBRes.appendChild(tr);
                   td = document.createElement('td');
                   tr.appendChild(td);
                   td.colSpan = 3;
                   td.className = 'style11';
                    if (VEGlobal.country == 'Germany') {
                        td.innerHTML = 'Kein Institut gefunden';
                    }
                    else {
                       td.innerHTML = 'No centers found';
                    }
                }
                if (pgCnt > 0) {
                    spnPg = document.getElementById('spnPage1');
                    if (spnPg) spnPg.style.display = 'inline';
                }
                if (pgCnt > 1) {
                    spnPg = document.getElementById('spnPage2');
                    if (spnPg) spnPg.style.display = 'inline';
                }
                if (pgCnt > 2) {
                    spnPg = document.getElementById('spnPage3');
                    if (spnPg) spnPg.style.display = 'inline';
                }
            }
        }        
        document.getElementById('tblResult').style.display = 'inline';
        document.getElementById('tblLoading').style.display = 'none';

        VEGlobal.map.Find(null, VEGlobal.address + 
            (VEGlobal.city.length == 0?'': ',' + VEGlobal.city) + 
            (VEGlobal.state.length == 0?'': ',' + VEGlobal.state) + 
            (VEGlobal.zip.length == 0?'': ' ' + VEGlobal.zip) + 
            ',' + VEGlobal.country, null,
            null, 0, 20, true, true, true, true, onMoreResults);
    }
   function onMoreResults(a,b,c,d,e) {
       // show your location icon
        var shape = new VEShape(VEShapeType.Pushpin, VEGlobal.map.GetCenter());
        var icon = '<div style=\"background-color:transparent;width:24px;height:24px;\" >' +
                '<img src=\"images/resultsHome2.gif\" border=\"0\" alt=\"\"/></div>';
        shape.SetCustomIcon(icon);
        if (VEGlobal.country == 'Germany') {
            shape.SetTitle('Ihr Standort');
        }
        else {
            shape.SetTitle('Your location');
        }
        shape.SetDescription(VEGlobal.address + '\n' +
            VEGlobal.city + ', ' + VEGlobal.state + ' ' + VEGlobal.zip + ' ' + VEGlobal.country);
        VEGlobal.map.AddShape(shape);
        // show centers icons
        for (var l = 0; l < VEGlobal.aryLines.length; l++) {
           var aryFld = VEGlobal.aryLines[l].split('|');
           if (aryFld.length < 2) break;
            //Add pushpins to the VE map based on the results from MWS
            icon = '<div><img src=\"images/1-25/' + aryFld[0] +
            '.gif\" alt=\"\" border=\"0\" width=\"24\" heigth=\"24\"/></div>';;
            var latLong = new VELatLong(aryFld[19], aryFld[20],0,VEAltitudeMode.Default);
            shape = new VEShape(VEShapeType.Pushpin, latLong);
            shape.SetCustomIcon(icon);
            shape.SetTitle('<span class=\"style25\">[' + aryFld[0] + '] ' +
                     aryFld[1] + '</span>');
            // address
            // city, state zip
            shape.SetDescription(aryFld[2] + '<br/>' +
            aryFld[3] + ', ' +  aryFld[4] + ' ' +  aryFld[5]);
            
            VEGlobal.map.AddShape(shape);
        }        
        // zoom to a level close enough
        //VEGlobal.map.SetZoomLevel(10);
        var latlng = new VELatLong(VEGlobal.map.GetCenter().Latitude, VEGlobal.map.GetCenter().Longitude,
                    0,VEAltitudeMode.Default);
        VEGlobal.map.SetCenterAndZoom(latlng, 10);
    }
    function centerAndZoomOnStore(lat, lng)
    {
        var LatLng = new VELatLong(lat, lng, 0,VEAltitudeMode.Default);
        VEGlobal.map.SetCenterAndZoom(LatLng, 16);
        return false;
    }
    function getPage(pageNo) {
        getCenters(buildQueryXml(pageNo));
        return false;
    }
    function getDirections(ToAddress, ToName) {
    // show directions
    // show loading icon
        document.getElementById('tblDirections').style.display = 'none';
        document.getElementById('tblResult').style.display = 'none';
        document.getElementById('tblLoading').style.display = 'inline';
        VEGlobal.map.DeleteAllShapes();
        var z1 = '';
        if (VEGlobal.zip.length != 0) z1 = ',' + VEGlobal.zip;
        var FromAddress = VEGlobal.address + 
                       (VEGlobal.city.length == 0?'':',' + VEGlobal.city) + 
                       (VEGlobal.state.length == 0?'': ',' + VEGlobal.state) +  z1;
        var locations = new Array(FromAddress,ToAddress.replace(/#/g,' ')); // # sign seems to cause problem with getDirections!
        var options = new VERouteOptions;

        options.DrawRoute      = true;
        options.SetBestMapView = true;
        // Call this function when map route is determined:
        options.RouteCallback  = showTurns;
        if (VEGlobal.country == 'United States')
        {
            // Show as miles
            options.DistanceUnit   = VERouteDistanceUnit.Mile;
        }
        else {
            options.DistanceUnit   = VERouteDistanceUnit.Kilometer;
        }
        // Show the disambiguation dialog
        options.ShowDisambiguation = true;

        clearDirectionsTable();

        var tb = document.getElementById('tblBodyDir');
        // destination
        var tr = document.createElement('tr');
        tb.appendChild(tr);
        var td = document.createElement('td');
        tr.appendChild(td);
        td.align = 'left';
        td.colSpan = '3';
        if (VEGlobal.country == 'Germany') {
            td.innerHTML = '<span class="style2">Richtung:</span> <span class="style1">' + 
                ToName + '<br/>' + ToAddress + '</span>';
        }
        else {
            td.innerHTML = '<span class="style2">Directions to:</span> <span class="style1">' + 
                ToName + '<br/>' + ToAddress + '</span>';
        }
        // separator
        tr = document.createElement('tr');
        tb.appendChild(tr);
        td = document.createElement('td');
        VEGlobal.map.GetDirections(locations, options);

        return false;
    }
    function showTurns(route)
    {
        var legs          = route.RouteLegs;
        var leg           = null;
        var turnNum       = 0;  // The turn #
        var distUnit = ' mi';
        if (VEGlobal.country == 'Australia' || VEGlobal.country == 'Germany') distUnit = ' km';

        var tb = document.getElementById('tblBodyDir');
        // table header
        var tr = document.createElement('tr');
        tb.appendChild(tr);
        tr.className = 'style2';
        var td = document.createElement('td');
        tr.appendChild(td);
        td.align = 'left';
        td.colSpan = '2';
        if (VEGlobal.country == 'Germany') {
            td.innerHTML = 'Directions';
        }
        else {
            td.innerHTML = 'Directions';
        }
        td = document.createElement('td');
        tr.appendChild(td);
        if (VEGlobal.country == 'Germany') {
            td.innerHTML = 'Entfernung';
        }
        else {
            td.innerHTML = 'Distance';
        }
        // separator
        tr = document.createElement('tr');
        tb.appendChild(tr);
        td = document.createElement('td');
        tr.appendChild(td);
        td.colSpan = '3';
        td.innerHTML = '<hr/>';

        // Get intermediate legs
        for(var i = 0; i < legs.length; i++)
        {
             leg = legs[i];  // Leg is a VERouteLeg object

              // Unroll each intermediate leg
              var turn        = null;  // The itinerary leg
              var legDistance = null;  // The distance for this leg
              
            for(var j = 0; j < leg.Itinerary.Items.length; j ++)
            {
                turnNum++;
                turn = leg.Itinerary.Items[j];  // turn is a VERouteItineraryItem object
                // detail rows
                tr = document.createElement('tr');
                tb.appendChild(tr);
                td = document.createElement('td');
                tr.appendChild(td);
                td.className = 'style2';
                td.style.width = '30px';
                td.align = 'left';

                if (turnNum == 1)
                { // start icon
                    td.innerHTML = '<img src="images/mp_start2.jpg" alt="" border="0"/>';
                }
                if (turnNum == leg.Itinerary.Items.length)
                { // end icon
                    td.innerHTML = '<img src="images/mp_end2.jpg" alt="" border="0"/>';
                }
                else
                    if (turnNum > 1)
                    { // turn icon
                          td.innerHTML = (turnNum - 1).toString() + ':';
                          //td.innerHTML = (i - 1).toString() + ':';
                    }
                
                td = document.createElement('td');
                tr.appendChild(td);
                td.align = 'left';
                td.className = 'style1';
                td.innerHTML = turn.Text;
                td = document.createElement('td');
                tr.appendChild(td);
                td.align = 'right';
                td.className = 'style1';
                td.innerHTML = (parseFloat(turn.Distance) > 0?turn.Distance.toFixed(1) + distUnit:'');
                // separator
                tr = document.createElement('tr');
                tb.appendChild(tr);
                td = document.createElement('td');
                tr.appendChild(td);
                td.colSpan = '3';
                td.innerHTML = '<hr/>';

              }
         }
        // total
        tr = document.createElement('tr');
        tb.appendChild(tr);
        td = document.createElement('td');
        tr.appendChild(td);
        td.colSpan = '2';
        td.align = 'left';
        td.className = 'style2';
        if (VEGlobal.country == 'Germany') {
            td.innerHTML = 'Geschätzte Entfernung:';
        }
        else {
            td.innerHTML = 'Total Est. Distance:';
        }
        td = document.createElement('td');
        tr.appendChild(td);
        td.align = 'right';
        td.className = 'style2';
        td.innerHTML = route.Distance.toFixed(1) + distUnit;
        // separator
        tr = document.createElement('tr');
        tb.appendChild(tr);
        td = document.createElement('td');
        tr.appendChild(td);
        td.colSpan = '3';
        td.innerHTML = '<hr/>';
        // show table
        document.getElementById('tblDirections').style.display = 'inline';
        document.getElementById('tblResult').style.display = 'none';
        document.getElementById('tblLoading').style.display = 'none';
    }

