123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257 |
- /**
- * 全局变量
- * @param maticLayout 全局明明空间
- */
- var maticLayout={};
- var count=null;
- $(function(){
- init();
- });
- /**
- * 初始化方法
- */
- function init(){
- /**
- * 布局列表配置参数
- */
- maticLayout={
- items:[
- {text:"布局一",icon:"_icon_url_1 _background_position _display _background_size _top" ,layoutData:[{column:"100%",row:[{id:"content1" ,value:"100%"}]}]},
- {text:"布局二",icon:"_icon_url_2 _background_position _display _background_size _top",layoutData:[{column:"50%",row:[{id:"content1",value:"100%"}]},{column:"50%",row:[{id:"content2",value:"100%"}]}]},
- {text:"布局四",icon:"_icon_url_2_2 _background_position _display _background_size _top",layoutData:[{column:"50%",row:[{id:"content1",value:"50%"},{id:"content2",value:"50%"}]},
- {column:"50%",row:[{id:"content3",value:"50%"},{id:"content4",value:"50%"}]}]},
- {text:"布局五",icon:"_icon_url_2_2_1 _background_position _display _background_size _top",layoutData:[{column:"25%",row:[{id:"content1",value:"50%"},{id:"content2",value:"50%"}]},
- {column:"50%",row:[{id:"content3",value:"100%"}]},
- {column:"25%",row:[{id:"content4",value:"50%"},{id:"content5",value:"50%"}]}]},
- {text:"布局六",icon:"_icon_url_2_3 _background_position _display _background_size _top",layoutData:[{column:"33.33%",row:[{id:"content1",value:"50%"},{id:"content2",value:"50%"}]},{column:"33.33%",row:[{id:"content3",value:"50%"},{id:"content4",value:"50%"}]},{column:"33.33%",row:[{id:"content5",value:"50%"},{id:"content6",value:"50%"}]}]},
- {text:"布局七",icon:"_icon_url_3_2_1 _background_position _display _background_size _top",layoutData:[{column:"25%",row:[{id:"content1",value:"33.33%"},{id:"content2",value:"33.33%"},{id:"content3",value:"33.33%"}]},
- {column:"75%",row:[{id:"content4",value:"66.66%"},{id:"a2",value:"33.33%",
- layoutData:[{row:"100%",column:[{id:"content5",value:"33.33%"},{id:"content6",value:"33.33%"},{id:"content7",value:"33.33%"}]}]}]}
- ]},
- {text:"布局八",icon:"_icon_url_2_4 _background_position _display _background_size _top",layoutData:[{column:"25%",row:[{id:"content1",value:"50%"},{id:"content2",value:"50%"}]},{column:"25%",row:[{id:"content3",value:"50%"},{id:"content4",value:"50%"}]},
- {column:"25%",row:[{id:"content5",value:"50%"},{id:"content6",value:"50%"}]},{column:"25%",row:[{id:"content7",value:"50%"},{id:"content8",value:"50%"}]}
- ]}]
- };
- /* maticLayout.items=[
- {text:"1",icon:"_icon_url_1 _background_position _display _background_size _top" ,layoutData:[{column:"100%",row:[{id:"content1" ,value:"100%"}]}]},
- {text:"2",icon:"_icon_url_2 _background_position _display _background_size _top",layoutData:[{column:"50%",row:[{id:"content1",value:"100%"}]},{column:"50%",row:[{id:"content2",value:"100%"}]}]},
- {text:"4",icon:"_icon_url_2_2 _background_position _display _background_size _top",layoutData:[{column:"50%",row:[{id:"content1",value:"50%"},{id:"content2",value:"50%"}]},
- {column:"50%",row:[{id:"content3",value:"50%"},{id:"content4",value:"50%"}]}]},
- {text:"2X2+1",icon:"_icon_url_2_2_1 _background_position _display _background_size _top",layoutData:[{column:"25%",row:[{id:"content1",value:"50%"},{id:"content2",value:"50%"}]},
- {column:"50%",row:[{id:"content3",value:"100%"}]},
- {column:"25%",row:[{id:"content4",value:"50%"},{id:"content5",value:"50%"}]}]},
- {text:"2X3",icon:"_icon_url_2_3 _background_position _display _background_size _top",layoutData:[{column:"33.33%",row:[{id:"content1",value:"50%"},{id:"content2",value:"50%"}]},{column:"33.33%",row:[{id:"content3",value:"50%"},{id:"content4",value:"50%"}]},{column:"33.33%",row:[{id:"content5",value:"50%"},{id:"content6",value:"50%"}]}]},
- {text:"2X3+1",icon:"_icon_url_2_4 _background_position _display _background_size _top",layoutData:[{column:"25%",row:[{id:"content1",value:"33.33%"},{id:"content2",value:"33.33%"},{id:"content3",value:"33.33%"}]},
- {column:"75%",row:[{id:"content4",value:"66.66%"},{id:"a2",value:"33.33%",
- layoutData:[{row:"100%",column:[{id:"content5",value:"33.33%"},{id:"content6",value:"33.33%"},{id:"content7",value:"33.33%"}]}]}]}
- ]},
- {text:"2X4",icon:"_icon_url_3_2_1 _background_position _display _background_size _top",layoutData:[{column:"25%",row:[{id:"content1",value:"50%"},{id:"content2",value:"50%"}]},{column:"25%",row:[{id:"content3",value:"50%"},{id:"content4",value:"50%"}]},
- {column:"25%",row:[{id:"content5",value:"50%"},{id:"content6",value:"50%"}]},{column:"25%",row:[{id:"content7",value:"50%"},{id:"content8",value:"50%"}]}
- ]}]; */
- //生成菜单
- createSetMenu($("#i_content"), maticLayout.items);
- $("#i_submit").on("click",function(){
- top.createLayout("",maticLayout.items[count].layoutData,"");
- top.iframeTYLoadPage();
- top.destoryIframeContent("#layout_list_iframe");
- });
- $("#i_cancle").on("click",function(){
- top.destoryIframeContent("#layout_list_iframe");
- });
-
- }
- /**
- *
- * @param $dom 操作的容器
- * @param arrParam 操作的数组数据
- * @returns {Boolean}
- */
- function createSetMenu($dom,arrParam){
- /*
- * 1.清楚主容器
- * 2.追加容器节点和选项节点
- * 3.绑定节点事件
- * 4.销毁对象
- */
- //1
- $dom.empty();
- //2
- $dom.append("<div class='_layout_ul'></div>");
- /*$("#menu_switch").show();布局菜单按钮开关控制*/
- createLi($dom.find("._layout_ul"),arrParam/*,function(a){
- //$("#"+options.layoutParams.dom).createLayout(a,$(window).width()*0.003);
- // $("._column_move").each(function(){$(this).on("mousedown",moveDomY).addClass("_drag");});
- // $("._row_move").each(function(){$(this).on("mousedown",moveDomX).addClass("_drag");});
- //loadPage($("#"+options.layoutParams.dom),options);
- return false;
- }*/);
- /*
- * 3
- * 鼠标移入div事件
- * 鼠标点击li事件
- * 鼠标移出div事件
- */
-
- $("#i_content").find("ul").find("li").each(function(){
- $(this).on("mouseenter",move_in_icon);
- });
- click_in_icon();
-
- //4
- $dom=null;
- /*
- * IE9一下版本垃圾回收
- */
- /* if(true){
-
- }*/
- /* $(this).find("._set_menu").find("input[type='button']").on("click",{$dom: $(this)},function(e){
- var diag = new top.Dialog();
- diag.Title = "视图名称";
- diag.Height=100;
- diag.Width=300;
- diag.URL = path+"page/cockpit/webgis/layoutName.jsp";
- diag.OKEvent = function(){
- var inputValue = diag.innerFrame.contentWindow.document.getElementById('layoutName').value;
- diag.close();
- saveLayout(inputValue);
- $("#menu_content").empty();
- $("#menu_content").hide();
- $("#content").css({height:"100%"});
- };
- diag.CancelEvent=function(){
- diag.close();
- };
- diag.show();
-
- });*/
- return false;
- };
- /**
- * 鼠标移入图标事件
- */
- function move_in_icon(){
- var time=300;
- var _this=$(this).find(".i_icon_content").find("div");
- _this.animate({"margin-top":"-100px",opacity:0},time,"",function(){
- _this.css({"margin-top":"40px"});
- _this.animate({"margin-top":"0px",opacity:1},time);
- _this=null;
- });
- return false;
- };
- /**
- * 鼠标点击事件
- * 从新对主页面的主容器进行布局
- */
- function click_in_icon(){
- $("#i_content").find("ul").find("li").each(function(i,item){
- $(this).find("div").on("click",function(){
- count=i;
- });
- });
- return false;
- };
- /**
- * 鼠标移出div事件
- */
- function move_leave_icon(){
-
- }
- /**
- * 绑定鼠标移入,移出和点击事件
- * @param $dom 操作的节点
- * @param label 如果采用委托机制,委托dom标签节点
- * @param fn_move_in 鼠标移入事件
- * @param fn_move_leave 鼠标移出事件
- * @param fn_click 鼠标点击事件
- */
- function bindEvent($dom,label,fn_move_in,fn_move_leave,fn_click){
- /*
- * 判断是否为委托绑定事件
- */
-
- if(label===""){
- //点击事件
- if(typeof fn_click=="function"){
- $dom.on("click",fn_click);
- };
- //移入事件
- if(typeof fn_move_in=="function"){
- $dom.on("mouseenter",fn_move_in);
- }
- //移出事件
- if(typeof fn_move_leave=="function"){
- $dom.on("mouseleave",fn_move_leave);
- }
- }else{
-
- //点击事件
- if(typeof fn_click=="function"){
- $dom.on("click",label,fn_click);
- };
- //移入事件
- if(typeof fn_move_in=="function"){
- $dom.on("mouseenter",label,fn_move_in);
- }
- //移出事件
- if( typeof fn_move_leave=="function"){
- $dom.on("mouseleave",label,fn_move_leave);
- }
- }
- return false;
- }
-
- /**
- * 创建布局选项
- * @param dataParams
- * @param fn_option
- * @returns {Boolean}
- */
- function createLi($dom,dataParams){
- var htmlStr="<ul>";
- for(var index=0,len=dataParams.length;index<len;index++){
- htmlStr+="<li class='_ul_li _display'><div class='i_icon_content'><div class='"+dataParams[index].icon+"' title='"+dataParams[index].text+"'/></div><div class='c_icontext'>"+dataParams[index].text+"</div></li>";
- };
- htmlStr+="</ul>";
- $dom.append(htmlStr);
- //销毁地图
- htmlStr=null;
-
- /* var selfDom=this;
- $(selfDom).append("<ul></ul>");
- for(var index=0,len=dataParams.items.length;index<len;index++){
- $(selfDom).find("ul").append("<li class='_img_content'><img src='"+dataParams.items[index].url+"' title='"+dataParams.items[index].text+"'/></li>");
- $(selfDom).find("ul").find("li").last().data("layouParams",dataParams.items[index].layoutData)
- .on("click",function(){fn_option($(this).data("layouParams"));});
- $(selfDom).find("li").last().on(
- "mouseenter",
- function(){
- $(this).addClass("_fn_mouse");}).on(
- "mouseleave",
- function(){
- $(this).removeClass("_fn_mouse");}).on(
- "click",
- function(){
- $(this).siblings().each(function() {
- $(this).removeClass("_fn_click_layout");
- });
- $(this).addClass("_fn_click_layout");
- });;
- }
- return false;*/
- };
|