﻿ var map;
 var geocoder;
 var postcode;
 
 function IsNZ() {
     var url = window.location.href;
     if (url.indexOf('nz') > 0)
         return true;
     return false;
 }
 
var error_text = $(' \
        <h2>0 STORES IN YOUR AREA </h2> \
		<p>You have the following options:</p> \
		<ul> \
			<li>Try searching again at a greater distance from your location or in another product category</li> \
			<li>Try searching again for <a href="/">another product</a> or using our <a href="/Store-Locator.aspx">general store finder</a></li> \
		</ul> \
 	');

$(document).ready(function() {
    initialise();
    $('.btnStoreSearch').bind('click', searchLocations);
    var url = window.location.href;
    if (url.indexOf('?s=') > 0 || url.indexOf('&s=') > 0) {
        $('.btnStoreSearch').click();
    }
    $('.txtAddress').keypress(function(event) {
        if (event.keyCode == 13) {
            searchLocations();
            if ($.browser.msie)
                return false;
            else
                event.preventDefault();
        }
    });
});

function searchLocations() {
    var address = IsNZ()==true ? ", New Zealand" : ", Australia";
    $('#map-result-hold').empty();
    $('div.ajax-loader').show();
    geocoder.getLocations($(".txtAddress").attr('value') + address, function(response) {
        if (!response || response.Status.code != 200) {
            DisplayError();
            $('div.ajax-loader').hide();
        }
        else {
            var place = response.Placemark[0];
            var latlng = new GLatLng(place.Point.coordinates[1], place.Point.coordinates[0]);
            geocoder.getLocations(latlng, function(response2) {
                if (response && response.Status.code == 200) {
                    findPostalCode(response2.Placemark[0].AddressDetails.Country);
                    //alert(postcode);
                }
                searchLocationsNear(latlng, postcode);
            });
        }
    });
    return false;
}

function findPostalCode(obj) {
    $.each(obj, function(key, value) {
        if (typeof value == 'object')
            findPostalCode(value)
        else if (key == 'PostalCodeNumber')
            postcode=value;
        //alert(key + ': ' + value);
    })
}

/*function searchLocations() {
    var address = ", Australia";
    $('#map-result-hold').empty();
    $('div.ajax-loader').show();
    geocoder.getLatLng($(".txtAddress").attr('value') + address, function(latlng) {
        if (latlng) {
            searchLocationsNear(latlng);
        }
        else {
            DisplayError();
            $('div.ajax-loader').hide();
        }
    });
    return false;
}*/

function DisplayError() {
    var _answer = $('<div class="map-results"></div>');
    var res_hold = $('#map-result-hold');
    $('<div class="results-error"></div>').append(error_text).appendTo(_answer);
    res_hold.append(_answer);
    res_hold.find('div.results-scroll').customScrollV();
    res_hold.animate({ height: res_hold.children('div.map-results').outerHeight() }, 400, function() { $(this).height('auto'); });     
}

function searchLocationsNear(center, postcode) {
    var searchUrl = '/cmstemplates/asics/Storeslocatorxml.aspx?xml=true&lat=' + center.lat() + '&lng=' + center.lng();
    if (postcode != undefined)
        searchUrl = searchUrl + '&pc=' + postcode;
    var url = window.location.href;
    if (url.indexOf('pid=') > 0 && url.indexOf('id=') > 0) {
        searchUrl = searchUrl + '&pid=' + $('.form .bg input[type="hidden"]').attr('value');
        $('#map-result-hold').addClass('results-scroll-height');
    }
    var selectVal = $('.map-content select option:selected').val();
    if (selectVal != undefined && selectVal != 'All Categories') 
    {
        searchUrl = searchUrl + '&cid=' + selectVal;
    }
    GDownloadUrl(searchUrl, function(data) {
        var xml = GXml.parse(data);
        var markers = $(xml).children('markers').children('marker');
        //var markers = xml.documentElement.getElementsByTagName('marker');
        map.clearOverlays();
        if (markers.length == 0) {
            DisplayError();
            setCenterDefault();        
            $('div.ajax-loader').hide();
            return;
        }
        var marker1 = '';
        var bounds = new GLatLngBounds();
        var _answer = $('<div class="map-results"></div>');
        var res_hold = $('#map-result-hold');
        res_hold.stop().css({ display: 'block', height: '0' }).empty();
        var storeText = markers.length == 1 ? ' store' : ' stores';
        _answer.append('<h2>RESULTS: ' + markers.length + storeText + ' found</h2>');
        var t_hold = $('<div class="result-items"></div>');
        for (var i = 0; i < markers.length; i++) {
            var name = markers[i].getAttribute('name');
            var address = markers[i].getAttribute('address').replace(":", "<br />");
            var phone = markers[i].getAttribute('phone');
            var storeHours = markers[i].getAttribute('hours');
            var accredited = markers[i].getAttribute('accredited');
            var point = new GLatLng(parseFloat(markers[i].getAttribute('lat')), parseFloat(markers[i].getAttribute('lng')));
            var marker = createMarker(i, point, name, address, phone, storeHours, accredited);
            map.addOverlay(marker);
            if (i == 0)
                marker1 = marker;
            var sidebarEntry = createSidebarEntry(marker, i, name, address, phone, accredited);
            t_hold.append(sidebarEntry);
            bounds.extend(point);
        }
        $('<div class="results-scroll"></div>').append(t_hold).appendTo(_answer);
        map.setZoom(14);
        map.panTo(marker1.getLatLng());
        res_hold.append(_answer);
        res_hold.find('div.results-scroll').customScrollV();
        res_hold.animate({ height: res_hold.children('div.map-results').outerHeight() }, 400, function() { $(this).height('auto'); });
        $('div.ajax-loader').hide();
        //GEvent.trigger(marker1, 'click');
    });
}

function createMarker(markerNumber, point, name, address, phone, storeHours, accredited) {
    var icon = new GIcon();
    if ((markerNumber + 1) <= 40) {
        icon.image = "/cmsglobalfiles/asics/storelocator/marker" + (markerNumber + 1) + ".png";
        if (accredited == 'true' && IsNZ())
            icon.image = "/cmsglobalfiles/asics/storelocator/e-marker" + (markerNumber + 1) + ".png";
        else if (accredited == 'true')
            icon.image = "/cmsglobalfiles/asics/storelocator/a-marker" + (markerNumber + 1) + ".png";
    }
    else {
        icon.image = "/cmsglobalfiles/asics/storelocator/marker-icon.png";
        if (accredited == 'true' && IsNZ())
            icon.image = "/cmsglobalfiles/asics/storelocator/a-marker-icon-nz.gif";
        else (accredited == 'true')
            icon.image = "/cmsglobalfiles/asics/storelocator/a-marker-icon.png";
    }
    icon.printImage = "A";
    icon.transparent = "transparent";
    icon.iconSize = new GSize(24, 28);
    icon.shadow = "/cmsglobalfiles/asics/storelocator/marker-shadow.png";
    icon.shadowSize = new GSize(36, 30);
    icon.iconAnchor = new GPoint(5, 6);
    icon.infoWindowAnchor = new GPoint(12, 8);
    var marker = new GMarker(point,icon);
    GEvent.addListener(marker, 'click', function(tabIndex) {
        //var html = $('<div style="width:300px;height:200px;"></div>');
        var html = document.createElement('div');
        $(html).attr('style', 'width:300px;height:190px;');
        $(html).addClass('map-details');
        var stringHTML = '<div style="float:left;margin-right:15px;width:26px;"><img src="' + icon.image + '" alt="" /></div><div style="float:left;line-height:1.5em;width:200px;">';
        if (accredited == 'true' && IsNZ())
            stringHTML += '<img style="display:block;margin-bottom:10px;" src="/cmsglobalfiles/asics/storelocator/asics-nz-exclusive.gif" alt="Exclusive Retailer" />';
        else if (accredited == 'true')
            stringHTML += '<img style="display:block;margin-bottom:10px;" src="/cmsglobalfiles/asics/storelocator/asics-experts-long.png" alt="ASICS EXPERTS" />';
        stringHTML += '<strong style="color:#000066">' + name + '</strong> <br/>' + address + '<br />' + phone + '<br /></div>';
        html.innerHTML = stringHTML;
        var streetView = document.createElement('li');
        streetView.innerHTML = '<a href="#">Street view</a>';
        $('<ul style="clear:left"></ul>')
        .append(streetView)
        .append('<li><a target="_blank" href="http://maps.google.com/?daddr=' + address.replace('<br />', '') + '">Get directions</a></li>')
        .appendTo(html);
        GEvent.addDomListener(streetView, 'click', function(event) {
            GEvent.trigger(marker, 'click', 2);
            map.setCenter(marker.getLatLng());
            if ($.browser.msie)
                return false;
            else
                event.preventDefault();
        });
        var infoTabs = [new GInfoWindowTab('Store Details', html),
                        new GInfoWindowTab("Store Hours", storeHours),
                        new GInfoWindowTab("Street View", createPanorama(point))];

        if (typeof tabIndex == "object")
            tabIndex = 0;
        marker.openInfoWindowTabs(infoTabs, { selectedTab: tabIndex });
        map.setCenter(marker.getLatLng());
    });
    return marker;
}

function setCenterDefault() {
    if (IsNZ()) {
        map.setCenter(new GLatLng(-42.217116, 170.567381), 5);
    }
    else {
        map.setCenter(new GLatLng(-27.217116, 133.567381), 4);
    }
}

function createPanorama(point) {
    var pano = document.createElement("div");
    $(pano).addClass('streetView');
    $(pano).attr('style', 'width:300px;position:relative;top:-5px');
    var panoramaOptions = { latlng: point };
    var myPano = new GStreetviewPanorama(pano, panoramaOptions);
    GEvent.addListener(myPano, "error", function() { pano.innerHTML='<strong>No Street View for this location</strong>' });
    return pano;
}

function createSidebarEntry(marker, i, name, address, phone, accredited) {
    var t_box = $('<div class="result-item"></div>');
    if (accredited=='true') {
        //alert(accredited);
        t_box.addClass("accredited-item");
        var image = document.createElement('img');
        var filename = 'asics-experts-short.png';
        if (IsNZ()) {
            filename = 'asics-nz-exclusive-short.gif';
        }
        image.src = '/cmsglobalfiles/asics/storelocator/' + filename;
        $(image).attr('alt','ASICS EXPERTS');
        t_box.append(image);
        GEvent.addDomListener(image, 'click', function() {
            GEvent.trigger(marker, 'click', 0);
            map.setCenter(marker.getLatLng());
        });
    }
    var icon = document.createElement('span'); 
    $(icon).addClass('num');
    icon.innerHTML = i + 1;
    var title = document.createElement('h3'); 
    title.innerHTML = '<a href="#">' + name + '</a>';
    t_box.append(icon);
    t_box.append(title);
    t_box.append('<address>' + address + '</address>');
    t_box.append('<address>' + phone + '</address>');
    var streetView = document.createElement('li');
    streetView.innerHTML = '<a href="#">Street view</a>';
    var storeHours = document.createElement('li');
    storeHours.innerHTML = '<a href="#">View opening times</a>';
    var directions = '<li><a target="_blank" href="http://maps.google.com/?daddr=' + address.replace('<br />','') + '">Get directions</a></li>';
    $('<ul></ul>')
    .append(streetView)
    .append(directions)
    .append(storeHours)
    .appendTo(t_box); 
    GEvent.addDomListener(icon, 'click', function() {
        GEvent.trigger(marker, 'click', 0);
        map.setCenter(marker.getLatLng());
    });
    GEvent.addDomListener(title, 'click', function(event) {
        GEvent.trigger(marker, 'click', 0);
        map.setCenter(marker.getLatLng());
        if($.browser.msie)
            return false;
        else
            event.preventDefault();
    });
    GEvent.addDomListener(streetView, 'click', function(event) {
        GEvent.trigger(marker, 'click', 2);
        map.setCenter(marker.getLatLng());
        if($.browser.msie)
            return false;
        else
            event.preventDefault();
    });
    GEvent.addDomListener(storeHours, 'click', function(event) {
        GEvent.trigger(marker, 'click', 1);
        map.setCenter(marker.getLatLng());
        if($.browser.msie)
            return false;
        else
            event.preventDefault();
    });
    return t_box;
}

function initialise() {
    if(GBrowserIsCompatible()) {
        geocoder = new GClientGeocoder();
        map = new GMap2(document.getElementById("map_canvas"));
        map.addControl(new GMapTypeControl());
        map.addControl(new GLargeMapControl(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,50)));
        map.enableScrollWheelZoom();
        setCenterDefault();
    }
}
