TDataView_ui/scripts/mod/atlas/atlasList.js

/**
 * @fileoverview 专题图 模块
 * @author Song.Huang
 * @version 1.0.0
 */
define([  
    'html!templates/atlas/atlasList',
    'modDir/service/regionSearch',
    'css!styles/atlas/atlasList'
], function(tplLayout,regionSearchF) {

    /**
     * 模块数据 用于数据存储和外部调用
     * @type {Object}
     * 数据存放
     */
    var modValue = {
        options : {
            page: 1, //页数
            pageSize: 24, //每页条数
            searchType: 'byPage', //搜索类型
            searchKeyWord: '', //搜索关键字
            searchId: 0, //搜索ID
            theme: null, //分类
            region: '', //当前区域 0 全球
            area: ''
        },
        //查询数据集合
        thematicDataResult:null,
        //专题图分类
        thematicCategory:[],
        tuisonglist:[],
    }


    /**
     * 状态值
     * @type {Boolean}
     * @default false
     * @private
     */
    var status = {
        initialized:false,
        isFirstAdd:true,
        showInfoData:false,
        showSideBar:false,
        fStatu:false
    };

    var overLayerOpacityControl;

    /**
     * 初始化容器
     * @type {Function}
     */
    function init(idx) {
        //未初始化，初始化布局
        // status.fStatu = false;
        // if (idx == 0) {
        if (!status.initialized) {
            //设置容器布局
            setLayout();
            bindEvent();
            
            //订阅推送
            subscribe();
            status.initialized = true;
        }
        if(idx == 1){
            //获取专题图分类后，默认显示第一页列表
            getCategory(function() {                
                listThematicCategory();
                showThematic({ page: 1, searchType: 'byPage' });
            });
        }

        if(idx == 101){
            // 搜索那边点击了更多
            $('#thematicSearchKey').val(ONEMAP.D.user.searchKeyWord)
            thematicSearchHandler({
                keyWord: ONEMAP.D.user.searchKeyWord
            });
        }
        if(idx == 102){
            // 搜索那边过来的，不展开侧栏
            $('#thematicSearchKey').val(ONEMAP.D.user.searchKeyWord)
            thematicSearchHandler({
                keyWord: ONEMAP.D.user.searchKeyWord
            });
        }
        else{
            //开启侧栏
            ONEMAP.C.publisher.publish('handShow','layout::sideBar');
            status.showSideBar = true;
        }
        //设置zIndex 为最高
        var zIndex = ONEMAP.M.sideBar.getZIndex();
        $('#thematicPanel').css({zIndex:zIndex});

        ONEMAP.D.currentSideBarMod = 'atlas';
        
    };

    /**
     * 初始化布局
     */
    function setLayout(){        
        $(tplLayout).appendTo($("#sideBarBody"));   
        $("#atlasInfoDetail").appendTo('#wrapper');
        // $('#thematicPanel .btn-atals-labrary').css({
        //     background:'url('+onemapUrlConfig.atlasLibraryUrl+'/images/layout/logo.png) top center'
        // })
        layoutResize();
        $(window).resize(function(event) {
            layoutResize();
        });
        $("#thematicResultsList").mCustomScrollbar({
            scrollInertia: 1000
        });
    };
    /**
     * 窗口布局重置
     * @type {Function}
     */
    function layoutResize() {
        $("#thematicResultsList").css({ height: $("#sideBar").height() - $('#thematicCategoryList').height() - 180 });
        $("#thematicResultsList").mCustomScrollbar('update');
    };

    /**
     * 界面事件绑定
     * @return {[type]} [description]
     */
    function bindEvent(){
        //region
        $('#currentRegionCheckbox').bind('click', function() {
            $('#currentAreaCheckbox').parent().removeClass('checked');
            $('#currentAreaCheckbox').removeAttr('checked');
            $('#thematicSearchKey').val('请输入名称');
            if ($(this).parent().hasClass('checked')) {
                modValue.options.region = '';
                modValue.options.page = 1;
                modValue.options.area = '';
                modValue.options.searchKeyWord = '';
                getPageResult(modValue.options);
                map2DViewer.map.off('zoomend moveend dragend', regionThematicSearch);
                ONEMAP.C.publisher.unSubscribe(regionThematicSearch, 'mapChange');
                $(this).parent().removeClass('checked');
            } else {
                map2DViewer.map.off('zoomend moveend dragend', areaThematicSearch);
                map2DViewer.map.on('zoomend moveend dragend', regionThematicSearch);
                ONEMAP.C.publisher.subscribe(regionThematicSearch, 'mapChange');
                modValue.options.area = '';
                modValue.options.searchKeyWord = '';
                regionThematicSearch();
                $(this).parent().addClass('checked');
            }
        });
        //bounds
        $('#currentAreaCheckbox').bind('click', function() {
            $('#currentRegionCheckbox').parent().removeClass('checked');
            $('#currentRegionCheckbox').removeAttr('checked');
            $('#thematicSearchKey').val('请输入名称');
            if ($(this).parent().hasClass('checked')) {
                modValue.options.page = 1;
                modValue.options.area = '';
                modValue.options.searchKeyWord = '';
                getPageResult(modValue.options);
                map2DViewer.map.off('zoomend moveend dragend', areaThematicSearch);
                $(this).parent().removeClass('checked');
            } else {
                modValue.options.region = '';
                map2DViewer.map.off('zoomend moveend dragend', regionThematicSearch);
                map2DViewer.map.on('zoomend moveend dragend', areaThematicSearch);
                modValue.options.region = '';
                modValue.options.searchKeyWord = '';
                areaThematicSearch();
                $(this).parent().addClass('checked');
            }
        });


        $('#thematicSearchKey').bind('focus', function() {
            if ($(this).val() == '请输入名称') {
                $(this).val('');
            };
        });

        $('#thematicSearchKey').bind('focusout', function() {
            if ($(this).val() == '') {
                $(this).val('请输入名称');
                $("#thematicCategoryList ul li.cur a").click();
            };
        });

        //搜索回车搜索
        $('#thematicSearchKey').bind('keydown', function(e) {
            var layerType = $("#thematicResultsList").attr("layerType");
            if (e.keyCode === 13) {
                if ($('#thematicSearchKey').val() != '' && $('#thematicSearchKey').val() != '请输入名称') {
                    if(ONEMAP.D.user.searchType == 1){
                        thematicSearchHandler({
                            keyWord: $('#thematicSearchKey').val()
                        });
                    }
                    else{
                        require(['modDir/atlas/atlasCategory'], function(atlasCategory) {
                            ONEMAP.C.publisher.publish('handShow','layout::sideBar');
                            status.showSideBar = true;
                            atlasCategory.init(layerType,"search");
                        });
                        ONEMAP.D.user.searchKeyWord = $('#thematicSearchKey').val();
                    }
                }
            }
        });

        //按钮搜索
        $('#thematicSearchSubmit').bind('click', function() {
            var layerType = $("#thematicResultsList").attr("layerType");
            if ($('#thematicSearchKey').val() != '' && $('#thematicSearchKey').val() != '请输入名称') {
                if(ONEMAP.D.user.searchType == 1){
                    thematicSearchHandler({
                        keyWord: $('#thematicSearchKey').val()
                    });
                }
                else{
                    require(['modDir/atlas/atlasCategory'], function(atlasCategory) {
                        ONEMAP.C.publisher.publish('handShow','layout::sideBar');
                        status.showSideBar = true;
                        atlasCategory.init(layerType,"search");
                    });
                    ONEMAP.D.user.searchKeyWord = $('#thematicSearchKey').val();
                }
            }
        });

        //海量地图库
        $('.btn-atals-labrary').bind('click',function(){
            var windowOpen = window.open();
            var openUrl = onemapUrlConfig.atlasLibraryUrl;
            if(!ONEMAP.D.user.guest){
                openUrl;
            }
            windowOpen.location = openUrl;
        })
    }

    
    

    /**
     * 显示指定参数的专题列表
     * @type {Function}
     * @param options {Object} {}
     */
    function showThematic(options) {
        ONEMAP.T.objExtend(modValue.options, options, true);
        getPageResult(modValue.options);
    };

    
    /**
     * 专题图查询
     * @param  {[type]} options [description]
     * @return {[type]}         [description]
     */
    function thematicSearchHandler(options) {
        // $('#thematicCategoryList .cur').removeClass('cur');
        // $('#thematicCategoryList li:eq(0)').addClass('cur');
        $('#currentAreaCheckbox').removeAttr('checked');
        $('#currentAreaCheckbox').parent().removeClass('checked');
        $('#currentRegionCheckbox').removeAttr('checked');
        $('#currentRegionCheckbox').parent().removeClass('checked');
        map2DViewer.map.off('zoomend moveend dragend', areaThematicSearch);
        map2DViewer.map.off('zoomend moveend dragend', regionThematicSearch);
        modValue.options.searchKeyWord = options.keyWord;
        modValue.options.searchType = 'byKeyWord';
        modValue.options.page = 1;
        // modValue.options.theme = null;
        modValue.options.area = '';
        modValue.options.region = '';
        getPageResult(modValue.options);
    };

    /**
     * 搜索分类列表内容
     * @return {[type]} [description]
     */
    function listThematicCategory() {
        $('#thematicCategoryList ul').empty();
        var allLi = $('<li class="cur"><a href="javascript:void(0)">全部</a></li>');
        allLi.appendTo($('#thematicCategoryList ul'));
        for (var i = 0, l = modValue.thematicCategory.length; i < l; i++) {
            var item = modValue.thematicCategory[i];
            var li = $('<li><a cid="' + item['id'] + '" href="javascript:void(0)">' + item['name'] + '</a></li>');
            li.appendTo($('#thematicCategoryList ul'));
        }
        layoutResize();
        $('#thematicCategoryList li').bind('click', function(e) {
            $(this).parent().find('.cur').removeClass('cur');
            $(this).addClass('cur');
            var cid = $(this).find('a').attr('cid');
            modValue.options.theme = cid;
            modValue.options.page = 1;
            modValue.options.searchType = 'byPage';
            modValue.options.searchKeyWord = '';
            //ie6 hack
            e.preventDefault();
            //获取对应分类的专题图
            getPageResult(modValue.options);
        });

    };
    

    /**
     * 按行政区域查询 判断当前是否有专题图显示，有的话不查询
     * @return {[type]} [description]
     */
    function regionThematicSearch() {
        if (!modValue.currentOverLayerGuid && ONEMAP.D.currentSideBarMod == 'atlas') {
            var regionSearch = new regionSearchF();
            var zoom = (map23DData.view.zoom - 3) > 0 ? (map23DData.view.zoom - 3) : 1;
            var center = map23DData.view.center;
            regionSearch.getRegionInfo({ latLng: [center.lat, center.lng], zoom: zoom }, function(data) {
                modValue.options.page = 1;
                //通过pac查询
                data = data.data;
                var region = data['level'][data['level'].length - 1]['code'];
                modValue.options.region = region.toString().length > 7 ? region.toString().substr(0, 7) : region;
                getPageResult(modValue.options);
            });
        }
    };

    /**
     * 按可视区域查询 判断当前是否有专题图显示，有的话不查询
     * @return {[type]} [description]
     */
    function areaThematicSearch() {
        if (!modValue.currentOverLayerGuid && ONEMAP.D.currentSideBarMod == 'atlas') {
            modValue.options.page = 1;
            //通过区域查询
            var mapBounds = map2DViewer.map.getBounds();
            if (mapBounds.getNorthEast().lng - mapBounds.getSouthWest().lng > 360) {
                mapBounds.getNorthEast().lng = 180;
                mapBounds.getSouthWest().lng = -180;
            }
            modValue.options.area = JSON.stringify([
                [L.Util.formatEarthLatLng(mapBounds.getSouthWest()).lng, L.Util.formatEarthLatLng(mapBounds.getSouthWest()).lat],
                [L.Util.formatEarthLatLng(mapBounds.getNorthEast()).lng, L.Util.formatEarthLatLng(mapBounds.getNorthEast()).lat]
            ]);
            getPageResult(modValue.options);
        }
    };

    /**
     * 根据options查询专题图
     * @type {Function}
     * @param options {Object} {page:页数，`:每页条数，searchType:查询类型 "byPage"/"byId"/"byKeyWord}
     * @private
     */
    function getPageResult(options) {
        switch (options.searchType) {
            case "byPage":
                ONEMAP.V.loading.load();
                byDefault(function(data) {
                    ONEMAP.V.loading.loaded();
                    if (!data.hasOwnProperty('map_list')) {
                        setNotResultHtml('没有搜索到相关的信息。');
                        $("#thematicPage").hide();
                    } else {
                        modValue.thematicDataResult = data;
                        // console.log(data);
                        createResultHtml();
                    }
                });
                break;
            case "byKeyWord":
                ONEMAP.V.loading.load();
                byKeyWord(options.searchKeyWord, function(data) {
                    ONEMAP.V.loading.loaded();
                    if (!data.hasOwnProperty('map_list')) {
                        setNotResultHtml('没有搜索到 ' + options.searchKeyWord + ' 的信息。');
                        $("#thematicPage").hide();
                        // ONEMAP.C.danfutuSearchResult = false;
                    } else {
                        modValue.thematicDataResult = data;
                        ONEMAP.D.user.searchKeyWordAtlasResult = data.map_list;
                        // ONEMAP.C.danfutuSearchResult = true;
                        createResultHtml();
                    }
                });
                break;
        }
    };

    /**
     * 无结果列表
     * @type {Function}
     * @param notText {String} 无结果提示文字
     * @returns {*}
     * @private
     */
    function setNotResultHtml(notText) {
        $("#thematicResultsList .item-list").empty();
        $('<p class="not-result">' + notText + '</p>').appendTo($("#thematicResultsList .item-list"));
        $("#thematicPage").hide();
    };


    function openNoCenterThematic(thematicData){
        
        var openUrl = onemapUrlConfig.atlasLibraryUrl+'/atlasView.html?viewType=1'+
                    '&guid='+thematicData.guid+
                    '&serialize='+ONEMAP.C.encryption.enCode(JSON.stringify({
                        page: modValue.options.page, //页数
                        pageSize: modValue.options.pageSize, //每页条数
                        searchWord:''
                    }));
        window.open(openUrl);

        
    }


    /**
     * 更新侧栏 列表和分页
     * @type {Function}
     * @private
     */
    function createResultHtml() {
        //清除当前加载的专题图
        //removeCurrentOverLayer();
        
        if (modValue.thematicDataResult && modValue.thematicDataResult.map_list.length > 0) {
            if(ONEMAP.D.searchFirstResult == false){
                $("#placePanel .thematic-content .thematic-title li:eq(0)").show().addClass("active").click();
                ONEMAP.D.searchFirstResult = true;
            }

            //列表
            var ul = $('<ul class="thematic-list"></ul>');
            for (var i = 0, l = modValue.thematicDataResult.map_list.length; i < l; i++) { 
                var num = i + 1;
                var imgsrc = (onemapUrlConfig.thematicThumbUrl + '?production_id=' + modValue.thematicDataResult.map_list[i].guid + '&thumb_id=' + modValue.thematicDataResult.map_list[i].thumb_min_id).toString() + '&v=' + (onemapVersion.split('='))[1];
                var itemDataEach = modValue.thematicDataResult.map_list[i];
                var li = "";
                //判断中心点是否为0,0， 是的话加背景样式 
                if(itemDataEach['center_lat'] == 0 && itemDataEach['center_lon'] == 0){
                    li = $('<li><a href="javascript:void(0)" title="' + modValue.thematicDataResult.map_list[i].name + '">' +
                    '<img src="' + imgsrc + '"/>' + '<span class="cover"></span>' + '<span class="jump"></span>' + 
                    '<span class="name">' + modValue.thematicDataResult.map_list[i].name + '</span></a></li>');
                }
                else if(ONEMAP.D.user.username && ONEMAP.D.user.username.indexOf("map_super_user")>-1){
                    li = $('<li><a href="javascript:void(0)" title="' + modValue.thematicDataResult.map_list[i].name + '">' +
                    '<img src="' + imgsrc + '"/>' + '<span class="cover"></span>' + '<span class="addset"></span>' + 
                    '<span class="name">' + modValue.thematicDataResult.map_list[i].name + '</span></a></li>');
                } else{
                    li = $('<li><a href="javascript:void(0)" title="' + modValue.thematicDataResult.map_list[i].name + '">' +
                    '<img src="' + imgsrc + '"/>' + '<span class="cover"></span>' + 
                    '<span class="name">' + modValue.thematicDataResult.map_list[i].name + '</span></a></li>');
                }
                $(li).find('.cover,.name').bind("click", { itemData: modValue.thematicDataResult.map_list[i] }, function(event) {
                    var _data = event.data.itemData;
                    if($(this).parent().hasClass('select')){
                        //移除图层
                        $(this).parent().removeClass('select');
                        removeCurrentOverLayer();
                        
                    }else {
                        // console.log(_data)
                        //先移除再添加图层到地图上
                        // if(status.isFirstAdd){
                        //     status.isFirstAdd = false;
                        // }else{
                            removeCurrentOverLayer();
                        // }

                        //判断中心点是否为0,0， 是的话弹窗显示 
                        if(_data['center_lat'] == 0 && _data['center_lon'] == 0){

                            openNoCenterThematic(_data);
                            return false;
                        }
                        

                        var checkChongMing =  ONEMAP.M.myLayerActions.checkChongMing(_data.name);
                        var layerLength = ONEMAP.M.myLayers.checkLength();
                        if(checkChongMing && layerLength < map23DConfig.layerMaxLength){
                            addOverLayerToMap(_data);

                            // console.log(_data);
                            // 添加到我的图层
                            var options = {
                                action: "add",
                                DOM:{
                                    guid: modValue.currentOverLayerGuid,
                                    type: "layer",
                                    name: _data.name,
                                    
                                },
                                mod: "test",
                                testLayerID: _data.guid,
                                layerData: _data
                            }
                            var guid = ONEMAP.M.myLayers.myLayerControl(options);
                            ONEMAP.C.publisher.subscribe(layerAction, options.DOM.guid);
                            // console.log(guid);
                            // 查看当前图层属性
                            $(this).parent().addClass('select');
                        }
                        else{
                            ONEMAP.C.publisher.publish({ type: 'warning', message: '图层已加载或图层数量已达上限' }, 'noteBar::add');
                        }
                        
                    }
                });
                $(li).find('.addset').off("click").on("click", { itemData: modValue.thematicDataResult.map_list[i] }, function(event) {
                    event.preventDefault();

                    if($("#atlasAddsetPop").length<=0){
                        var atpop = $('<div id="atlasAddsetPop"></div>');
                        atpop.html($("#atlasAddsetPopModel").html());
                        $("body").prepend(atpop);
                    }
                    $("#atlasAddsetPop").addClass('active')
                    $("#atlasAddsetPop .title").dragmove($("#atlasAddsetPop"));
                    $("#atlasAddsetPop .title span").off("click").on("click",function(){
                        if($(this).hasClass('juan')){
                            $(this).removeClass('juan')
                            $("#atlasAddsetPop .content").addClass('active');
                            $("#atlasAddsetPop .cover-content").addClass('active');
                        } else{
                            $(this).addClass('juan');
                            $("#atlasAddsetPop .content").removeClass('active');
                            $("#atlasAddsetPop .cover-content").removeClass('active');
                        }
                    })
                    var _data = event.data.itemData;
                    var tdata = JSON.stringify(_data).replace(/\"/g, "\'");
                    var li = $('<li dt="'+tdata+'" guid="'+_data.guid+'"><span class="name">'+_data.name+'</span><span class="del"></span></li>')
                    if($.inArray(_data.guid,modValue.tuisonglist) == -1){
                        $("#atlasAddsetPop .content ul").prepend(li);
                        modValue.tuisonglist.push(_data.guid)
                    } else{
                        ONEMAP.C.publisher.publish({ type: 'warning', message: '您已添加过该专题图' }, 'noteBar::add');
                    }
                    
                    $("#atlasAddsetPop .content ul").mCustomScrollbar({
                        scrollInertia: 100
                    });
                    $("#atlasAddsetPop .content li span.del").off("click").on("click",function(){
                        var guid = $(this).parent().attr("guid");
                        var idx = $.inArray(guid,modValue.tuisonglist);
                        modValue.tuisonglist.splice(idx,1);
                        var idx = $(this).index();
                        $(this).parent().remove();
                    })
                    $("#atlasAddsetPop .btns .submit").off("click").on("click",function(){
                        $("#userContent .userInfo .moreLink .linkList li.set").click();
                        // $("#globalSetting .panel-body .itemleft .left_header ul li").removeClass('active')
                        $("#globalSetting .panel-body .itemleft .left_header ul li").eq(0).click()
                        var lis = $("#atlasAddsetPop .content li");

                        var chooseHtml = $('<ul class="chhoostListContent"></ul>');
                        for(var i=0;i<ONEMAP.D.globalSettingData.map2DThematicCategory.length;i++){
                            var liHtml = $('<li>'+ONEMAP.D.globalSettingData.map2DThematicCategory[i]+'</li>');
                            $(liHtml).appendTo($(chooseHtml));
                        }
                        require(['modDir/user/userSetting'], function(userSetting) {
                            console.log(lis)
                            for(var i=0;i<lis.length;i++){
                                var dt = lis.eq(i).attr("dt").replace(/\'/g, "\"");
                                var ldata = JSON.parse(dt);
                                $('#theModel .item-form .name').attr("value",ldata.name);
                                $('#theModel .item-form .guid').attr("value",ldata.guid);
                                $('#theModel .item-form .zoom').attr("value",ldata.initial_zoom);
                                $('#theModel .item-form .center-lat').attr("value",ldata.center_lat);
                                $('#theModel .item-form .center-lng').attr("value",ldata.center_lon);
                                $('#theModel .item-form .tileLayerUrl').attr("value",onemapUrlConfig.thematicTileUrl);
                                if(ldata.legend_id_list.length>0){
                                    $('#theModel .item-form .legend').attr("value",onemapUrlConfig.thematicThumbUrl+'?production_id='+ldata.guid+'&thumb_id='+ldata.legend_id_list[0]);
                                } else{
                                    $('#theModel .item-form .legend').attr("value","");
                                }
                                $(chooseHtml).appendTo($("#theModel .item-form .category").parent());
                                $('#map2DSettingInfoContent #dxList').append($('#theModel').html())
                            }
                            ONEMAP.M.setting.bindEvent();
                            // $("#map2DSettingInfoContent .thematicModelList").mCustomScrollbar("update");
                            // $("#map2DSettingInfoContent .thematicModelList").mCustomScrollbar("scrollTo", "bottom");
                            
                            //分类输入框选择
                            $("#dxList .category").unbind('focus').bind('focus',function(e){
                                $(this).next().show();
                                $(this).parent().parent().parent().siblings().find('.chhoostListContent').hide();
                                e.stopPropagation();
                            });
                            
                            $("#dxList .chhoostListContent li").unbind('click').bind('click',function(){
                                $("#dxList .chhoostListContent").hide();
                                $(this).parent().parent().find('input').val($(this).html());
                            });
                        });
                        
                        setTimeout(function(){
                            $("#atlasAddsetPop .content ul").html("");
                            $("#atlasAddsetPop").removeClass('active');
                            $("#map2DSettingInfoContent .thematicModelList").mCustomScrollbar("update");
                            $("#map2DSettingInfoContent .thematicModelList").mCustomScrollbar("scrollTo", "bottom");
                        },500)
                    })
                    $("#atlasAddsetPop .btns .cancel").off("click").on("click",function(){
                        $("#atlasAddsetPop").removeClass('active')
                    })
                })
                $(ul).append(li);

            }
            $("#thematicCategoryList").show();
            $('#thematicResultsList').find('a').unbind();
            $("#thematicResultsList .item-list").empty().append(ul);
            $("#thematicResultsList").attr("layerType",1);
            // // 从搜索条中读入
            // if(ONEMAP.D.user.searchInsert){
            //     $("#thematicResultsList .item-list").empty().append(ONEMAP.D.user.searchKeyWordAtlasResult);
            //     ONEMAP.D.user.searchKeyWordAtlasResult = null;
            // }
            $("#thematicResultsList").mCustomScrollbar('update');
            ul = null;
            //分页
            //
            if((modValue.options.page * modValue.options.pagesize) >= modValue.thematicDataResult.total){
                $("#thematicPage").hide();
                return;
            }

            $("#thematicPage").empty();
            var countPages = (parseInt(modValue.thematicDataResult.total % modValue.thematicDataResult.pagesize) > 0 ? parseInt(modValue.thematicDataResult.total / modValue.thematicDataResult.pagesize + 1) : parseInt(modValue.thematicDataResult.total / modValue.thematicDataResult.pagesize));
            if (countPages == 0) {
                countPages = 1;
            } 
            var _pageJump = $('<div class="firstpage"></div>' +
                '<div class="uppage"></div>' +
                '<div class="fg"></div>' +
                '<div id="thematicPageJump" class="count">' +
                '   <span>' + modValue.thematicDataResult.page + '/' + countPages + '页</span>' +
                '</div>' +
                '<div class="fg"></div>' +
                '<div class="nextpage"></div>' +
                '<div class="endpage"></div>'
            );
            _pageJump.appendTo($("#thematicPage"));
            if (modValue.thematicDataResult.page == 1) {
                $("#thematicPage .firstpage").css("background", "url(../images/layout/page_11.png) no-repeat 7px 11px")
                $("#thematicPage .uppage").css("background", "url(../images/layout/page_13.png) no-repeat 10px 11px")
                $("#thematicPage .nextpage").css("background", "url(../images/layout/page_06ch.png) no-repeat 10px 11px")
                $("#thematicPage .endpage").css("background", "url(../images/layout/page_08ch.png) no-repeat 7px 11px")
            } else if (modValue.thematicDataResult.page == countPages) {
                $("#thematicPage .firstpage").css("background", "url(../images/layout/page_11ch.png) no-repeat 7px 11px")
                $("#thematicPage .uppage").css("background", "url(../images/layout/page_13ch.png) no-repeat 10px 11px")
                $("#thematicPage .nextpage").css("background", "url(../images/layout/page_06.png) no-repeat 10px 11px")
                $("#thematicPage .endpage").css("background", "url(../images/layout/page_08.png) no-repeat 7px 11px")
            } else {
                $("#thematicPage .firstpage").css("background", "url(../images/layout/page_11ch.png) no-repeat 7px 11px")
                $("#thematicPage .uppage").css("background", "url(../images/layout/page_13ch.png) no-repeat 10px 11px")
                $("#thematicPage .nextpage").css("background", "url(../images/layout/page_06ch.png) no-repeat 10px 11px")
                $("#thematicPage .endpage").css("background", "url(../images/layout/page_08ch.png) no-repeat 7px 11px")
            }
            $(".firstpage").bind("click", function() {
                modValue.thematicDataResult.page = 1;
                var op = "f";
                clickpage(modValue.thematicDataResult.page, countPages);
                $("#thematicPageJump span").html(modValue.thematicDataResult.page + "/" + countPages + "页");
            })
            $(".uppage").bind("click", function() {
                modValue.thematicDataResult.page--
                var op = "u";
                if (modValue.thematicDataResult.page < 1) {
                    modValue.thematicDataResult.page = 1
                } else {
                    clickpage(modValue.thematicDataResult.page, countPages);
                    $("#thematicPageJump span").html(modValue.thematicDataResult.page + "/" + countPages + "页");
                }

            })
            $(".nextpage").bind("click", function() {
                modValue.thematicDataResult.page++
                    var op = "n";
                if (modValue.thematicDataResult.page > countPages) {
                    modValue.thematicDataResult.page = countPages
                } else {
                    clickpage(modValue.thematicDataResult.page, countPages);
                    $("#thematicPageJump span").html(modValue.thematicDataResult.page + "/" + countPages + "页");
                }
            })
            $(".endpage").bind("click", function() {
                modValue.thematicDataResult.page = countPages;
                var op = "e";
                clickpage(modValue.thematicDataResult.page, countPages);
                $("#thematicPageJump span").html(modValue.thematicDataResult.page + "/" + countPages + "页");
            })
            $("#thematicPageJump .page_num").bind('keydown', function(e) {
                if (e.keyCode === 13) {
                    var pageJump = parseInt($("#thematicPageJump .page_num").val());
                    if (!pageJump || pageJump > countPages) {
                        return;
                    } else {
                        showThematic({ page: parseInt(pageJump),});
                    }
                }
            });

            var _themtiicPageBtnGroup = $('<div class="btn-group"></div>').appendTo($("#thematicPage"));

            if (modValue.thematicDataResult.pagesize < modValue.thematicDataResult.total) {
                if (modValue.thematicDataResult.page == 1) {
                    var abtnNext = $('<button type="button" class="btn btn2 btn-small next" pid=' + (modValue.thematicDataResult.page + 1) + '>下一页</button>');
                    
                } else if (countPages == modValue.thematicDataResult.page && modValue.thematicDataResult.total > modValue.thematicDataResult.pagesize) {
                    var abtnPrev = $('<button type="button" class="btn btn2 btn-small prev" pid=' + (modValue.thematicDataResult.page - 1) + '>上一页</button>');
                    
                } else {
                    var abtnPrev = $('<button type="button" class="btn btn2 btn-small prev" pid=' + (modValue.thematicDataResult.page - 1) + '>上一页</button>');
                    var abtnNext = $('<button type="button" class="btn btn2 btn-small next" pid=' + (modValue.thematicDataResult.page + 1) + '>下一页</button>');
                }

                $("#thematicPage .btn").on("click", function() {
                    showThematic({ page: parseInt($(this).attr('pid')) });
                });
            }
            $("#thematicPage").show();
        } else {
            $("#thematicResultsList .item-list").empty().html('<p class="not-result" style="color:#fff">单幅图暂无数据！</p>');
            $("#thematicPage,#placePanel .thematic-content .thematic-title li:eq(0)").hide();
            $("#placePanel .thematic-content .thematic-title li:eq(0)").removeClass("active");
            // ONEMAP.D.searchFirstResult = false;
        }
    };

    /**
     * 换页点击事件
     */
    function clickpage(op, allp) {
        if (op == 1) {
            $("#thematicPage .firstpage").css("background", "url(../images/layout/page_11.png) no-repeat 7px 11px")
            $("#thematicPage .uppage").css("background", "url(../images/layout/page_13.png) no-repeat 10px 11px")
            $("#thematicPage .nextpage").css("background", "url(../images/layout/page_06ch.png) no-repeat 10px 11px")
            $("#thematicPage .endpage").css("background", "url(../images/layout/page_08ch.png) no-repeat 7px 11px")
        } else if (op == allp) {
            $("#thematicPage .firstpage").css("background", "url(../images/layout/page_11ch.png) no-repeat 7px 11px")
            $("#thematicPage .uppage").css("background", "url(../images/layout/page_13ch.png) no-repeat 10px 11px")
            $("#thematicPage .nextpage").css("background", "url(../images/layout/page_06.png) no-repeat 10px 11px")
            $("#thematicPage .endpage").css("background", "url(../images/layout/page_08.png) no-repeat 7px 11px")
        } else {
            $("#thematicPage .firstpage").css("background", "url(../images/layout/page_11ch.png) no-repeat 7px 11px")
            $("#thematicPage .uppage").css("background", "url(../images/layout/page_13ch.png) no-repeat 10px 11px")
            $("#thematicPage .nextpage").css("background", "url(../images/layout/page_06ch.png) no-repeat 10px 11px")
            $("#thematicPage .endpage").css("background", "url(../images/layout/page_08ch.png) no-repeat 7px 11px")
        }
        modValue.options.page = parseInt(op);
        showThematic({ page: parseInt(op),searchType: 'byKeyWord'});
    };
    

    /**
     * 添加专题图层到地图层
     * @type {Function}
     * @param obj {Object} 构造好了的专题图对象
     * @private
     */
    function addOverLayerToMap(data) {

        //添加到23D地图上
        //如果是2D 添加透明度控件
        modValue.currentOverLayerGuid = map23DControl.tileLayer({
            action: 'add',
            layer: {   
                url2D: onemapUrlConfig.thematicTileUrl + '/' + data.guid + '?l={z}&x={x}&y={y}',
                url3D: onemapUrlConfig.thematicTileUrl + '/' + data.guid + '?l={z}&x={x}&y={y}',
                //url3D: onemapUrlConfig.thematicTileFo3DUrl + '/' + data.guid + '?l={z}&x={x}&y={y}',
                minZoom: data['min_zoom'],
                maxZoom: data['max_zoom'],
                maxNativeZoom: data['max_zoom'],
                attribution: '',
                opacity: 1,
                imageType: 'png',
                name:data.name,
                guid:data.guid
            }
        }) 
        ONEMAP.D.ThematicInMapData[modValue.currentOverLayerGuid] = {
            'name':data.name,
            'guid':data.guid
        };
        if(status.showInfoData){
            getShowInfo(data);
        }
        // overLayerOpacityControl = new L.Control.LayerOpacity(
        //     map2DViewer.layers[modValue.currentOverLayerGuid],
        //     {
        //         thematic_data:data,
        //         min_zoom:data['min_zoom'],
        //         max_zoom:data['max_zoom'],
        //         showFavBtn:true,
        //         atlas:true,
        //         favCallback:addFavThematic,
        //         getShowInfoCallback:addThematicToMap,
        //         closeCallback:removeCurrentOverLayer
        //     }            
        // ).addTo(map2DViewer.map);

		thematicControl(
                map2DViewer.layers[modValue.currentOverLayerGuid], {
                data:data,
                showFavBtn: false,
                showFavBtn:true,
                atlas:true,
                favCallback:addFavThematic,
                getShowInfoCallback:addThematicToMap,
                closeCallback:removeCurrentOverLayer
            })

        ONEMAP.D.overLayerCount++;
        map2DViewer.map.setZoomScope(data['min_zoom'],data['max_zoom']);
        

        // map23DControl.setView({
        //     center: {
        //         lat: data['center_lat'],
        //         lng: data['center_lon']
        //     },
        //     zoom: data['zoom']
        // })
        if(typeof(data['max_zoom'])!="undefined"){
            ONEMAP.M.myLayers.zoomActions("add",data['min_zoom'], data['max_zoom'],data['center_lat'],data['center_lon'],data['initial_zoom'],data.name);
        }
        else{
            ONEMAP.M.myLayers.zoomActions("add",1, 19,map23DData.view.center['lat'],map23DData.view.center['lng'],data['initial_zoom'],data.name);
        }

    };
    //添加三维专题图控制条
    function thematicControl(layer,options){
        modValue.thematicControlHtml = $("<div class='thematicControl'>"+
                "<iframe frameborder='0' class='cover-iframe'></iframe>"+
            "</div>");
        var cover_content = $("<div class='cover-content'></div>");
        cover_content.appendTo(modValue.thematicControlHtml);
        if(options.showFavBtn || !options.onlyShow){
            var optionsWrap = $("<div class='options-wrap'></div>");
            optionsWrap.appendTo(cover_content);
        }
        $("<div class='thematicName'>名称："+options.data.name+"</div>").appendTo(cover_content);
        if(options.atlas){
            var atlasHtml = $("<a class='info_Btntd'>详情</a>");
            atlasHtml.appendTo(optionsWrap);
            atlasHtml.bind('click',function(){
                // console.log("6sr5");
                options.getShowInfoCallback(options.data);
            });
        }
        if(options.showFavBtn){
            var favBtnHtml = $("<a class='fav_abtntd'>收藏</a>");
            favBtnHtml.appendTo(optionsWrap);
            favBtnHtml.bind('click',{layer:layer},function(e){
                // console.log(e.data.layer);
                options.favCallback(e.data.layer);
            });
        }
        if(!options.onlyShow){
            var closeBtnHtml = $("<a class='close_abtntd'>关闭</a>");
            closeBtnHtml.appendTo(optionsWrap);
            closeBtnHtml.bind('click',function(){
                options.closeCallback();
                modValue.thematicControlHtml.remove();
            })
        }
        modValue.thematicControlHtml.appendTo($('#thematicControlContent'));
    };
    /**
     * 移除当前显示专题图
     * @private
     */
    function removeCurrentOverLayer(data) {
        // console.log(modValue.currentOverLayerGuid);
        // 删除我的图层中对应专题图
        var myli = $("#layerControlMenu .myLayers li");
        for(var i=0;i<myli.length;i++){
            if(myli.eq(i).attr("layer") == modValue.currentOverLayerGuid){
                myli.eq(i).remove();
            }
        }
        if(data!=undefined){
            status.showInfoData = false; 
            $('#atlasInfoDetail').hide();
            if(typeof(data['max_zoom'])!="undefined"){
                ONEMAP.M.myLayers.zoomActions("remove",data['min_zoom'], data['max_zoom']);
            }
            else{
                ONEMAP.M.myLayers.zoomActions("remove",1, 19);
            }
        }
        else{

        }
        if(modValue.currentOverLayerGuid){
            modValue.thematicControlHtml.remove();
            delete ONEMAP.D.ThematicInMapData[modValue.currentOverLayerGuid];
            ONEMAP.D.overLayerCount--;
            if(ONEMAP.D.overLayerCount == 0){
                map2DViewer.map.setZoomScope(1,19);
            }
            map23DControl.tileLayer({
                action: 'remove',
                guid:modValue.currentOverLayerGuid
            })
            modValue.currentOverLayerGuid = null;
            // map2DViewer.map.removeControl(overLayerOpacityControl);
            overLayerOpacityControl = null;
            $('#thematicResultsList li.select').removeClass('select');
        }
        // 检查图层是否为空
        ONEMAP.M.myLayerActions.checkLayerNull();

        
    };

    /**
     * 收藏专题图
     * @param {[type]} layerObj [description]
     */
    function addFavThematic(layerObj) {
        // console.log(layerObj);
        require(['modDir/user/userThematic'], function(userThematic) {
            userThematic.addThematic(layerObj);
        });
    };
    /**
     * 显示专题图详情
     */
    function getShowInfo(data){
        // console.log(data);
        var guid = data.guid;
        var ajaxUrl = onemapUrlConfig.thematicDataServerUrl+'/production/metadata?production_id='+guid;
        ONEMAP.V.loading.load();
        $.ajax({
            type:"get",
            dataType:'jsonp',
            url:ajaxUrl,
            success:function(data){
                ONEMAP.V.loading.loaded();
                //添加专题图信息到地图容器中
                addItemToContent(data.metadata);
                //console.log(data.metadata);
            },
            error:function(data){
                ONEMAP.V.loading.loaded();
                ONEMAP.C.publisher.publish({type:'error',message:'获取地图数据失败！'},'noteBar::add');
            }
        });
    };
    function addItemToContent(data){
        $('#atlasInfoDetail').show();
        var zIndex = ONEMAP.M.sideBar.getZIndex();
        $('#atlasInfoDetail').css({zIndex:zIndex});
        $('#atlasInfoDetail .cover-content').empty();
        $('<div class="close"></div>').appendTo($('#atlasInfoDetail .cover-content'));

        $('<h3>'+data.map_name+'</h3>').appendTo($('#atlasInfoDetail .cover-content'));
        
        $('<p>作者: '+data.author+'</p>').appendTo($('#atlasInfoDetail .cover-content'));

        $('<p>创建时间: '+data.created_time+'</p>').appendTo($('#atlasInfoDetail .cover-content'));

        $('<p>发布者: '+data.publisher+'</p>').appendTo($('#atlasInfoDetail .cover-content'));

        $('<p>发布时间: '+data.publication_date+'</p>').appendTo($('#atlasInfoDetail .cover-content'));

        $('<p>地图来源: '+data.original_atlas+'</p>').appendTo($('#atlasInfoDetail .cover-content'));

        $('<p>最小缩放等级: '+data.min_zoom_level+'</p>').appendTo($('#atlasInfoDetail .cover-content'));

        $('<p>最大缩放等级: '+data.max_zoom_level+'</p>').appendTo($('#atlasInfoDetail .cover-content'));

        //$('<p>瓦片格式: '+data.image_format+'</p>').appendTo($('#atlasInfoDetail .content'));

        //$('<p>瓦片质量: '+data.image_quality+'</p>').appendTo($('#atlasInfoDetail .content'));

        $('<p>地图宽度: '+data.map_image_width+'像素</p>').appendTo($('#atlasInfoDetail .cover-content'));

        $('<p>地图高度: '+data.map_image_height+'像素</p>').appendTo($('#atlasInfoDetail .cover-content'));

        if(data.coordinate_system == 0){data.coordinate_system = '无坐标图形'}
        $('<p>坐标系: '+data.coordinate_system+'</p>').appendTo($('#atlasInfoDetail .cover-content')); 
    }
    function addThematicToMap(data){
        // console.log(data);
        if(!status.showInfoData){
           status.showInfoData = true; 
           getShowInfo(data);
        }else{
            status.showInfoData = false; 
            $('#atlasInfoDetail').hide();
        }
        
    };
    /**
     * 获取专题图分类
     * @return {[type]} [description]
     */
    function getCategory(callback_func) {
        var ajaxUrl = onemapUrlConfig.thematicDataUrl + '/map/theme';
        ONEMAP.V.loading.load();
        $.ajax({
            url: ajaxUrl,
            type: 'GET',
            dataType: 'jsonp'
        })
        .done(function(data) {
            // //console.log(data);
            ONEMAP.V.loading.loaded();
            modValue.thematicCategory = data;
            callback_func(data);
        })
        .fail(function() {
            ONEMAP.V.loading.loaded();
        });
    };
    

    /**
     * 根据 options 参数获取 专题列表信息
     * @param callback_func {Function} 回调方法
     * @return {Object}
     */
    function byDefault(callback_func) {
        var ajaxUrl = onemapUrlConfig.thematicDataUrl + '/map/list' + '?types=[1,2,4]&page=' + modValue.options.page + '&pagesize=' + modValue.options.pageSize
         + '&region=' + modValue.options.region + '&area=' + modValue.options.area;
        if (modValue.options.theme != null && modValue.options.theme != 'undefined') {
            ajaxUrl += '&theme=' + modValue.options.theme;
        }
        var searchWord = $("#thematicSearchKey").val();
        if (searchWord != null && searchWord != 'undefined' && searchWord != '' && searchWord != '请输入名称') {
            ajaxUrl += '&search=' + searchWord;
        }
        ONEMAP.V.loading.load();
        $.ajax({
            url: ajaxUrl,
            type: 'GET',
            dataType: 'jsonp'
        })
        .done(function(data) {
            ONEMAP.V.loading.loaded();
            callback_func(data);
        })
        .fail(function() {
            ONEMAP.V.loading.loaded();
        });
    };

    /**
     * 关键字查询
     * @param keyword {String} 关键字
     * @param callback_func {Function} 回调方法
     * @return {Object}
     */
    function byKeyWord(keyword, callback_func) {
        var ajaxUrl = onemapUrlConfig.thematicDataUrl + '/map/list' + '?types=[1,2,4]&page=' + modValue.options.page + '&pagesize=' + modValue.options.pageSize
         + '&search=' + encodeURIComponent(keyword) + '&region=' + modValue.options.region + '&area=' + modValue.options.area;
        if (modValue.options.theme != null && modValue.options.theme != 'undefined') {
            ajaxUrl += '&theme=' + modValue.options.theme;
        }
        ONEMAP.V.loading.load();
        $.ajax({
            url: ajaxUrl,
            type: 'GET',
            dataType: 'jsonp'
        })
        .done(function(data) {
            ONEMAP.V.loading.loaded();
            callback_func(data);
        })
        .fail(function() {
            ONEMAP.V.loading.loaded();
        });
    };

    // 监听图层操作动作
    function layerAction(options){
        // console.log(options);
        if(options.action == "remove"){
            // console.log("remove");
            removeLayer(options.guid);
        }
        else if(options.action == "opacity"){
            var opt = options.options.opacity;
            setOpacity(options.guid,opt);
        }
        else if(options.action == "up" || options.action == "down"){
            ONEMAP.M.myLayerActions.changeFloor();
        }
    }

    // 更改层级
    function changeFloor(){
        
        var li = $("#layerControlMenu .myLayers .mn-content li");
        var layer = $("#mapHolder #map2DWrap .leaflet-layer");
        var liLength = li.length;
        var zidArr = new Array();
        for(var i=0;i<liLength;i++){
            zidArr.push(li.eq(i).attr("zid"));
            for(var j=0;j<layer.length;j++){
                if(layer.eq(j).attr("zid") == zidArr[i]){
                    layer.eq(j).css("z-index",layer.length-i);
                }
            }
        }
    }

    // 设置透明度
    function setOpacity(zid,opt){
        map23DControl.tileLayer({
            action: 'update',
            guid: zid,
            layer: { 
                opacity: opt
            }
        })
    }

    // 移除图层
    function removeLayer(data){
        if (data) {
            modValue.thematicControlHtml.remove();
            map23DControl.tileLayer({
                action: 'remove',
                guid: data
            })
            data = null;
            // map2DViewer.map.removeControl(overLayerOpacityControl);
            overLayerOpacityControl = null;
        }

        ONEMAP.D.overLayerCount--;
        // 恢复缩放范围
        if (ONEMAP.D.overLayerCount == 0) {
            map2DViewer.map.setZoomScope(1, 19);
        }
        ONEMAP.M.myLayerActions.checkLayerNull();
        // 移除选中状态
        $('#thematicResultsList li.select').removeClass('select');
    }

    // 更改层级
    function changeFloor(){
        var li = $("#layerControlMenu .myLayers .mn-content li");
        var layer = $("#mapHolder #map2DWrap .leaflet-layer");
        var liLength = li.length;
        var zidArr = new Array();
        for(var i=0;i<liLength;i++){
            zidArr.push(li.eq(i).attr("zid"));
            for(var j=0;j<layer.length;j++){
                if(layer.eq(j).attr("zid") == zidArr[i]){
                    layer.eq(j).css("z-index",layer.length-i);
                }
            }
        }
    }

    /**
     * 注册监听
     * @type {Function}
     */
    function subscribe() {
        // map2DViewer.map.on('layerOpacity:addFav', addFavThematic);
        ONEMAP.C.publisher.subscribe(removeCurrentOverLayer, 'cleanMap');
    };
    

    /**
     * 移除事件
     * @type {Function}
     */
    function remove() {
    }

    return ONEMAP.M.thematic = {
        init: init,
        addOverLayerToMap:addOverLayerToMap,
        removeCurrentOverLayer:removeCurrentOverLayer,
        thematicData:modValue
    };

});