TDataView_ui/scripts/vendor/map23dlib/leaflet.mapshot.js

L.Control.MapShot = L.Control.extend({

    options: {
        position: 'topright',
    },

    /**
     * 地图实例
     * @type {Object}
     * @private
     */
    _map: null, 

    /**
     * 底图容器
     * @type {L}
     */
    _shotGroup: new L.FeatureGroup(),

    /**
     * 是否正在底图
     * @type {Boolean}
     * @default false
     * @private
     */
    _isScreenShot: false,

    _msType: 1,


    initialize: function(options) {
        L.setOptions(this, options);
        return this;
    },

    onAdd: function(map) {
        this._map = map;
        this._map.addLayer(this._shotGroup);
        this.rectangle = new L.Draw.Rectangle(this._map);
        this._createControl();
        return this._container;
    },


    _createControl: function() {
        var _this = this;
        var className = 'leaflet-control-mapshot',
            classNames = className + ' leaflet-bar leaflet-control';
        this._container = L.DomUtil.create('div', classNames);

        var link = L.DomUtil.create('a', 'leaflet-mapshot-link', this._container);

        var span = L.DomUtil.create('span', '', link);
        span.innerHTML = '底图';

        L.DomEvent.on(this._container, 'mousedown', L.DomEvent.stopPropagation)
            .on(this._container, 'dblclick', L.DomEvent.stopPropagation)
            .on(this._container, 'click', L.DomEvent.stopPropagation)
            .on(this._container, 'mousewheel', L.DomEvent.stopPropagation)
            .on(this._container, 'contextmenu', L.DomEvent.stopPropagation);


        //绑定事件
        L.DomEvent
            .on(link, 'click', L.DomEvent.stopPropagation)
            .on(link, 'click', L.DomEvent.preventDefault)
            .on(link, 'click', function() {
                if (_this._isScreenShot) {
                    _this.remove();
                } else {
                    _this.init();
                }
            });


        _this.mapShotInfoContainer = L.DomUtil.create('div', 'leaflet-mapshot-info', this._container);

        var title = L.DomUtil.create('h3', '', _this.mapShotInfoContainer);
        title.innerHTML = '底图信息';

        var labelLT = L.DomUtil.create('label', '', _this.mapShotInfoContainer);
        labelLT.innerHTML = '左上角坐标:';
        _this.pLT = L.DomUtil.create('p', '', _this.mapShotInfoContainer);

        var labelRB = L.DomUtil.create('label', '', _this.mapShotInfoContainer);
        labelRB.innerHTML = '右下角坐标:';
        _this.pRB = L.DomUtil.create('p', '', _this.mapShotInfoContainer);

        _this.labelTypeL = L.DomUtil.create('label', '', _this.mapShotInfoContainer);
        _this.labelTypeL.innerHTML = '图种名称:';
        _this.labelTypeP = L.DomUtil.create('p', '', _this.mapShotInfoContainer);

        _this.labelThematic = L.DomUtil.create('label', '', _this.mapShotInfoContainer);
        _this.labelThematic.innerHTML = '专题图名称:';
        _this.selectThematicType = L.DomUtil.create('select', '', _this.mapShotInfoContainer);
        $(_this.labelThematic).hide();
        $(_this.selectThematicType).hide();
        $(_this.selectThematicType).css("width", "100px");

        var labelZoom = L.DomUtil.create('label', '', _this.mapShotInfoContainer);
        labelZoom.innerHTML = '缩放级别:';
        _this.selectZoom = L.DomUtil.create('select', '', _this.mapShotInfoContainer);


        var labelPicType = L.DomUtil.create('label', '', _this.mapShotInfoContainer);
        labelPicType.innerHTML = '图片格式:';
        _this.selectPicType = L.DomUtil.create('select', '', _this.mapShotInfoContainer);
        var picType = ['png','jpg'];
        for (var ii = 0; ii < picType.length; ii++) {
            var item = new Option(picType[ii], picType[ii]);
            _this.selectPicType.options.add(item);
        }

        var subDiv = L.DomUtil.create('div', 'subdiv', _this.mapShotInfoContainer);

        _this.subBtn = L.DomUtil.create('button', 'maptile', subDiv);
        _this.subBtn.innerHTML = '底图下载';
        // _this.ZSsubBtn = L.DomUtil.create('button', 'wview', subDiv);
        // _this.ZSsubBtn.innerHTML = '整饰下载';

        _this.downDiv = L.DomUtil.create('div', 'download-panel', _this.mapShotInfoContainer);
        _this.downLink = L.DomUtil.create('p', 'download-link', _this.downDiv);

        L.DomEvent.on(_this.subBtn, 'click', function() {
            _this._postScreenShotInfo();
        });
        // L.DomEvent.on(_this.ZSsubBtn, 'click', function() {
        //     _this._postScreenMapFishInfo();
        // });
        ONEMAP.C.publisher.subscribe(createC, 'tools:active');

        function createC(options){
            if(options.modName == 'msAll'){
                _this._msType = 2;
            } else{
                _this._msType = 1;
            }
        }
        
    },


    /**
     * 初始化
     * @type {Function}
     */
    init: function() {
        var _this = this;
        _this.rectangle.enable();
        _this._shotGroup.clearLayers();

        _this._isScreenShot = true;
        L.DomUtil.addClass(_this._container, 'active');

        _this._map.on('draw:created', _this.drawCreated, this);
        _this._map.on('singleLayer:addToMap', _this.updatePanel, this);

        _this._map.on('singleLayer:removeFromMap', _this.getBaseMap, this);

        _this._map.on('mainLayer:addLayer', _this.getBaseMap, this);
        _this._map.on('overLayer:addLayer', _this.getBaseMap, this);
    },
    layoutResize: function() {
        var curWindowHeigth = $(window).height();
        /*if(curWindowHeigth < 955){
           $("#mapHolder .leaflet-mapshot-info").css({
                "left":-130
           })
        }else{
            $("#mapHolder .leaflet-mapshot-info").css({
                 "left":-179
            })
        }*/
    },
    /**
     * 更新底图信息面板
     * @param  {[type]} layerObj [description]
     * @return {[type]}          [description]
     */
    updatePanel: function(layerObj) {
        var _this = this;
        _this.curLayerObj = map23DData.layers[layerObj.guid]['layer'];
        _this.labelTypeP.innerHTML = _this.curLayerObj.name;
        _this.curLayerObj.translate = _this.curLayerObj.name;
        _this.curLayerObj.guid = _this.curLayerObj.guid;

        for (var i = 0; _this.selectZoom.options.length != 0; i++) {
            _this.selectZoom.options.remove(0);
        }

        for (var ii = _this.curLayerObj.minZoom; ii <= _this.curLayerObj.maxZoom; ii++) {
            var item = new Option(ii, ii);
            _this.selectZoom.options.add(item);
        }
    },

    /**
     * 获取当前底图信息并更新信息面板
     * @return {[type]} [description]
     */
    getBaseMap: function() {
        var _this = this;
        var baseMapObj = {
            translate: null,
            guid: null
        }
        baseMapObj.guid = ONEMAP.M.mapHolder.modValue.mainLayers;

        if (baseMapObj.guid === 'gm') {
            baseMapObj.translate = '交通图';
            baseMapObj.guid = 'gm';
        }
        if (baseMapObj.guid === 'gr') {
            baseMapObj.translate = '影像图';
            baseMapObj.guid = 'gr';
        }
        if (baseMapObj.guid === 'gr') {
            baseMapObj.translate = '影像叠加地名图';
            baseMapObj.guid = 'gr';
        }
        if (baseMapObj.guid === 'gt') {
            baseMapObj.translate = '地势图';
            baseMapObj.guid = 'gt';
        }

        _this.curLayerObj = baseMapObj;


        _this.labelTypeP.innerHTML = baseMapObj.translate;
        $(".zhengshiDl .name").attr("placeholder",baseMapObj.translate)

        for (var i = 0; _this.selectZoom.options.length != 0; i++) {
            _this.selectZoom.options.remove(0);
        }

        for (var ii = map23DConfig.map2DMinZoom; ii <= map23DConfig.map2DMaxZoom; ii++) {
            var item = new Option(ii, ii);
            _this.selectZoom.options.add(item);
            $(_this.selectZoom).val(_this._map.getZoom());
        }
    },

    updateShotBounds: function() {
        var _this = this;
        var bounds = _this.shotLayer.getBounds();

        _this.pLT.innerHTML = '[' + bounds.getNorthWest().lat.toFixed(5) + ',' + bounds.getNorthWest().lng.toFixed(5) + ']';

        _this.pRB.innerHTML = '[' + bounds.getSouthEast().lat.toFixed(5) + ',' + bounds.getSouthEast().lng.toFixed(5) + ']';
        $(_this.selectZoom).val(_this._map.getZoom());
    },

    /**
     * 标注创建 添加到容器
     * @param e
     */
    drawCreated: function(e) {
        var _this = this;
        var type = e.layerType;
        _this.shotLayer = e.layer;
        _this._shotGroup.addLayer(_this.shotLayer);
        _this.shotLayer.editing.enable();

        var thematic = {
            curThematic: {
                min_zoom: 1,
                max_zoom: 19,
                translate: "未知",
                guid: 'null'
            }
        };

        var baseMapObj = {
            translate: null,
            guid: null
        }
        baseMapObj.guid = ONEMAP.M.mapHolder.modValue.mainLayers;
        thematic.curThematic.min_zoom = map2DViewer.map.getMinZoom(); //baseMapObj.options.minZoom
        thematic.curThematic.max_zoom = map2DViewer.map.getMaxZoom();
        if (baseMapObj.guid === 'gm') {
            baseMapObj.translate = '交通图';
            baseMapObj.guid = 'gm';
        }
        if (baseMapObj.guid === 'gr') {
            baseMapObj.translate = '影像图';
            baseMapObj.guid = 'gr';
        }
        if (baseMapObj.guid === 'gr') {
            baseMapObj.translate = '影像叠加地名图';
            baseMapObj.guid = 'gr';
        }
        if (baseMapObj.guid === 'gt') {
            baseMapObj.translate = '地势图';
            baseMapObj.guid = 'gt';
        }
        thematic.curThematic.translate = baseMapObj.translate;
        thematic.curThematic.guid = baseMapObj.guid;

        var thematicData = ONEMAP.D.ThematicInMapData;
        // if (ONEMAP.D.overLayerCount > 0) {
        //     $(_this.labelThematic).show();
        //     $(_this.selectThematicType).show();
        //     $(_this.labelTypeP).hide();
        //     $(_this.labelTypeL).hide();
        // } else {
        //     $(_this.labelThematic).hide();
        //     $(_this.selectThematicType).hide();
        //     $(_this.labelTypeP).show();
        //     $(_this.labelTypeL).show();
        // }
        $(_this.selectThematicType).empty();
        $.each(thematicData, function(i, t) {
            var item = new Option(t.name, t.name);
            _this.selectThematicType.options.add(item);
        })

        _this.curLayerObj = thematic.curThematic;

        _this._map.on('editDraging', _this.updateShotBounds, this);

        var bounds = _this.shotLayer.getBounds();

        _this.pLT.innerHTML = '[' + bounds.getNorthWest().lat.toFixed(5) + ',' + bounds.getNorthWest().lng.toFixed(5) + ']';

        _this.pRB.innerHTML = '[' + bounds.getSouthEast().lat.toFixed(5) + ',' + bounds.getSouthEast().lng.toFixed(5) + ']';

        for (var i = 0; _this.selectZoom.options.length != 0; i++) {
            _this.selectZoom.options.remove(0);
        }

        for (var ii = thematic.curThematic.min_zoom; ii <= thematic.curThematic.max_zoom; ii++) {
            var item = new Option(ii, ii);
            _this.selectZoom.options.add(item);
            $(_this.selectZoom).val(_this._map.getZoom());
        }

        //_this.selectZoom.value = _this._map.getZoom();

        if(_this._msType == 1){
            _this.labelTypeP.innerHTML = thematic.curThematic.translate;
            _this.mapShotInfoContainer.style.display = 'block';
        } else{
            $(".zhengshiDl").addClass('active');
            $(".zhengshiDl .name").attr("placeholder",_this.curLayerObj.translate)
            $(".zhengshiDl .bili").val(_this._map.getZoom());
            $(".zhengshiDl .subdiv button").off("click").on("click",function(){
                _this._postScreenMapFishInfo();
            })
        }
        
        _this.layoutResize();
    },


    /**
     * 整视图下载
     */
    _postScreenMapFishInfo: function() {
        var _this = this;
        var thematicGuid;
        var bounds = _this.shotLayer.getBounds();
        _this.centerlng = (bounds.getNorthWest().lng+bounds.getSouthEast().lng).toFixed(5)/2;
        _this.centerlat = (bounds.getNorthWest().lat+bounds.getSouthEast().lat).toFixed(5)/2;
        newdata = new Date();
        year = newdata.getFullYear();
        month = newdata.getMonth() + 1;
        day = newdata.getDate().toString();
        var hour = newdata.getHours().toString();
        var mintes = newdata.getMinutes().toString();
        var second = newdata.getSeconds().toString();
        if (month < 10) {
            // month = "0" + month;
        }
        if (day < 10) {
            day = "0" + day;
        }
        if (hour < 10) {
            hour = "0" + hour;
        }
        if (mintes < 10) {
            mintes = "0" + mintes;
        }
        if (second < 10) {
            second = "0" + second;
        }
       
        var time = year + "年" + month + "月" + day + "日 " + hour + "：" + mintes + "：" + second ;
        if(_this.curLayerObj.guid == "gr"){
            _this.curLayerObj.guid = 'gh';
        }
        var svname = $(".zhengshiDl .name").val();
        if(svname == ""){
            svname = _this.curLayerObj.translate;
        }
        var svzoom = $('.zhengshiDl .bili option:selected').val();
        var svimgtype = $(".zhengshiDl .geshi option:selected").val();
        // $(_this.selectZoom).val()
        var postDataMapfish = {
            center: [_this.centerlng, _this.centerlat],
            name: svname,
            zoom: svzoom,//_this.selectZoom.value
            guid: _this.curLayerObj.guid,
            ext: svimgtype,//'png'
            mapshotName: svname,//_this.curLayerObj.translate
            mapshotcopyright: time
        }
        ONEMAP.C.publisher.publish(postDataMapfish, 'mapFish:postData');
    },
    /**
     * 提交数据到服务器
     * @type {Function}
     * @private
     */
    _postScreenShotInfo: function() {
        var _this = this;
        var thematicGuid;
        var bounds = _this.shotLayer.getBounds();
        // if (ONEMAP.D.overLayerCount > 0) {
        //     var thematicName = $(_this.selectThematicType).val();
        //     $.each(ONEMAP.D.ThematicInMapData, function(i, t) {
        //         if (t.name === thematicName) {
        //             thematicGuid = t.guid;
        //         }
        //     })
        //     _this.curLayerObj.guid = thematicGuid;
        //     _this.curLayerObj.translate = thematicName;
        // }
        var nwLat = bounds.getNorthWest().lat.toFixed(5);
        var nwLng = bounds.getNorthWest().lng.toFixed(5);
        var seLat = bounds.getSouthEast().lat.toFixed(5);
        var seLng = bounds.getSouthEast().lng.toFixed(5);
        if(nwLng<-180){
            ONEMAP.C.publisher.publish({ type: 'warning', message: '矩形左上经度不能小于-180度，请修改' }, 'noteBar::add');
            return false;
        }else if(seLng >180){
            ONEMAP.C.publisher.publish({ type: 'warning', message: '矩形右下经度大于180度，请修改' }, 'noteBar::add');
            return false;
        }
        if(_this.curLayerObj.guid == "gr"){
            _this.curLayerObj.guid = 'gh';
        }
        var postData = {
            bbox: '[' + bounds.getNorthWest().lng.toFixed(5) + ',' + bounds.getNorthWest().lat.toFixed(5) + ',' + bounds.getSouthEast().lng.toFixed(5) + ',' + bounds.getSouthEast().lat.toFixed(5) + ']',
            name: _this.curLayerObj.translate,
            zoom: _this.selectZoom.value,
            guid: _this.curLayerObj.guid,
            ext: _this.selectPicType.value
        }

        //_this._map.fire('mapShot:postData',postData); 
        ONEMAP.C.publisher.publish(postData, 'mapShot:postData');
        //_this.remove();
    },

    /**
     * 移除事件
     * @type {Function}
     */
    remove: function() {
        var _this = this;
        if (_this._map != null) {
            _this._isScreenShot = false;

            L.DomUtil.removeClass(_this._container, 'active');

            _this.rectangle.disable();
            _this._shotGroup.clearLayers();

            _this.mapShotInfoContainer.style.display = 'none';


            _this._map.off('draw:created', _this.drawCreated, this);
            //_this._map.off('draw:edit', _this.drawEdit,this);

            _this._map.off('singleLayer:addToMap', _this.updatePanel, this);
            _this._map.off('singleLayer:removeFromMap', _this.getBaseMap, this);
            _this._map.off('editDraging', _this.updateShotBounds, this);

            _this._map.off('mainLayer:addLayer', _this.getBaseMap, this);
            _this._map.off('overLayer:addLayer', _this.getBaseMap, this);
        }
    }

});

L.control.mapShot = function(options) {
    return new L.Control.MapShot(options);
};