var group_array = new Array();//index页模块组id
var layoutgroup_array = new Array();//layout页模块组id
var del_array = new Array();//删除的模块
var module_array = new Array();//模块名称
var key_array = [//模块关键字
    "corporateimage",
    "navigator",
    "introduction",
    "introductionlist",
    "introductiondetail",
    "news",
    "newsclass",
    "newslist",
    "latestnews",
    "commendnews",
    "newsdetail",
    "product",
    "productclass",
    "productlist",
    "latestproduct",
    "commendproduct",
    "productdetail",
    "message",
    "job",
    "jobclass",
    "joblist",
    "jobdetail",
    "affiche",
    "link",
    "login",
    "other",
    "text",
    "picture",
    "flash",
    "picturegroup",
    "search"
];
var pic_array = [//图标
    "dot/dot_company.gif",
    "dot/dot_list.gif",
    "dot/dot_list.gif",
    "dot/dot_list.gif",
    "dot/dot_list.gif",
    "dot/dot_list.gif",
    "dot/dot_seperate.gif",
    "dot/dot_list.gif",
    "dot/dot_new.gif",
    "dot/dot_recomment.gif",
    "dot/dot_list.gif",
    "dot/dot_list.gif",
    "dot/dot_seperate.gif",
    "dot/dot_list.gif",
    "dot/dot_new.gif",
    "dot/dot_recomment.gif",
    "dot/dot_list.gif",
    "dot/dot_list.gif",
    "dot/dot_list.gif",
    "dot/dot_seperate.gif",
    "dot/dot_list.gif",
    "dot/dot_list.gif",
    "dot/dot_notice.gif",
    "dot/dot_link.gif",
    "dot/dot_list.gif",
    "dot/dot_list.gif",
    "dot/dot_text.gif",
    "dot/dot_image.gif",
    "dot/dot_flash.gif",
    "dot/dot_imgs.gif",
    "dot/dot_search.gif"
];
var emptyTrashCan = function(item){
	item.remove();
};


//布局页更新事件
var layoutUpdate = function(e, ui){
	if(ui.element[0].id == 'trashcan'){
	    if(ui.item[0].id.indexOf("_old") != -1){
	        del_array.push(ui.item[0].id.substr(0,ui.item[0].id.length - 4));
	    }
		emptyTrashCan(ui.item);
	} 
};
//布局提交保存
var layoutSubmit = function(e, ui){
    $("#submit_button").attr("disabled",true);
    var $div = "";//布局组和模块id串
    //布局组id和模块id拼成串
    for(var i = 0;i < layoutgroup_array.length;i++){
        $div += layoutgroup_array[i].substr(1) + ":";//去掉#号
        for(var j = 0;j < $(layoutgroup_array[i]+" > div").length;j++){
            id = $(layoutgroup_array[i]+" > div")[j].id;
            if(j == $(layoutgroup_array[i]+" > div").length - 1){
                $div += id;
            }
            else{
                $div += id + ",";
            }
        }
        if(i != layoutgroup_array.length - 1){
            $div += ";";
        }
    }
    var $del = "";
    for(var i = 0;i < del_array.length;i++){
        if(i == del_array.length - 1){
            $del += del_array[i];
        }
        else{
            $del += del_array[i] + ",";
        }
    }
    var layoutname = "";
    $("input:checked").each(function(){
        if($(this).attr("name") == 'chooselayout'){
            layoutname = $(this).val();
        }
    })
    //取本页地址
    var backid = "1";
    if($("#action").html().indexOf("id") != -1){
        backid = $("#action").html().substr($("#action").html().indexOf("id")+3);
    }
//    alert($div);
//    return;
    $.ajax({
        type: "POST",
        url: "/common/visualhelper/layoutsave",
        data: "div="+$div+"&del="+$del+"&layoutname="+layoutname+"&filename="+$("#filename").html()+"&filepath="+$("#filepath").html()+"&backid="+backid,
        success: function(msg){
//                alert( msg );
            if(msg == "logout"){
                window.location.href = "/admin";
            }
            else{
                window.location.reload();
            }
        }
    }); 
}
//首页拖拽事件
var sortableChange = function(e, ui){
	if(ui.sender){
		var w = ui.element.children().width();
		ui.placeholder.width(w);
		ui.helper.css("width",w);
	}
};
//首页拖拽更新事件
var sortableUpdate = function(e, ui){
    var $div = "";
    for(var i = 0;i < group_array.length;i++){
        $div += group_array[i].substr(1) + ":";
        for(var j = 0;j < $(group_array[i]+" > div").size();j++){
            if(j == $(group_array[i]+" > div").length - 1){
                $div += $(group_array[i]+" > div")[j].id;
            }
            else{
                $div += $(group_array[i]+" > div")[j].id + ",";
            }
        }
        if(i != group_array.length - 1){
            $div += ";";
        }
    }
    $.ajax({
        type: "POST",
        url: "/common/visualhelper/edit",
        data: "div="+$div+"&filename="+$("#filename").html(),
        success: function(msg){
//                alert( msg );
        }
    }); 
};
//产生拖放功能
var divSortable = function(e, ui){
    var els = new Array();
    els.push("#trashcan");
    //收集可拖放的模块组
    $("[id$='_layoutgroup']").each(function() {
        els.push("#"+$(this).attr("id"));
    })
    var $els = $(els.toString());
    $els.sortable('destroy');//多次sortable拖放会变混乱，所以每次拖放前先清除以前的拖放功能
    $els.sortable({ 
        cursor:'move',
        appendTo: 'body',
        connectWith: els,	
        placeholder : 'sortableHelper2',
        tolerance: 'pointer',
        helper: 'clone',
        //revert: 100,
        start: function(e,ui) {
//			ui.helper.css("width", ui.item.width());
			ui.helper.css("z-index", 2000);
//			ui.helper.css("text-align", "center");
//			ui.helper.css("color","#3B577F");
		},
		sort: function(e,ui) {
		    var w = ui.item.parent().width()-8;
		    ui.placeholder.width(w);
		    ui.helper.width(w);
		},
        update:layoutUpdate
    });	    
}

//读取布局，生成页面元素
var layoutSortable = function(e, ui, msg){
    $("#editright").html(msg);
    //判断布局是否改变，如果未改变，读入布局包含的模块，如果已改变，清空模板中的模块
    if($("#layoutname").html() == $("[name=chooselayout][checked]").val()){//布局未改变
        for(i = 0;i < group_array.length;i++){//循环index组
            var id_array = group_array[i].split("_");//取前缀
            $(id_array[0]+"_layoutgroup").empty();//清空layout组内模板内容
            for(j = 0;j < $(group_array[i]+" > div").length;j++){//循环index组,取index页模块到layout页中
                //模块id格式xxxx_xxxx_xxxx或xxxx_xxxx,需要前缀做为key从module_array中取出模块名
                var module_id = $(group_array[i]+" > div")[j].id.split("_");
                var module_name = "";
                if(module_id.length == 3){
                    module_name = module_array[module_id[0]+"_"+module_id[1]];
                }
                if(module_id.length == 2){
                    module_name = module_array[module_id[0]];
                }
                //加后缀_old防止跟index页面模块id重复
                $(id_array[0]+"_layoutgroup").append("<div id=\""+$(group_array[i]+" > div")[j].id+"_old\" class=\"divmod\">"+module_name+"</div>");            
            }
        }
    }
    //选择了新布局，清空模板内容
    else{
	    //收集可拖放的布局组，清空里面的模块
	    layoutgroup_array = new Array();
	    $("[id$=_layoutgroup]").each(function() {
	        var id = $(this).attr("id");
            layoutgroup_array.push("#"+$(this).attr("id"));
            $("#"+$(this).attr("id")).empty();
	    })
    }
    //以前如果draggable过，拖放时会生成多个div，这里需要删除以前的draggable
    $(".subMenu > li").draggable("destroy");
    //左侧目录树拖拽功能
    $(".subMenu > li").draggable({ helper: "clone",zIndex: 1});
    for(i = 0;i < layoutgroup_array.length;i++){
        $(layoutgroup_array[i]).droppable({ 
                accept: ".subMenuLi", 
                drop: function(e, ui){
                    //加_new后缀表明是新生成的模块
                    $(this).append("<div id=\""+ui.draggable[0].id+"_"+Date.parse(Date().toString())+"_new\" class=\"divmod\">"+ui.draggable.text()+"</div>");
                    divSortable(e,ui);
                }
        });
    }
    divSortable(e,ui);
    showAddModule();//显示模块添加页面
}

//设定布局选择页面默认选中的布局
var defaultChooseLayout = function(){
    $("[name=chooselayout]").each(function(){
        if($(this).val() == $("#layoutname").html()){
            $(this).attr("checked","checked");
            //选中的布局图片外圈变红
            var a = $(this).val().split("_");
            $("#chooselayouta_"+a[1]).addClass("focus");
        }
        else{
            $(this).removeAttr("checked");
            //未选中的布局图片去掉外圈
            var a = $(this).val().split("_");
            $("#chooselayouta_"+a[1]).removeClass("focus");
        }
    })
}
//显示布局选择页面
var showChooseLayout = function(){
    $("#chooselayoutdiv").show();
    $("#chooselayoutdiv").dialog({ modal: true, 
                            overlay: { opacity: 0.5, background: "black" },
                            width:658,
                            height:558
                            //dialogClass:'dialog'
    });
    defaultChooseLayout();//设定布局选择页面默认选中的布局
}
//显示模块添加页面
var showAddModule = function(){
    $("#layoutdiv").show();
    $("#layoutdiv").dialog({ modal: true, 
                            overlay: { opacity: 0.5, background: "black",height:1500 },
                            width:800,
                            height:1500,
                            dialogClass:'dialog'
    });
}
//装载添加布局页面
var layout = function(){
    $.ajax({
        type: "POST",
        url: "/common/visualhelper/layout",
        success: function(msg){
            $("#layoutdiv").html(msg);
            bindbuttonevent();
        }
    }); 	    
}
//装载选择布局页面
var chooselayout = function(){
    $.ajax({
        type: "POST",
        url: "/common/visualhelper/chooselayout",
        success: function(msg){
            $("#chooselayoutdiv").html(msg);
            layout();//装载添加布局页面
        }
    }); 	    
}
//重新选择布局
var resetlayout = function(){
    if(!confirm($("#chooselayoutalert").val())){
        return;
    }
    showChooseLayout();//显示布局选择页面
    $("#layoutdiv").dialog("close");
    //布局选择dialog重新打开后，单选钮状态无法保存，图片选中状态可以保存
    //找到选中的图片，让相应的单选钮选中
    $("[id^=chooselayouta]").each(function(){//chooselayout页的所有a标签
        //找到选中的图片
        if($(this).attr("class") == "focus"){
            var id_split = $(this).attr("id").split("_");//a标签id以下划线拆分
            $("[name=chooselayout]").each(function(){
                var value_split = $(this).val().split("_");//单选钮value以下划线拆分
                if(id_split[1] == value_split[1]){
                    $(this).attr("checked",true);
                }
            })
        }
    })
}
//绑定按钮事件
var bindbuttonevent = function(){
	//绑定添加模块点击事件
    $("#quickfunc_li > a").click(function (e,ui) {
    	showLayout(e,ui);
    });
    
    //绑定向导中的"添加模块"快捷操作
    $("#shortcutOpen > a").click(function (e,ui) {
    	alerta1();//先缩小
    	showLayout(e,ui);
    });
    
    //绑定下一步点击事件，关闭布局选择框，显示模块选择框
    $("#next").click(function(e,ui){
        var layoutname = "";
        $("[name=chooselayout]").each(function(){
            if($(this).attr("checked") == true){
                layoutname = $(this).val();
            }
        })
        if(layoutname.indexOf("layout") == -1){
            alert("请选择一个布局");
            return false;
        }
        $.ajax({
            type: "POST",
            url: "/common/visualhelper/readlayout",
            data: "layoutname="+layoutname,
            success: function(msg){
                layoutSortable(e,ui,msg);
                $("#chooselayoutdiv").dialog("close");
            }
        }); 
    })
    //绑定布局选择框右上角关闭按钮点击事件
    $("#chooselayout_close_button").click(function(e,ui){
        window.location.reload();
    })        
    //绑定模块选择框右上角关闭按钮点击事件
    $("#close_button").click(function(e,ui){
        window.location.reload();
    })
    //绑定提交保存布局和模块事件
    $("#submit_button").click(function(e,ui){
        layoutSubmit(e,ui);
    })
    //绑定一级目录点击事件
    $("[id^=class1_]").click(function(){
        var id = $(this).attr("id");
        $(".subMenu").hide();
        $("#"+id+" > .subMenu").show();
        //alert($(".subMenuLi[id^="+"text"+"] > a >img").attr("src"));
        //换图标
        for(var i = 0;i < key_array.length;i++){
            $(".subMenuLi[id^="+key_array[i]+"] > a >img").each(function(){
                var src = $(this).attr("src");
                src = src.substring(0,src.indexOf("images")+7) + pic_array[i];
                $(this).attr("src",src);
            })
        }
    })      
	//绑定选中布局图片时，外圈变红事件
    $("[id^=chooselayouta]").each(function(){//chooselayout页的所有a标签
        var id = $(this).attr("id");//a标签id
        $(this).click(function(){//设置click事件
            //点击图片，单选钮选中
            $("[name=chooselayout]").each(function(){
                var value_split = $(this).val().split("_");//单选钮value以下划线拆分
                var id_split = id.split("_");//a标签id以下划线拆分
                if(value_split[1] == id_split[1]){
                    $(this).attr("checked",true);
                }
                if(value_split[1] != id_split[1]){
                    $(this).attr("checked",false);
                }
            })
            //选中布局图片，外圈变红
            $("[id^=chooselayouta]").each(function(){
                if($(this).attr("id") == id){
                    $(this).addClass("focus");
                }
                else{
                    $(this).removeClass("focus");//去掉其它未选中的外圈
                }
            })
        });
    });  
	//绑定点击布局单选钮，图片外圈变红事件
    $("[name=chooselayout]").each(function(){//所有布局单选钮
        var value_split = $(this).val().split("_");//单选钮value以下划线拆分
        $(this).click(function(){
            //选中的布局图片外圈变红
            $("[id^=chooselayouta]").each(function(){//chooselayout页的所有a标签
                var id_split = $(this).attr("id").split("_");//a标签id以下划线拆分
                if(id_split[1] == value_split[1]){
                    $(this).addClass("focus");
                }
                else{
                    $(this).removeClass("focus");//去掉其它未选中的外圈
                }
            })
        });
    });
showQuickButton();//显示快捷菜单
}
//显示快捷菜单
var showQuickButton = function(){
    $("#quickfunc").show();
    $("#quickclose").hide();
    $("#quickbtn1").click(function(){
        $("#quickfunc").hide();
        $("#quickclose").show();
    });
    $("#quickbtn2").click(function(){
        $("#quickfunc").show();
        $("#quickclose").hide();
    })	    
}

var showLayout = function (e,ui) {
        //判断页面上是否有模块，以决定显示的页面
        for(i = 0;i < group_array.length;i++){
            //页面上有模块，跳出循环
            if($(group_array[i]).html().indexOf("DIV") != -1 || $(group_array[i]).html().indexOf("div") != -1 ){
                break;
            }
            //读取当前布局，以确定单选钮默认选中的布局
            if(i == group_array.length - 1){
                showChooseLayout();//显示布局选择页面
                return;
            }
        }
        //设置单选钮默认选中的布局，虽然不显示，但是layoutSortable(e,ui,msg)函数会以此判断布局是否改变
        
        $("[name=chooselayout]").each(function(){
            if($(this).val() == $("#layoutname").html()){
                $(this).attr("checked","checked");              
            }
            else{
                $(this).removeAttr("checked");
            }
        })
        if($("#layoutname").html().indexOf("layout") == -1){
            alert("layoutname错误，页面已损坏！");
            return false;
        }
        //读取布局
        $.ajax({
            type: "POST",
            url: "/common/visualhelper/readlayout",
            data: "layoutname="+$("#layoutname").html(),
            success: function(msg){
                layoutSortable(e,ui,msg);//写入模块并使其可以拖放并显示模块层
                $("#quickfunc").hide();
                $("select").hide();//隐藏select标签
                $("object").hide();//隐藏flash控件
            }
        }); 
    }
$(document).ready(function(){
    if($("#islogin").html() == '0'){
        return;
    }
    else{
        chooselayout();//装载选择布局页面
    }
    //取所有模块名称
    $.ajax({
        type: "POST",
        url: "/common/visualhelper/readmodulename",
        success: function(msg){
//                alert( msg );
            modules = msg.split(",");
            for(var i = 0;i < modules.length;i++){
                var module = modules[i].split(":");
                module_array[module[0]] = module[1];
            }
        }
    });         
    //收集可拖放的模块组并生成布局组
    $("[id$='_group']").each(function() {
        var id = $(this).attr("id");
        var id_array = id.split("_");
        group_array.push("#"+id);
        layoutgroup_array.push("#"+id_array[0]+"_layoutgroup");
    })

    //使布局内的元素可以拖放
    var $group_array = $(group_array.toString());
    $group_array.sortable({ 
        handle:'#draghandle',
        cancel:'#dragtext',
        cursor:'move',
        appendTo: 'body',
        connectWith: group_array,	
        placeholder : 'sortableHelper',
        revert: 100,
        start: function(e,ui) {
			ui.helper.css("width", ui.item.width());
		},
		sort: function(e,ui) {
		    var w = ui.item.parent().width();
		    ui.placeholder.width(w);
		    ui.helper.width(w);
		},
		tolerance: 'pointer',
		change: sortableChange,
		update: sortableUpdate
    });
//初始化结束
});



