js.js

var ls = ls || {};
 
ls.map = ( function($) {
    this.options = {
        map :   '#vmap',
        modal : '#modal_places',
        codes : [],
        values : {},
        save : false,
        color : ['#C8EEFF','#006491']
    };
 
    this.init = function(opt) {
        if(opt) {
            $.extend(true,this.options,opt);
        }
 
        this.replaceIdOnCode();
 
        // Инициализируем модальное окно достопримечательностей
        $(this.options.modal).jqm();
 
        // Отображаем карту
        $(this.options.map).vectorMap({
            map: 'world_en',
            backgroundColor: null,
            color: '#ffffff',
            hoverOpacity: 0.7,
            selectedColor: null,
            selectedRegion: null,
            enableZoom: true,
            values: ls.map.options.values,
            scaleColors: ls.map.options.color,
            normalizeFunction: 'polynomial',
            onLabelShow: function(element,label,code) {
                var country = ls.map.getCountryByCode(code);
                label.text(country.name);
            },
            onRegionClick: function(element, code, region) {
                ls.map.click(element, code, region);
            }
        });
    };
 
    this.click = function(element, code, region, id) {
        var country = (id typeof != 'undefined') ? this.getCountryById(id) : this.getCountryByCode(code);
        $(this.options.modal+' .modal-header h3').html(country.name);
        ls.places.load(country.id,ls.registry.get('user'));
 
        $(this.options.modal).jqmShow();
    };
 
    this.getCountryByCode = function(code) {
        var c = {};
        $.each(ls.map.options.codes,function(i,country) {
            if(country[1] == code) {
                c = {
                    id: country[0],
                    code: country[1],
                    name: country[2]
                };
                return;
            }
        });
        return c;
    };
 
    this.getCountryById = function(id) {
        var c = {};
        $.each(ls.map.options.codes,function(i,country) {
            if(country[0] == id) {
                c = {
                    id: country[0],
                    code: country[1],
                    name: country[2]
                };
                return;
            }
        });
        return c;
    };
 
    this.replaceIdOnCode = function() {
        var newValues = {};
        $.each(ls.map.options.codes,function(i,country) {
            newValues[country[1]] = ls.map.options.values[country[0]];
        });
        ls.map.options.values = newValues;
        //console.log(ls.map.options.values);
    };
 
    this.saveMapImage = function(callback) {
        var width = $(this.options.map).width();
        var height = $(this.options.map).height();
        $(this.options.map).width(1280);
        $(this.options.map).height(1024);
        $(window).trigger('resize');
 
        // Преобразуем карту в canvas
        var c = document.getElementById('canvas');
        c.width = $(this.options.map).width();
        c.height = $(this.options.map).height();
        if (context) c.getContext = context;
        canvg(c, $(this.options.map +' svg').outerHTML(), { ignoreMouse: true, ignoreAnimation: true });
 
        $(this.options.map).width(width);
        $(this.options.map).height(height);
        $(window).trigger('resize');
 
        // Кодируем canvas как png
        var image = Canvas2Image.convertToPNG(c, c.width, c.height);
        image = image.src.replace('data:image/png;base64,', '');
 
        // Отправляем картинку кодированную в base64
        var url = aRouter.ajax+'map/upload/image/';
        var params = {
            image: image,
            user: ls.registry.get('user')
        };
        ls.ajax(url, params, function(result){
            if (result.bStateError) {
                ls.msg.error(null, result.sMsg);
            } else {
                //console.log(result.sImagePath);
                callback(result.sImagePath);
                //ls.msg.notice(null, result.sMsg);
            }
        });
 
 
    };
 
    return this;
}).call(ls.map || {}, jQuery);