if(typeof(MEC_NS) == 'undefined'){
	MEC_NS = {};
}

MEC_NS.TipPanel = function(type, id, mecJson){
	this.type = type;
	if(!id){
		id = new UUID().toString();
	}
	this.id = id;
	if(!mecJson){
		mecJson = this.getDefaultMecJson();
	}
	this.mecJson = mecJson;
    var that = this;
    require(['mec'], function(mec){
        that.remark = function(){
            return mec.remark(that.mecJson.title);
        };
    });
};

/*获取id。 必需的方法*/
MEC_NS.TipPanel.prototype.getID = function(){
	return this.id;
};

/*加载数据*/
MEC_NS.TipPanel.loadData = function(callback) {
	var _u = require('utils');

	navPanel = _u.use('navPanel');
	navPanel('loadNavItems', callback);
};

/*获取设计的html， 页面上怎么显示控件完全依赖于此方法。 必需的方法*/
MEC_NS.TipPanel.prototype.getDesignHtml = function(){
	return getDesignHtml(this);
};

/*页面上显示控件完成后调用此方法，主要用于一些必须要使用js对页面进行后置操作时，无需要此方法可至空。 不必需的方法，有此方法系统自动调用*/
MEC_NS.TipPanel.prototype.afterDesignHtmlBuild = function(){
	var theId = this.id;
};

/*获取构建属性编辑窗体的html，添加和单击控件后会调用此方法，由此方法去构建属性编辑窗体。 必需的方法*/
MEC_NS.TipPanel.prototype.getAttrDlgHtml = function(){

	var theId = this.id;
	
	var htm = "<div id=\"MADTipPanel_"+theId+"\" class=\"MADTipPanel_Container\">";
	htm += "<div class=\"title\">"+SystemEnv.getHtmlNoteName(4650)+"</div>"; //基本信息
	htm += "<div class=\"form-group\">"
			+ "<div class=\"row\">"
				+ "<span class=\"col-2 span-control\">"+SystemEnv.getHtmlNoteName(5155)+"</span>"  //布局类型： 
					+ "<div class=\"col-8 multi-checkbox\">"
						+ "<span class=\"cbboxEntry\">"
						+ "<input type=\"checkbox\" name=\"layoutType_"+theId+"\" value=\"1\">"
						+ "<span class=\"cbboxLabel\">"+SystemEnv.getHtmlNoteName(4553)+"</span>"	//纵向排列 
					+ "</span>"	
					+ "<span class=\"cbboxEntry\">"
						+ "<input type=\"checkbox\" name=\"layoutType_"+theId+"\" value=\"2\">"
						+ "<span class=\"cbboxLabel\">"+SystemEnv.getHtmlNoteName(4554)+"</span>" //横向排列
					+ "</span>"	
					
				+ "</div>"
			+ "</div>"
		
			+ "<div class=\"row\">"	
				+ "<span class=\"col-2 span-control\">"+SystemEnv.getHtmlNoteName(5483)+"</span>"  //显示图标： 
				+ "<div class=\"col-4\" style=\"vertical-align: top;padding-top: 2px;\">"
					+ "<div class=\"add-img-control\" style=\"width:50px;height:50px\" onclick=\"MADTipPanel_PicSet('"+theId+"');\">"
						+ "<img id=\"pic_img_"+theId+"\" style=\"display: none; \"/>"
						+ "<input type=\"hidden\" id=\"pic_type_"+theId+"\"/>"
						+ "<input type=\"hidden\" id=\"pic_path_"+theId+"\"/>"
						+ "<div id=\"pic_addbtn_"+theId+"\" class=\"light-add\" style=\"padding-top: 6px;\"></div>"
					+ "</div>"
				+ "</div>"
			+ "</div>"
	
			+"<div class=\"row\">"
				+"<span class=\"col-2 span-control\">"+SystemEnv.getHtmlNoteName(3978)+"</span>"  //标题： 
				+"<div class=\"col-m-6\"><input class=\"form-control\" data-autobind='title' id=\"title_"+theId+"\" type=\"text\" "+MLanguage.ATTR +"/></div>"  
			+"</div>"
			
			+"<div class=\"row\">"
				+"<span class=\"col-2 span-control\">"+SystemEnv.getHtmlNoteName(4371)+"</span>"  //小标题：
				+"<div class=\"col-m-6\"><input class=\"form-control\" data-autobind='sub_title' id=\"sub_title_"+theId+"\" type=\"text\" "+MLanguage.ATTR +"></div>"  
			+"</div>"
			
			
	htm += "</div>";		
	htm += "<div class=\"bottom\"><div class=\"save-btn\" onclick=\"refreshMecDesign('"+theId+"');\">"+SystemEnv.getHtmlNoteName(3451)+"</div></div>";  //确定
	htm += "</div>";
	
	htm += "<div class=\"MAD_Alert\">"+SystemEnv.getHtmlNoteName(4115)+"</div>";  //已生成到布局
	
	return htm;
};

/*构建属性编辑窗体完成后调用此方法，主要用于一些必须要使用js对页面进行后置操作时，无需要此方法可至空。 不必需的方法，有此方法系统自动调用*/
MEC_NS.TipPanel.prototype.afterAttrDlgBuild = function(){
	var theId = this.id;
	var mecHandler = MECHandlerPool.getHandler(theId);
	var pic_path = this.mecJson["pic_path"];
	var pic_type = this.mecJson["pic_type"];
	var title = this.mecJson["title"];
	var sub_title = this.mecJson["sub_title"];
	var layoutTypeV = this.mecJson["layoutType"];
	var $layoutType = $("input[type='checkbox'][name='layoutType_" + theId + "'][value='" + layoutTypeV + "']");
	if($layoutType.length > 0){
		$layoutType.checked();
	}
	MADTipPanel_SetPicPath(theId, pic_path);
	$("#pic_type_"+theId).val(pic_type);
	$("#pic_path_"+theId).val(pic_path);
	$("#MADTipPanel_" + theId).checkbox({
		onClick: function () { 
			mecHandler.autobind && mecHandler.autobind.update();
		}
	});//调用表单插件
	MLanguage.setValue($("#title_" + theId), title);
	MLanguage.setValue($("#sub_title_" + theId), sub_title);
};

/*获取JSON*/
MEC_NS.TipPanel.prototype.getMecJson = function(){
	var theId = this.id;
	this.mecJson["id"] = theId;
	this.mecJson["mectype"] = this.type;
	this.mecJson["pic_type"] = $("#pic_type_"+theId).val();	//0本地图片  1网址获取
	this.mecJson["pic_path"] = $("#pic_path_"+theId).val();
	this.mecJson["title"] =  MLanguage.getValue($("#title_"+theId));
	this.mecJson["sub_title"] = MLanguage.getValue($("#sub_title_"+theId));
	var layoutType = "1";
	var $rightAction = $("input[type='checkbox'][name='layoutType_"+theId+"']:checked");
	if($rightAction.length > 0){
		layoutType = $rightAction.val();
	}
	this.mecJson["layoutType"] = layoutType;
	return this.mecJson;
};

MEC_NS.TipPanel.prototype.getDefaultMecJson = function(){
	return {
		id: this.id,
		mectype: this.type,
		layoutType: "1", //默认垂直显示
		pic_type: "2", //0本地图片  1网址获取 2系统
		pic_path: "/mobilemode/piclibrary/03-E9_flat/success.png",
		title: "操作成功",
		sub_title: ""
	};
};



function MADTipPanel_PicSet(theId){
	var pic_typeV = $("#pic_type_"+theId).val();
	var pic_pathV = $("#pic_path_"+theId).val();
	var params = "pic_type=" + pic_typeV + "&pic_path=" + encodeURIComponent(pic_pathV);

	showPicsetModal(params, function(TipPanel){
		var picPath = TipPanel["pic_path"];
		$("#pic_type_"+theId).val(TipPanel["pic_type"]);
		$("#pic_path_"+theId).val(picPath);
		
		MADTipPanel_SetPicPath(theId, picPath);
	});
}

function MADTipPanel_SetPicPath(theId, picPath){
	var mecHandler = MECHandlerPool.getHandler(theId);
	var $picAddbtn = $("#pic_addbtn_"+theId);
	var $picImg = $("#pic_img_"+theId);
	if(picPath && picPath != ""){
		$picAddbtn.hide();
		$picImg.show();
		$picImg[0].src = picPath;
	}else{
		$picImg.hide();
		$picAddbtn.show();
	}
	mecHandler.autobind && mecHandler.autobind.update();
}