TDataView_ui/scripts/layout/leadorStreetView.js

/**
 * [ONEMAP.M.mod]
 * @return {[object]}
 */
define(['html!templates/leadorStreetView',
    'css!styles/leadorStreetView'],
function(tplLayout){

    /**
     * 模块数据 用于数据存储和外部调用
     * @type {Object} 
     * 数据存放
     */
    var modValue = { 
        /**
         * 默认配置信息
         * @type {Object}
         * @default
         * {
         *     stationID:0, //地点id
         *     yaw:0, //视角
         *     pitch:0
         * }
         */
        options:{
            stationID:0,
            yaw:0,
            pitch:0
        },
        /**
         * 当前的地点坐标
         * @type {Object}
         * @default {}
         * @private
         */
        currentPoint:{},
        /**
         * 需要添加的新坐标
         * @type {Object}
         * @default {}
         * @private
         */
        beAddPoint:{},
        //图层
        featureGroup:null,
        mapBound:null
    };

    /**
     * 模块界面样式 例如：宽，高
     * @type {Object}
     */
    var styles = {};

    /**
     * 模块状态，用于存储模块的状态 例如：收起，关闭
     * @type {Object}
     */
    var status = {
        initialized:false
    };

    /**
     * 查询参数
     * @type {Object}
     */
    var options = {};
    
    /**
     * 初始化并订阅事件
     * @return {[type]} [description]
     */
    function init(){
        if(!status.initialized){
            status.initialized = true;
            setLayout();
            subscribe();
        }
        
    }

    /**
     * 设置界面
     */
    function setLayout(){
        $('body').append(tplLayout);
        setTimeout(function(){
             buildLeadorSwf();
        },1000);
        modValue.featureGroup = map23DControl.group({
                                    action: 'add'
                                });
        bindEvent();
        getCurrentAreaData();
        $(window).resize(function() {
            layoutResize();
        });
    }

    /**
     * 创建路径swf
     */
    function buildLeadorSwf(){
        var flashPlayerInfo = flashChecker();
        if(flashPlayerInfo && flashPlayerInfo.v > 10){
            /** 配置 **/
            var more = {};
            more.flashvars = {};
            LeadorStreetView.useHash = false;
            /** 设置服务信息 **/
            more.flashvars.TrueVisionSeverUrl = onemapUrlConfig.leadorStreetBaseUrl;
            more.flashvars.Port = onemapUrlConfig.leadorStreetPort;
            more.flashvars.DataName = onemapUrlConfig.leadorStreetDataName;
            more.flashvars.TrueVisionImageUrl = onemapUrlConfig.leadorStreetImageUrl;
            more.flashvars.UIUrl = map23DConfig.map23DAssetsUrl+"/scripts/vendor/leadorStreet/IShowChinaTVUIBJ.swf";
            more.flashvars.LogoUrl = map23DConfig.map23DAssetsUrl+"/scripts/vendor/leadorStreet/ld-logo.png";
            /** 绑定DIV **/
            LeadorStreetView.bindingDIV("leadorStreetPointViewSwf",null,more);

            LeadorStreetView.showFullScreenUI(false);

        }else {
            if(document.all){
                var flashPlayerLink = map23DConfig.map23DAssetsUrl+"/soft/flashplayer_winax.exe";
            }else {
                var flashPlayerLink = map23DConfig.map23DAssetsUrl+"/soft/flashplayer_win.exe";
            }
            var installFlashHtml = '<div class="install-flash-player">' +
                    '<p><strong>请安装Adobe flash player 11以上版本的播放器。</strong></p>' +
                    '<a href="'+flashPlayerLink+'"><img src="'+onemapUrlConfig.siteUrl+'/images/layout/get_flash.png"/><span>Adobe Flash Player 11</span></a>' +
                    '</div>';
            document.getElementById('leadorStreetPointViewSwf').innerHTML = installFlashHtml;
        }          
    };
    /**
     * 检查flash
     */
    function flashChecker(){
        var hasFlash = 0;
        var flashVersion =0;
        try{
            if(document.all){
                var swf = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
                if(swf){
                    hasFlash = 1;
                    VSwf = swf.GetVariable('$version');
                    flashVersion = parseInt(VSwf.split(" ")[1].split(",")[0]);
                }
            }else {
                if(navigator.plugins && navigator.plugins.length > 0){
                    var swf = navigator.plugins["Shockwave Flash"];
                }
                if(swf){
                    hasFlash = 1;
                    var words = swf.description.split(" ");
                    for(var i=0;i<words.length; i++){
                        if(isNaN(parseInt(words[i]))) continue;
                        flashVersion = parseInt(words[i]);
                    }
                }
            }
        }catch (e) {
        }

        return {
            f:hasFlash,
            v:flashVersion
        };
    };
    /**
     * 获取当前区域的定点数据信息
     * @type {Function}
     * @private
     */ 
    function getCurrentAreaData(option){
        if(!status.initialized){
            $('body').append(tplLayout);
            setTimeout(function(){
                 buildLeadorSwf();
            },1000);
            modValue.featureGroup = map23DControl.group({
                                        action: 'add'
                                    });
            bindEvent();
            status.initialized = true;
        }
        //modValue.featureGroup.clearLayers();
        if(option==='hide'){
            map23DControl.group({
                action:'cleanAll',
                guid:modValue.featureGroup
            })
            modValue.currentPoint = null;
            modValue.currentPoint = {};
            return false;
        }
        if(map2DViewer.hide2D){
            var mapZoom = map23DData.view.zoom;
        }else{
            var mapZoom = map2DViewer.map.getZoom();
        }
        //性能优化 小于14的比例图下不显示
        
        if(mapZoom < 14){
            map23DControl.group({
                action:'cleanAll',
                guid:modValue.featureGroup
            })
            modValue.currentPoint = null;
            modValue.currentPoint = {};
            return false;
        }
        modValue.mapBound = map2DViewer.map.getBounds();

        for(var oldPoint in modValue.featureGroup._layers){
            if(!modValue.mapBound.contains(modValue.featureGroup._layers[oldPoint]._latlng)){
                delete modValue._currentPoint[modValue.featureGroup._layers[oldPoint].pId];
                modValue.featureGroup.removeLayer(modValue.featureGroup._layers[oldPoint]);
            }
        }

        $.ajax({
            type:"get",
            dataType:'jsonp',
            jsonp:'callback',
            url:onemapUrlConfig.leadorStreetPointUrl+'/panoramic_data/?lat_lt='+modValue.mapBound.getNorthWest().lat+'&lon_lt='+modValue.mapBound.getNorthWest().lng+'&lat_rb='+modValue.mapBound.getSouthEast().lat+'&lon_rb='+modValue.mapBound.getSouthEast().lng,
            beforeSend:ONEMAP.V.loading.load(),
            success:function(data){
                modValue.beAddPoint = {};
                for(var i = 0,l = data.data.length; i<l;i++){
                    var pointInfo = data.data[i];
                    if(modValue.mapBound.contains(L.latLng(pointInfo.lat,pointInfo.lon))){
                        if(!modValue.currentPoint.hasOwnProperty(pointInfo.StationID)){
                            modValue.beAddPoint[pointInfo.StationID] = pointInfo;
                        }
                        modValue.currentPoint[pointInfo.StationID] = pointInfo;
                    }
                }
                setPointMarker();
            },
            completer:ONEMAP.V.loading.loaded()
        });           
    };
    /**
     * 在地图上显示当前区域的实景点
     * @type {Function}
     * @private
     */
    function setPointMarker(){
       
        for(var point in modValue.beAddPoint){
            var guid = map23DControl.buildGuid('sjmarker23D');
            var guid = map23DControl.marker({
                action:'add',
                guid:guid,
                groupId:modValue.featureGroup,
                geojson:{
                    "properties":{
                        title:modValue.beAddPoint[point].Address,
                        iconUrl: map23DConfig.map23DAssetsUrl+'/images/layout/marker-panoramic.png',
                        iconSize: [28, 30],
                        iconAnchor: [14, 30],
                        popupAnchor: [28, -30]
                    },
                    "geometry":{
                        "coordinates":[modValue.beAddPoint[point].lon-0.0063,modValue.beAddPoint[point].lat-0.0014]
                    }
                }
            })
            map23DData.markers[guid].pId = point;
            map2DViewer.markers[guid].on('click',function(e){
                    var curMarkerData = map23DData.markers[e.target.guid];
                    loadStreetView({stationID:curMarkerData.pId,yaw:"280",pitch:"15",address:this.address});
            })
            map2DViewer.markers[guid].on('onmouseover',function(){

            })
        }
    };
    /**
     * 设置模态窗口的大小和显示内容
     * @type {Function}
     * @param options {Object} 参数 {stationID,yaw,pitch}
     */
    function loadStreetView(options){
        modValue.options.stationID = options.stationID;
        modValue.options.yaw = options.yaw;
        modValue.options.pitch = options.pitch;

        $("#leadorStreetPointViewModal").css({width:$("#mapHolder").width(),height:$("#mapHolder").height()})
        $("#leadorStreetPointViewModal .modal-body").css({height:$("#mapHolder").height()-80});
        $("#leadorStreetPointViewModal").show();
        setTimeout(function(){
            LeadorStreetView.loadStreetViewByID(modValue.options.stationID);
            LeadorStreetView.setStreetViewAngle({yaw: modValue.options.yaw, pitch: modValue.options.pitch});
        },300);
    };
    /**
     * 界面事件绑定
     * @return {[type]} [description]
     */
    function bindEvent(){
        $("#leadorStreetPointViewModal .btn.close").bind('click',function(){
            $("#leadorStreetPointViewModal").hide();
        });
    }

    /**
     * 界面重置
     * @return {[type]} [description]
     */
    function layoutResize(){
        $("#leadorStreetPointViewModal").css({width:$("#mapHolder").width(),height:$("#mapHolder").height()})
        $("#leadorStreetPointViewModal .modal-body").css({height:$("#mapHolder").height()-80});
    }
    
    /**
     * 注册订阅
     * @type {Function}
     * 推送：ONEMAP.C.publisher.publish(options,'moduleName::type');
     * 订阅：ONEMAP.C.publisher.subscribe(layoutResize,'sideBarLayoutChange');
     */
    function subscribe(){ 
        ONEMAP.C.publisher.subscribe(getCurrentAreaData, 'pointShijing');
        ONEMAP.C.publisher.subscribe(remove, 'cleanMap');
        map2DViewer.map.on('leadorStreetView:on',remove);
        map2DViewer.map.on('leadorStreetView:off',getCurrentAreaData);
        PubSub.subscribe('map3D.featureClick',function(msg,options){
            if(options.feature.name.split('_')[0] == 'sjmarker23D'){
                markerData = map23DData.markers[options.feature.name];
                loadStreetView({stationID:markerData.pId,yaw:"280",pitch:"15",address:markerData.geojson.properties
.title});
            }
        })
    }
    /**
     * 监听数据推送
     * @type {Function}
     */
    function publish() {
        //推送
        map2DViewer.map.fire('leadorStreetViewPoint:on');

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

    /**
     * 模块移除
     * @return {[type]} [description]
     */
    function remove(){
        if(status.initialized){
            unSubscribe();
            modValue.currentPoint = null;
            modValue.beAddPoint = null;
            map23DControl.group({
                action:'remove',
                guid:modValue.featureGroup
            })
            ONEMAP.C.publisher.publish('',
                'leadorStreetViewOff'
            );
            modValue.currentPoint = {};
            modValue.beAddPoint = {};
            LeadorStreetView.removeBinding();
            $("#leadorStreetPointViewModal").remove();
            status.initialized = false;
            map2DViewer.map.fire('leadorStreetViewPoint:off');
        }
        //取消订阅
        unSubscribe();
    }


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