/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

ymaps.ready(init);
var myMap;

function init() {
    myMap = new ymaps.Map("map", {
        center: [59.9, 30.3],
        zoom: 11,
        behaviors: ['default', 'scrollZoom']
    });

    myMap.controls.add('mapTools');
    myMap.controls.add('typeSelector');
    myMap.controls.add('smallZoomControl');
    myMap.controls.add('scaleLine');

    //    myPlacemark = new ymaps.Placemark([59.977822,30.283677], {
    //        hintContent: 'Дом Ирен Адлер',
    //        balloonContent: '<div class="infoCard"><img src="http://www.blog-fiesta.com/uploads/slider_image/image/15162/v800_1289474719dacha_gaus.jpg" /><h3>Дом Ирен Адлер</h3> Дача Гаусвальд - редкий, даже по мировым меркам, пример деревянного здания в стиле модерн. Построенное для жены знаменитого булочного мастера в конце XIX века, в XXI столетии оно медленно разрушается из-за банального грибка. <a href="http://www.blog-fiesta.com/sights/dacha-gausvald/">Подробнее...</a></div>'
    //    });
    //    myMap.geoObjects.add(myPlacemark);

    getPoints();

    myMap.events.add('click', function (e) {
        if (!myMap.balloon.isOpen()) {
            var coords = e.get('coordPosition');
            myMap.balloon.open(coords, {
                contentHeader:'Событие!',
                contentBody:'<p>Кто-то щелкнул по карте.</p>' +
                '<p>Координаты щелчка: ' + [
                coords[0].toPrecision(6),
                coords[1].toPrecision(6)
                ].join(', ') + '</p>',
                contentFooter:'<sup>Щелкните еще раз</sup>'
            });
        }
        else {
            myMap.balloon.close();
        }
    });
}

function getPoints()
{
    $.ajax({
        url: "/json/points/",
        success: function(data){
            for(var k in data) {
                myPlacemark = new ymaps.Placemark(
                    [data[k]['lat'], data[k]['lng']], {
                    hintContent: data[k]['name'],
                    balloonContent: 
                        '<div class="infoCard">' +
                        '<img src="'+data[k]['img']+'" />' +
                        '<h3>'+data[k]['name']+'</h3>' +
                        data[k]['description'] +
                        ' <a href="'+data[k]['source']+'" target="blank">Подробнее...</a></div>'
                });
                myMap.geoObjects.add(myPlacemark);
            }
        }
    });

    return true;
}