jsgkj/znjg/trunk/WebContent/js/zygl/gis.anchored.js

var gis = gis || {};
gis.anchored = function() {
	
};

var framedCloud;

var popuptableShowConfig={};
//泊位信息
popuptableShowConfig.queryPopupBWById={"BodyConfig":[{"attrname":"BWMC","tdStyle":"width:25%","title":"泊位名称","valtdStyle":"width:25%"},{"attrname":"BWDM","tdStyle":"width:25%","title":"泊位代码","valtdStyle":"width:25%"},{"attrname":"BWZYYTTEXT","tdStyle":"width:25%","title":"泊位主要用途","valtdStyle":"width:25%"},{"attrname":"SSJYR","tdStyle":"width:25%","title":"港口企业或码头单位","valtdStyle":"width:25%"},{"attrname":"SJKPNL","title":"设计靠泊能力（吨级）"},{"attrname":"BWCD","title":"泊位长度（米）"},{"attrname":"QYSJSH","title":"前沿设计水深（米）"},{"attrname":"QYSJSS","title":"前沿实际水深（米）"},{"attrname":"SFWXPBWTEXT","title":"是否危险品泊位"},{"attrname":"SFDWKFBWTEXT","title":"是否对外开放泊位"},{"attrname":"NHWTGNL","title":"货物设计年综合通过能力（万吨）"},{"attrname":"NJZXTGNL","title":"集装箱设计年综合通过能力（万TEU）"},{"attrname":"BWFWLXTEXT","title":"泊位服务类型"},{"attrname":"BWSXTEXT","title":"泊位属性"},{"attrname":"SCLXTEXT","title":"生产类型"},{"attrname":"TCNF","title":"投产年份"},{"attrname":"BWSZSYTEXT","title":"泊位所在水系"},{"attrname":"GKSBSL","tdFunction":{"changelessParameter":["queryGKSBZYXX.html"],"function":"showMesg","functionParameter":["ID"]},"title":"48小时内港口申报作业笔数"},{"attrname":"HSSBZY","tdFunction":{"changelessParameter":["queryDRHSSB.html"],"function":"showMesg","functionParameter":["BWDM"]},"title":"48小时内海事申报作业笔数"},{"attrname":"CBTKCCS","tdFunction":{"changelessParameter":["queryDRTKCB.html"],"function":"showMesg","functionParameter":["ID"]},"title":"48小时内船舶停靠船次数"}],"BodyConfigType":"3","verticalNumber":2,"Title":"泊位信息"}
//锚地信息
popuptableShowConfig.queryPopupMDById={"BodyConfig":[{"attrname":"MDMC","tdStyle":"width:50%","title":"锚地名称","valtdStyle":"width:50%"},{"attrname":"MDCD","title":"锚地长度（米）"},{"attrname":"MDKD","title":"锚地宽度（米）"},{"attrname":"MDSS","title":"锚地水深（米）"},{"attrname":"MDMJ","title":"锚地面积（平方米）"},{"attrname":"XBNL","title":"系泊能力（吨级）"}],"BodyConfigType":"3","verticalNumber":1,"Title":"锚地信息"}

	
gis.anchored.popup = function(lonlat,data){
	//alert(JSON.stringify(data));
	//alert(gis.anchored.tohtml(data));
	/*
	data={popupBorder:"1px solid #A5AAB4",width:320,height:155,title:"专题",
			style:["width:30%","text-align:center;"],
			data:[['港口名称','南京港'],['港区个数','2'],['锚地个数','2'],['作业区个数','16']]};
	*/
	var chicken=$('#chicken');
	chicken.remove();
	
	data=gis.anchored.portinfo({portName:'南京港',portNumber:2,anchorageNumber:2,chanceNumber:16})
    var popup = new SuperMap.Popup.Anchored(
            "chicken",
            lonlat,
            new SuperMap.Size(data.width,data.height),
            gis.anchored.tohtml(data),
            null,
            true,
            null
    );

    popup.setBorder(data.popupBorder||"0px solid #A5AAB4");
    //popup.updateSize();
    //chicken_contentDiv
    popup.extdataheight=data.height;
    
    return popup;
}



gis.anchored.tohtml2 = function(data){
	//alert(JSON.stringify(data));
	//$("<div id='popupWin'></div>").addClass("popupWindow").appendTo($("#result"));
	var html=new Array();
	var nvlval='';
	if(data){
		if(data.title){
			
			html.push("<div class='titleClass'>");
			html.push(data.title);
			html.push("</div>");
		}
		
		if(data.data){
			//html.push("<div class='tableClass' style='width: 335px; height: 115px; position: relative;border:1px solid #A5AAB4;overflow:auto;'>");
			html.push("<div class='tabledivClass'>");
			//html.push(data.title);html.push("<br>");
			html.push("<table class='altrowstable'>");
			for(var i=0;i<data.data.length;i++){
				var o=data.data[i];
				
				html.push("<tr>");
				for(var j=0;j<o.length;j++){
					html.push("<td style='"+(data.style[j]||nvlval)+"'>");
					html.push(o[j]);
					html.push("</td>");
				}
				html.push("</tr>");
			}
			html.push("</table>");
			html.push("</div>");
		}	
			
		
	}
	//alert(html.join(""));
	return html.join("");
}


gis.anchored.jsonConfigToHtml = function(data,jsonorhtml){
	//alert(typeof(jsonorhtml));
	if(popuptableShowConfig&&
			data&&data.tconfig&&gis.script.isNotBlank(data.tconfig)){
		//alert(typeof(jsonorhtml)=="object");
		if(typeof(jsonorhtml)=="object"&&jsonorhtml){
			var configdata=popuptableShowConfig[data.tconfig];
			if(configdata){
				var html=new Array();
				
				if(configdata.Title){
					
					html.push("<div class='titleClass'>");
					html.push(configdata.Title);
					html.push("</div>");
				}	
				
				//configdata.verticalNumber=2;
				//jsonorhtml.x="12345";
				if(configdata.verticalNumber&&
						configdata.BodyConfig&&configdata.BodyConfig.length){
					//html.push("<div class='tableClass' style='width: 335px; height: 115px; position: relative;border:1px solid #A5AAB4;overflow:auto;'>");
					html.push("<div class='tabledivClass'>");
					//html.push(data.title);html.push("<br>");
					html.push("<table class='altrowstable'>");
					//console.log(configdata)
					for(var i=0;i<configdata.BodyConfig.length;i++){
						var cinfo=configdata.BodyConfig[i];
						var tval="";
						if(i%configdata.verticalNumber==0){
							html.push("<tr>");
						}
						//html.push("<td>A"+i+"</td>");html.push("<td>B"+i+"</td>");
						html.push("<td "+(cinfo.tdStyle?" style='"+cinfo.tdStyle+";' ":"")+">");
						html.push(cinfo.title);
						html.push("</td>");
						
						if(gis.script.isNotBlank(jsonorhtml[cinfo.attrname])){
							tval=jsonorhtml[cinfo.attrname];
						}
						
						var tdFunction =cinfo.tdFunction;
						var click="";
						if(tdFunction&&gis.script.isNotBlank(tdFunction['function'])){
							var args=[];
							//alert(tdFunction['function']);
							if(tdFunction.functionParameter&&tdFunction.functionParameter.length){
								for(var jj=0;jj<tdFunction.functionParameter.length;jj++){
									//console.log(listEntity[i]);console.log(functionParameter[jj]);
									var parameterVal=jsonorhtml[tdFunction.functionParameter[jj]];
									if(parameterVal!=null){
										args.push("unescape('"+escape(parameterVal)+"')");
									}else{
										args.push("''");
									}
									
								}								
							}
							if(tdFunction.changelessParameter&&tdFunction.changelessParameter.length){
								for(var jk=0;jk<tdFunction.changelessParameter.length;jk++){
									var parameterVal=tdFunction.changelessParameter[jk];
									if(parameterVal!=null){
										args.push("unescape('"+escape(parameterVal)+"')");
									}
									
								}								
							}
							
							click="onclick="+tdFunction['function']+'('+args.join(",")+")";
							//console.log(click);
						}
						
						/*
						html.push("<td "+(cinfo.valtdStyle?" style='"+cinfo.valtdStyle+";' ":" ")+
								click+">");
						*/
						html.push("<td "+(cinfo.valtdStyle?" style='"+cinfo.valtdStyle+";' ":" ")+" >");
						if(gis.script.isNotBlank(click)){
							html.push("<a "+click+">");
							html.push(tval);
							html.push("</a>");
						}else{
							html.push(tval);
						}
						
						html.push("</td>");
						
						if(i%configdata.verticalNumber==configdata.verticalNumber-1){
							html.push("</tr>");
						}
					}
					
					if(configdata.verticalNumber>1&&(configdata.BodyConfig.length%configdata.verticalNumber!=0)){
						//console.log(configdata.BodyConfig.length,configdata.verticalNumber);
						//console.log("-----------"+configdata.BodyConfig.length%configdata.verticalNumber);
						var tdforval=configdata.verticalNumber-configdata.BodyConfig.length%configdata.verticalNumber;
						for(var ii=0;ii<tdforval;ii++){
							html.push("<td></td>");html.push("<td></td>");
						}
					}
					
					html.push("</table>");
					html.push("</div>");
				}					
				
				//console.log(html.join(""));
				return html.join("");				
			}
			
		}
	}
	return jsonorhtml;
}

/*
 * 弹出框显示，并且控制显示位置
 */
gis.anchored.popupHtml = function(lonlat,data,toHtml,e){
	toHtml=gis.anchored.jsonConfigToHtml(data,toHtml);
	var chicken=$('#chicken');
	chicken.remove();
	var popup;
	if(e){
		//console.log("event",e);
		
		//e.clientX,e.clientY
		if(gis.script.isNum(e.clientX)&&gis.script.isNum(e.clientY)){
			//alert(treedivWidth);
			var twidth=treedivWidth||0;
			var clientx=e.clientX-twidth;
			var clienty=e.clientY;
			
			//alert((clientx+data.width+25)+"=="+$("#bgrounddiv").width())
			
			if((clienty+data.height+25)>$("#bgrounddiv").height()){
				//alert((clienty+data.height)+"--"+$("#bgrounddiv").height())
				if((clientx+data.width+25)>$("#bgrounddiv").width()){
					lonlat=   map.getLonLatFromPixel(new SuperMap.Pixel(clientx-(data.width+32),clienty-(data.height)));
					toHtml=toHtml+'<div id="chicken_zxj" class="smPopupzxjBox" style="width: 20px; height: 24px; position: absolute;right:-19px;top:'+(data.height-28)+'px;"></div>';
				}else{
					lonlat=   map.getLonLatFromPixel(new SuperMap.Pixel(clientx+20,clienty-(data.height)));
					toHtml=toHtml+'<div id="chicken_yxj" class="smPopupyxjBox" style="width: 20px; height: 24px; position: absolute;left:-19px;top:'+(data.height-28)+'px;"></div>';					
				}
			
			}else{
				if((clientx+data.width+25)>$("#bgrounddiv").width()){
					lonlat=   map.getLonLatFromPixel(new SuperMap.Pixel(clientx-(data.width+32),clienty-28));
					toHtml=toHtml+'<div id="chicken_zsj" class="smPopupzsjBox" style="width: 20px; height: 24px; position: absolute;right:-19px;top:28px;"></div>';
				}else{
					lonlat=   map.getLonLatFromPixel(new SuperMap.Pixel(clientx+20,clienty-28));
					toHtml=toHtml+'<div id="chicken_ysj" class="smPopupysjBox" style="width: 20px; height: 24px; position: absolute;left:-19px;top:28px;"></div>';					
				}
			
			}
			
			
			
		    popup = new SuperMap.Popup(
		            "chicken",
		            lonlat,
		            new SuperMap.Size(data.width,data.height),
		            toHtml,
		            true,
		            null

		    );				
			
			
			/*
			lonlat=   map.getLonLatFromPixel(new SuperMap.Pixel(e.clientX-twidth+20,e.clientY-28));
			toHtml=toHtml+'<div id="chicken_ysj" class="smPopupysjBox" style="width: 20px; height: 24px; position: absolute;left:-20px;top: 28px;"></div>'
		    var popup = new SuperMap.Popup(
		            "chicken",
		            lonlat,
		            new SuperMap.Size(data.width,data.height),
		            toHtml,
		            true,
		            null

		    );
		    */
			
		}
		
	}/*else{
	    popup = new SuperMap.Popup.Anchored(
	            "chicken",
	            lonlat,
	            new SuperMap.Size(data.width,data.height),
	            toHtml,
	            null,
	            true,
	            null
	    );		
	}*/
	
	if(!popup){
	    popup = new SuperMap.Popup.Anchored(
	            "chicken",
	            lonlat,
	            new SuperMap.Size(data.width,data.height),
	            toHtml,
	            null,
	            true,
	            null
	    );		
	}
	
    
    popup.setBorder(data.popupBorder||"1px solid #A5AAB4");
    //popup.updateSize();
    //chicken_contentDiv
    popup.extdataheight=data.height;
    
    return popup;
}

/*
 * 根据参数设置弹出框，以及显示数据的（表格）样式
 */
gis.anchored.addPopup = function(map,popup,feature){
    map.addPopup(popup);
    //$('#chicken_close').css("display","none");

    var contentDiv=$('#chicken_contentDiv');
    //alert($('#chicken_GroupDiv').width());//overflow:visible
    contentDiv.css("overflow","visible");
    //contentDiv.css("position","absolute");
    //contentDiv.css("border","1px solid #A5AAB4");
    contentDiv.css("width",$('#chicken_GroupDiv').width());//alert(contentDiv.width());
    //alert(contentDiv.width()+"**"+$('#chicken_GroupDiv').width());

    
    
    var tableDiv=$('.tabledivClass');
    //alert($('.titleClass').height());
    //tableDiv.css("height",tableDiv.height());
    tableDiv.css("height",popup.extdataheight-26);
    //tableDiv.css("width",contentDiv.width());
    /*
    if($.support&&$.support.leadingWhitespace&&contentDiv.width()==$('#chicken_GroupDiv').width()){
   	 	contentDiv.css("width",$('#chicken_GroupDiv').width()-12);
   	 	//tableDiv.css("height",tableDiv.height()-26);
    }
    */

    
    $('.smPopupCloseBox').css("top",5);
    $('.smPopupCloseBox').css("right",5);
    
    /*
    $.each($(".altrowstable"), function(i,val){      
    	gis.anchored.tableBeautify.call(this,"#fff","#F5F5F5","#FFFFCC")
	}); 
	*/ 
    
    if(feature
    		&&gis.script.isNotBlank(feature.attributes.labelfieldid)){
    	var titleName=feature.attributes[feature.attributes.labelfieldid];
    	var titleClassDiv=$('.titleClass');
    	if(titleClassDiv&&!gis.script.isBlank(titleName)){
    		
    		titleClassDiv.html(gis.anchored.titleEllipsis(titleName,20));
    	}
    }
    
    /*
    if(feature
    		&&gis.script.isNotBlank(feature.attributes.labelfieldid)
    		&&gis.script.isNotBlank(feature.attributes[feature.attributes.labelfieldid])){
    	//console.log("feature",feature);
        var titleClassDiv=$('.titleClass');
        titleClassDiv.html(feature.attributes[feature.attributes.labelfieldid]); 

    }
	*/
    
    $.each($(".altrowstable"), function(i,val){      
    	gis.anchored.tableBeautify2.call(this);
	});
}

gis.anchored.titleEllipsis = function(tname,tlength){
	try{
		if(!gis.script.isBlank(tname)&&gis.script.isNum(tlength)&&tname.length
				&&tlength>0&&tname.length>tlength){
			tname=tname.substring(0,tlength)+'...';
		}		
	}catch(e){}

	return tname;
}

/*
 * 
 */
gis.anchored.addFramedCloud = function(lonlat,size,contentHTML){
	if(framedCloud){
		try{
			framedCloud.hide();
			framedCloud.destroy();
        }
        catch(e){}

	}
	//初始化FramedCloud类
	framedCloud = new SuperMap.Popup.FramedCloud(
	    "chicken", 
	    lonlat,
	    size,
		contentHTML,
		null,
        true,
		null,
        true
	);
	map.addPopup(framedCloud);
	
    var contentDiv=$('#chicken_contentDiv');
    //alert($('#chicken_GroupDiv').width());//overflow:visible
    contentDiv.css("overflow","visible");
    //contentDiv.css("position","absolute");
    //contentDiv.css("border","1px solid #A5AAB4");
    contentDiv.css("width",$('#chicken_GroupDiv').width());//alert(contentDiv.width());
    //alert(contentDiv.width()+"**"+$('#chicken_GroupDiv').width());
    
    /*
    var tabledivClass=$('.tabledivClass');
    tabledivClass.css("width",tabledivClass.width()-1);
    tabledivClass.css("height",222);
    */
    //var tableDiv=$('.titleClass');
    //tableDiv.css("width",tableDiv.width()-10);
    var smFramedCloudPopupContent=$('.smFramedCloudPopupContent');
    smFramedCloudPopupContent.css("padding","0");
    
    $('.smPopupCloseBox').css("top",4);
    $('.smPopupCloseBox').css("right",5);
}

/*
 * 显示数据的（表格）样式
 */
gis.anchored.tableBeautify = function(oddColor,evenColor,ouseoverColor){
	//alert(this);return;
	if(this){
		//var tr=this.getElementsByTagName("tr");
		for(var i=0;i<this.rows.length;i++){
			var temptr=this.rows[i];
			if(i%2==0){
				temptr.style.backgroundColor=oddColor;
				/*
				if(i==0){
					continue;
				}
				*/
				//鼠标离开
				temptr.onmouseout=function(){
					this.style.backgroundColor=oddColor;
				}
			}else{
				temptr.style.backgroundColor=evenColor;
				//鼠标离开
				temptr.onmouseout=function(){
					this.style.backgroundColor=evenColor;
				}				
			}

			//鼠标进入
			temptr.onmouseover=function(){
				//alert(this.style.backgroundColor+"-->"+ouseoverColor);
				this.style.backgroundColor=ouseoverColor;
			}
			
			/*
			temptr.onclick=function(){
				//alert(this.sectionRowIndex);
			}
			*/
			var tagName_td=temptr.getElementsByTagName("td");
			if(tagName_td){
				var presentColsAmount=temptr.getElementsByTagName("td").length;
				if(presentColsAmount&&presentColsAmount>=4){
					for(var cc=1;cc<presentColsAmount;cc++){
						//alert(tagName_td[cc]);
						//$(tagName_td[cc]).css("color","red");
						$(tagName_td[cc]).css("border-left","1px solid #A5AAB4");
					}
				}
			}
			
		}
	}
}

/*
 * 显示数据的（表格）样式2
 */
gis.anchored.tableBeautify2 = function(){
	//alert(this);return;
	if(this){
		//var tr=this.getElementsByTagName("tr");
		//$(this).css("frame","void");
		for(var i=0;i<this.rows.length;i++){
			var temptr=this.rows[i];
			var tagName_td=temptr.getElementsByTagName("td");
			if(tagName_td){
				var presentColsAmount=temptr.getElementsByTagName("td").length;
				if(presentColsAmount){
					for(var cc=0;cc<presentColsAmount;cc++){
						
						if(cc==0){
							$(tagName_td[cc]).css("border-left","0");
						}
						if(cc==presentColsAmount-1){
							$(tagName_td[cc]).css("border-right","0");
						}
						if(i==this.rows.length-1){
							$(tagName_td[cc]).css("border-bottom","0");
						}
						if(cc%2==0){
							//temptr.style.backgroundColor=oddColor;
							//
							//alert($(tagName_td[cc]).html());
							$(tagName_td[cc]).css("backgroundColor","#e6eff9");
							//$(tagName_td[cc]).css("text-align","right");
							$(tagName_td[cc]).css("color","#185f8a");
							//    text-align: right;//color: #185f8a;
							if(gis.script.isNotBlank($(tagName_td[cc]).html())){
								$(tagName_td[cc]).html($(tagName_td[cc]).html()+"：");
							}
							
						}
						$(tagName_td[cc]).css("text-align","left");
					}
				}
			}
		}
	}
}

gis.anchored.tohtml = function(data){
	//alert(JSON.stringify(data));
	//$("<div id='popupWin'></div>").addClass("popupWindow").appendTo($("#result"));
	var html=new Array();
	var nvlval='';
	if(data){
		if(data.title){
			
			html.push("<div class='titleClass'>");
			html.push(data.title);
			html.push("</div>");
		}
		
		if(data.data){
			//html.push("<div class='tableClass' style='width: 335px; height: 115px; position: relative;border:1px solid #A5AAB4;overflow:auto;'>");
			html.push("<div class='tabledivClass'>");
			//html.push(data.title);html.push("<br>");
			html.push("<table class='altrowstable'>");
			for(var i=0;i<data.data.length;i++){
				var o=data.data[i];
				
				html.push("<tr>");
				for(var j=0;j<o.length;j++){
					html.push("<td style='"+(data.style[j]||nvlval)+"'>");
					html.push(o[j]);
					html.push("</td>");
				}
				html.push("</tr>");
			}
			html.push("</table>");
			html.push("</div>");
		}	
			
		
	}
	//alert(html.join(""));
	return html.join("");
}

gis.anchored.portinfo = function(data){
	var obj={popupBorder:"1px solid #A5AAB4",width:320,height:152,title:"港口信息",
		style:["width:30%","text-align:center;"],
		data:[['港口名称',data.portName],['港区个数',data.portNumber],['锚地个数',data.anchorageNumber],['作业区个数',data.chanceNumber]]};
	
	
	return obj;
}

gis.anchored.nvlinfo = function(data){
	var obj={popupBorder:"1px solid #A5AAB4",width:320,height:155,title:data.poptitle,
		style:["width:30%","text-align:center;"],
		data:[['名称',data.portName]]};
	
	
	return obj;
}

$(document).ready(function() {
	
});