TDataView_ui/scripts/mod/atlas/atlasSearch.js

/**
 * [ATLAS.M.atlasCategory]
 * @return {[object]}
 */
define(['html!templates/atlas/atlasCategory',
    'css!styles/atlas/atlasCategory'],
    function (tplLayout) {
        /**
         * 模块数据 用于数据存储和外部调用
         * @type {Object}
         */
        var modValue = {
            options: {
                type: 1,
                page: 1,
                pageSize: 20,
                searchWord: ''
            },
            //图集列表
            atlasCategoryData: null,
            domMarker: ""
        }
        // 模拟数据
        var mn_data = {
            "guid": "",
            "initial_zoom": 6,
            "center_lat": 31.0331660206555,
            "center_lon": 107.20230990329375,
            "max-zoom": 19,
            "min-zoom": 1,
            "zoom": 5,
            "name": ""
        }

        /**
         * 初始化并订阅事件
         * @return {[type]} [description]
         */
        function init(type, dataArr) {
            bindEvent();
            subscribe();
        }

        /**
         * 界面事件绑定
         * @return {[type]} [description]
         */
        function bindEvent() {
            //console.log("获取keyword："+ONEMAP.D.user.searchKeyWord);
            modValue.options.searchWord = ONEMAP.D.user.searchKeyWord;
            // 先获取单幅图的搜索结果
            getAtlasCategory();

            $("#placePanel .thematic-content .thematic-title li").unbind('click').bind('click', function () {
                if ($(this).text() == "单幅图") {
                    modValue.options.type = 1;
                    ONEMAP.D.user.searchType = modValue.options.type;
                    // getAtlasCategory();
                }
                else if ($(this).text() == "地图对") {
                    modValue.options.type = 2;
                    ONEMAP.D.user.searchType = modValue.options.type;
                }
                else if ($(this).text() == "系列图") {
                    modValue.options.type = 3;
                    ONEMAP.D.user.searchType = modValue.options.type;
                }
                else if ($(this).text() == "地图集") {
                    modValue.options.type = 4;
                    ONEMAP.D.user.searchType = modValue.options.type;
                }
                // modValue.options.type = parseInt($(this).index()) + 1;
                // ONEMAP.D.user.searchType = modValue.options.type;
                $("#placePanel .thematic-content li").removeClass('active');
                $(this).addClass("active");
                getAtlasCategory("li");
                // $("#placePanel .more a").click()
                // 
                // if(parseInt($("#openSTSideContent").css("right")) != 0){
                //     var idx = modValue.options.type;
                //     console.log(idx);
                //     if(idx == 1){
                //         ONEMAP.D.user.searchType = 1;
                //         require(['modDir/atlas/atlasList'], function(atlasList) {
                //             atlasList.init(101);
                //         });
                //     }
                //     else if(idx > 1 && idx < 5){
                //         ONEMAP.D.user.searchType = 2;
                //         require(['modDir/atlas/atlasList'], function(atlasList) {
                //             atlasList.init();
                //             require(['modDir/atlas/atlasCategory'], function(atlasCategory) {
                //                 ONEMAP.C.publisher.publish('handShow','layout::sideBar');
                //                 atlasCategory.init(idx,"search");
                //             });
                //         });
                //     }
                // }

                // var idx = modValue.options.type;
                // if(idx == 1){
                //     ONEMAP.D.user.searchType = 1;
                //     require(['modDir/atlas/atlasList'], function(atlasList) {
                //         atlasList.init(101);
                //     });
                // }
                // else if(idx > 1 && idx < 5){
                //         require(['modDir/atlas/atlasCategory'], function(atlasCategory) {
                //             ONEMAP.C.publisher.publish('handShow','layout::sideBar');
                //             atlasCategory.init(idx,"search");
                //         });
                // }
            })
        }

        /**
         * 界面重置
         * @return {[type]} [description]
         */
        function layoutResize() {
            var marginWidth = (parseInt($('#atlasList').width() - 10) % 308 / parseInt($('#atlasList').width() / 308) / 2);
            $('#atlasList li').css({ marginLeft: marginWidth, marginRight: marginWidth });

            $('.atlas-list').css({ height: $('body').height() - 190 });

            $(".atlas-list").mCustomScrollbar('update');
        }

        /**
         * 获取图集列表
         * @type {Function}
         * @private
         */
        function getAtlasCategory(option) {
            ONEMAP.V.loading.load();
            var ajaxUrl = onemapUrlConfig.thematicDataUrl +
                '/shelf/products?types=[' + modValue.options.type + ']' +
                '&page=' + modValue.options.page +
                '&pagesize=' + modValue.options.pageSize +
                '&search=' + encodeURIComponent(modValue.options.searchWord);
            // //console.log(ajaxUrl);
            $.ajax({
                type: "get",
                dataType: 'jsonp',
                url: ajaxUrl,
                success: function (data) {
                    ONEMAP.V.loading.loaded();
                    if (data.length > 0) {
                        // console.log(data);
                        if (data[0]['type'] === modValue.options.type) {
                            modValue.atlasCategoryData = data[0];
                            if (option == "li") {
                                setAtlasCategoryListXin();
                            } else {
                                setAtlasCategoryList();
                            }
                        }
                    } else {
                        ONEMAP.C.publisher.publish({ type: 'error', message: '获取图集列表数据失败！' }, 'noteBar::add');
                    }
                },
                error: function (data) {
                    ONEMAP.V.loading.loaded();
                    ONEMAP.C.publisher.publish({ type: 'error', message: '获取图集列表数据失败！' }, 'noteBar::add');
                }
            });
        }

        /**
         * 获取地图对信息并直接跳转地图对比
         * @private
         */
        function showCompare(aid) {
            ONEMAP.V.loading.load();
            var ajaxUrl = onemapUrlConfig.thematicDataUrl + '/production/product_category?' +
                'production_id=' + aid;
            var windowOpen = window.open();
            var atlasUrl = onemapUrlConfig.atlasLibraryUrl;
            var openUrl;
            var num = 0;

            $.ajax({
                type: "get",
                dataType: 'jsonp',
                url: ajaxUrl,
                success: function (data) {
                    ONEMAP.V.loading.loaded();
                    if (data.category.length > 1) {
                        openUrl = atlasUrl + '/atlasView.html?viewType=' + modValue.options.type +
                            '&left=' + data.category[0].list[0]['guid'] +
                            '&right=' + data.category[1].list[0]['guid'] +
                            '&serialize=' + ONEMAP.C.encryption.enCode(JSON.stringify(modValue.options));
                    } else {
                        openUrl = atlasUrl + '/atlasView.html?viewType=' + modValue.options.type +
                            '&left=' + data.category[0].list[0]['guid'] +
                            '&right=' + data.category[0].list[1]['guid'] +
                            '&serialize=' + ONEMAP.C.encryption.enCode(JSON.stringify(modValue.options));
                    }

                },
                error: function (data) {
                    ONEMAP.V.loading.loaded();
                    ONEMAP.C.publisher.publish({ type: 'error', message: '获取地图对数据失败！' }, 'noteBar::add');
                }
            });

            var utime = setInterval(function () {
                if (openUrl) {
                    windowOpen.location = openUrl;
                    clearInterval(utime);
                } else if (num > 20) {
                    windowOpen.close();
                    clearInterval(utime);
                }
                num++
            }, 200);
        }

        /**
         * 设置地图集列表
         * @type {Function}
         * @private
         */
        function setAtlasCategoryList() {
            // console.log("set list");
            // console.log(modValue.atlasCategoryData);
            // 去atlaslist里面查询zoom范围等信息

            // 查询单幅图
            require(['modDir/atlas/atlasList'], function (atlasList) {
                atlasList.init(102);
            });

            // 查询地图库
            require(['modDir/atlas/atlasCategory'], function (atlasCategory) {
                // ONEMAP.C.publisher.publish('handShow','layout::sideBar');
                atlasCategory.init(203, "search");
            });

            if (modValue.atlasCategoryData.products.length > 0) {
                $("#placePanel .thematic-content").show();

                var ul = $('<ul class="thematic-list"></ul>');
                // 取前三项
                var ul_three = $('<ul class="thematic-list"></ul>');
                $("#thematicCategoryList").hide();
                $.each(modValue.atlasCategoryData.products, function (index, val) {
                    // console.log(val);    //無坐標的product信息
                    var atlas = val;
                    var li = $('<li aid="' + atlas.guid + '" layer="' + atlas + '">' +
                        '<img src="' + onemapUrlConfig.thematicDataUrl + '/production/thumb?' +
                        'production_id=' + atlas.guid + '&thumb_id=' + atlas.thumb_min_id + '&v=' + onemapVersion + '"/>' +
                        '<span class="cover"></span><span class="name">' + atlas.name + '</span></li>');
                    li.appendTo(ul);
                    if (index < 3) {
                        var liC = li.clone();
                        liC.appendTo(ul_three);
                    }
                    // //console.log(ul_three);
                });
                $("#placePanel .thematic-content .thematic-title li").eq(modValue.options.type - 1).show();
                // console.log(modValue.options.type);
                // 将搜索结果的前三项插入到搜索面板下面 
                $("#placePanel .thematic-search-list").empty().append(ul_three);
                // ONEMAP.D.user.searchKeyWordAtlasResult = ul;

                $("#placePanel .thematic-list li").unbind('click').bind('click', function () {
                    $("#placePanel .thematic-list li").removeClass('li-select');
                    $(this).addClass('li-select');

                    //如果是地图对，直接进入对比阅读
                    if (modValue.options.type === 2) {
                        showCompare($(this).attr('aid'));
                    } else if (modValue.options.type === 1) {//进入单幅图
                        // console.log("asdfasdf");

                        ONEMAP.D.user.searchType = 1;


                        $("#thematicCategoryList").show();
                        // $(this).attr("load", 1);
                        modValue.domMarker = $(this);
                        mn_data.guid = $(this).attr('aid');
                        mn_data.name = $(this).find(".name").text();
                        // 添加图层
                        // console.log(ONEMAP.D.user.searchKeyWordAtlasResult);

                        var a = ONEMAP.D.user.searchKeyWordAtlasResult;
                        // console.log(a);
                        for (var i = 0; i < a.length; i++) {
                            if (mn_data.guid == a[i].guid) {
                                // 查重
                                var checkChongMing = ONEMAP.M.myLayerActions.checkChongMing(a[i].name);
                                var layerLength = ONEMAP.M.myLayers.checkLength();
                                if (checkChongMing && layerLength < map23DConfig.layerMaxLength) {
                                    addLayer(a[i]);
                                    // console.log("yes");
                                    var options = {
                                        action: "add",
                                        DOM: {
                                            guid: modValue.currentOverLayerGuid,
                                            type: "layer",
                                            name: mn_data.name
                                        },
                                        mod: "test",
                                        testLayerID: mn_data.guid
                                    }
                                    // 添加到我的图层
                                    ONEMAP.M.myLayers.myLayerControl(options);
                                    ONEMAP.D.overLayerCount++;
                                    // //console.log(options);
                                    ONEMAP.C.publisher.subscribe(layerAction, options.DOM.guid);
                                }
                                else {
                                    ONEMAP.C.publisher.publish({ type: 'warning', message: '图层已加载或图层数量已达上限' }, 'noteBar::add');
                                }
                            }
                        }
                        // addLayer(mn_data);



                    } else {//进入图集
                        showAtlas($(this).attr('aid'));
                    }
                })
                //（点击更多时再插入到侧边栏中）
                $("#placePanel .more a").unbind('click').bind('click', function () {
                    ONEMAP.D.panelMore = true;
                    var idx;
                    var li = $("#placePanel .thematic-title li");
                    for (var i = 0; i < li.length; i++) {
                        if (li.eq(i).hasClass("active")) {
                            idx = i + 1;
                        }
                    }
                    // //console.log(ONEMAP.D.user.searchKeyWordAtlasResult);
                    // var idx = modValue.options.type;
                    // console.log(idx);
                    if (idx == 1) {
                        ONEMAP.D.user.searchType = 1;
                        require(['modDir/atlas/atlasList'], function (atlasList) {
                            atlasList.init(101);
                        });
                    }
                    else if (idx > 1 && idx < 5) {
                        // ONEMAP.D.user.searchType = 2;
                        // require(['modDir/atlas/atlasList'], function(atlasList) {
                        // atlasList.init();
                        require(['modDir/atlas/atlasCategory'], function (atlasCategory) {
                            ONEMAP.C.publisher.publish('handShow', 'layout::sideBar');
                            atlasCategory.init(idx, "search");
                        });
                        // });
                    }
                })
                // $("#thematicResultsList .item-list").empty().append(ul);
                layoutResize();
            } else if (ONEMAP.C.ditukuSearchResult == true) {
                // console.log("dituku has sth.");
            }
            else {
                // console.log("empty");
                // ONEMAP.D.user.searchKeyWordAtlasResult = "";
                // $("#placePanel .thematic-search-list").empty();
                // $('<div id="noListData">地图库暂无此数据!</div>').appendTo($('#atlasList'));
                // $("#placePanel .thematic-search-list").empty().html("地图库暂无此数据");
                // ONEMAP.C.publisher.publish({type:'warning',message:'地图库暂无此数据！'},'noteBar::add');
                // $("#placePanel .thematic-content").hide();
            }
        }

        function setAtlasCategoryListXin() {

            if (modValue.atlasCategoryData.products.length > 0) {
                $("#placePanel .thematic-content").show();

                var ul = $('<ul class="thematic-list"></ul>');
                // 取前三项
                var ul_three = $('<ul class="thematic-list"></ul>');
                $("#thematicCategoryList").hide();
                $.each(modValue.atlasCategoryData.products, function (index, val) {
                    // console.log(val);    //無坐標的product信息
                    var atlas = val;
                    var li = $('<li aid="' + atlas.guid + '" layer="' + atlas + '">' +
                        '<img src="' + onemapUrlConfig.thematicDataUrl + '/production/thumb?' +
                        'production_id=' + atlas.guid + '&thumb_id=' + atlas.thumb_min_id + '&v=' + onemapVersion + '"/>' +
                        '<span class="cover"></span><span class="name">' + atlas.name + '</span></li>');
                    li.appendTo(ul);
                    if (index < 3) {
                        console.log(atlas)
                        var liC = li.clone();
                        liC.appendTo(ul_three);
                    }
                    // //console.log(ul_three);
                });
                $("#placePanel .thematic-content .thematic-title li").eq(modValue.options.type - 1).show();
                // console.log(modValue.options.type);
                // 将搜索结果的前三项插入到搜索面板下面 
                $("#placePanel .thematic-search-list").empty().append(ul_three);
                // ONEMAP.D.user.searchKeyWordAtlasResult = ul;

                $("#placePanel .thematic-list li").unbind('click').bind('click', function () {
                    $("#placePanel .thematic-list li").removeClass('li-select');
                    $(this).addClass('li-select');

                    //如果是地图对，直接进入对比阅读
                    if (modValue.options.type === 2) {
                        showCompare($(this).attr('aid'));
                    } else if (modValue.options.type === 1) {//进入单幅图
                        // console.log("asdfasdf");

                        ONEMAP.D.user.searchType = 1;


                        $("#thematicCategoryList").show();
                        // $(this).attr("load", 1);
                        modValue.domMarker = $(this);
                        mn_data.guid = $(this).attr('aid');
                        mn_data.name = $(this).find(".name").text();
                        // 添加图层
                        // console.log(ONEMAP.D.user.searchKeyWordAtlasResult);

                        var a = ONEMAP.D.user.searchKeyWordAtlasResult;
                        // console.log(a);
                        for (var i = 0; i < a.length; i++) {
                            if (mn_data.guid == a[i].guid) {
                                // 查重
                                var checkChongMing = ONEMAP.M.myLayerActions.checkChongMing(a[i].name);
                                var layerLength = ONEMAP.M.myLayers.checkLength();
                                if (checkChongMing && layerLength < map23DConfig.layerMaxLength) {
                                    addLayer(a[i]);
                                    // console.log("yes");
                                    var options = {
                                        action: "add",
                                        DOM: {
                                            guid: modValue.currentOverLayerGuid,
                                            type: "layer",
                                            name: mn_data.name
                                        },
                                        mod: "test",
                                        testLayerID: mn_data.guid,
                                        layerData: mn_data
                                    }
                                    // 添加到我的图层
                                    ONEMAP.M.myLayers.myLayerControl(options);
                                    ONEMAP.D.overLayerCount++;
                                    // //console.log(options);
                                    ONEMAP.C.publisher.subscribe(layerAction, options.DOM.guid);
                                }
                                else if (!checkChongMing) {
                                    ONEMAP.C.publisher.publish({ type: 'warning', message: '图层已加载' }, 'noteBar::add');

                                    // 判断图层控制是否显示
                                    if (!$("#layerControlMenu").hasClass("bl")) {
                                        $("#layerControlMenu").addClass("bl");
                                        // $("#layerControlMenu .myLayers").addClass("active");
                                    }
                                    if (parseInt($("#layerControlMenu").css("left")) < 0) {
                                        $("#layerControlMenu").css("left", "0");
                                    }
                                    break;
                                }
                                else {
                                    ONEMAP.C.publisher.publish({ type: 'warning', message: '图层数量已达上限' }, 'noteBar::add');
                                }
                            }
                        }
                    } else {//进入图集
                        showAtlas($(this).attr('aid'));
                    }
                })
                //（点击更多时再插入到侧边栏中）
                $("#placePanel .more a").unbind('click').bind('click', function () {
                    ONEMAP.D.panelMore = true;
                    var idx;
                    var li = $("#placePanel .thematic-title li");
                    for (var i = 0; i < li.length; i++) {
                        if (li.eq(i).hasClass("active")) {
                            idx = i + 1;
                        }
                    }
                    if (idx == 1) {
                        ONEMAP.D.user.searchType = 1;
                        require(['modDir/atlas/atlasList'], function (atlasList) {
                            atlasList.init(101);
                        });
                    }
                    else if (idx > 1 && idx < 5) {
                        require(['modDir/atlas/atlasCategory'], function (atlasCategory) {
                            ONEMAP.C.publisher.publish('handShow', 'layout::sideBar');
                            atlasCategory.init(idx, "search");
                        });
                    }
                })

                if (ONEMAP.D.panelMore) {
                    $("#placePanel .more a").click();
                }
                layoutResize();
            } else if (ONEMAP.C.ditukuSearchResult == true) {
            }
        }

        function showAtlas(aid) {
            var atlasUrl = onemapUrlConfig.atlasLibraryUrl;
            var windowOpen = window.open();
            var openUrl = atlasUrl + '/atlasView.html?viewType=' + modValue.options.type + '&' +
                'productionId=' + aid + '&serialize=' + ONEMAP.C.encryption.enCode(JSON.stringify(modValue.options));
            windowOpen.location = openUrl;
        }


        // 添加图层
        function addLayer(data) {
            //添加到23D地图上
            modValue.currentOverLayerGuid = map23DControl.tileLayer({
                action: 'add',
                layer: {
                    url2D: onemapUrlConfig.thematicTileUrl + '/' + data.guid + '?l={z}&x={x}&y={y}',
                    url3D: onemapUrlConfig.thematicTileFo3DUrl + '/' + data.guid + '?z=%d&x=%d&y=%d',
                    minZoom: data['min_zoom'],
                    maxZoom: data['max_zoom'],
                    maxNativeZoom: data['max_zoom'],
                    attribution: '',
                    opacity: 1,
                    imageType: 'png',
                    name: data.name,
                    guid: data.guid
                }
            })

            map2DViewer.map.setZoomScope(data['min_zoom'], data['max_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);
            }

            map23DControl.setView({
                // center: {
                //     lat: data['center_lat'],
                //     lng: data['center_lon']
                // },
                zoom: data['initial_zoom']
            })

        }

        // 监听图层操作动作
        function layerAction(options) {
            //console.log(options);
            //console.log(modValue.ids);
            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 removeLayer(data) {
            // modValue.domMarker.attr("load",0);
            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);
            }
        }

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

        // 更改层级
        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}
         * 推送：ATLAS.C.publisher.publish(options,'atlasCategory::type');
         * 订阅：ATLAS.C.publisher.subscribe(layoutResize,'sideBarLayoutChange');
         */
        function subscribe() {
            ONEMAP.C.publisher.subscribe(function () {
                map.invalidateSize();
            }, 'atlasView::layoutResize');
        }

        /**
         * 取消订阅
         * @type {Function}
         * 取消订阅：ATLAS.C.publisher.unSubscribe(layoutResize,'sideBarLayoutChange');
         */
        function unSubscribe() { }

        /**
         * 模块移除
         * @return {[type]} [description]
         */
        function remove() {

            //取消订阅
            //unSubscribe();
        }

        return ONEMAP.M.atlasCategory = {
            init: init,
            layoutResize: layoutResize
        }
    });