yctb-SpringBoot/web/js/v2/fw/fw.tip.js

/**
 * @author herong
 * 提示组件
 */
var CFWTip = _FW.fCreateClass();
/**
 * 提示组件API
 */
CFWTip.prototype = {
		
		/**
		 * 初始化
		 * */
		fInitialize : function (options){
			
		},
		
		/**
		 * 验证提示框，显示3秒后自动隐蔽
		 * @param findObj（必需）控件对象
		 * @param msg 提示信息
		 * <pre>
		 * 使用举例：
		 * CFW.oTip.fnValidateTip(cbxxForm.XM,"姓名输入不合法");
		 * </pre>
		 */
		fnValidateTip : function (findObj, msg){			
			var defaults = {content: {text: msg},
					        hide:    {delay: 0,
							          event: false,
							          inactive: 3000},
					        position:{my: 'center left', // 默认显示在右侧
							          at: 'center right'}};
			
	        var $findObj = $(findObj);
	        //距离浏览器窗口右边的距离
	        var distance = document.body.clientWidth - $findObj.get(0).getBoundingClientRect().right;
	        
	        if(distance <= 200){//如果距离浏览器右边的距离少于200px，则提示信息在下方显示
	        	
	        	defaults.position = {my: 'top center', 
				                     at: 'bottom center'};
	        	
		        if($findObj.hasClass("fwcombox-arrow")){
		        	$findObj.prev().qtip(defaults).qtip("show");
		        }
		        else{
		        	$findObj.qtip(defaults).qtip("show");
		        }
		        
	        }
	        else{
	        	$findObj.qtip(defaults).qtip("show");
	        }
		},
		
		/**
		 * 有标题和关闭按钮的提示框
		 * @param oFindObj（必需）控件对象
		 * @param sTitleStr 标题
		 * @param sMsg 提示信息
		 * <pre>
		 * 使用举例：
		 * CFW.oTip.fnTipDialog(cbxxForm.XM,"错误提示","姓名输入不合法");
		 * </pre>
		 */
		fnTipDialog : function (findObj, titleStr, msg){
			var isTitle = true;
			if (jQuery.trim(msg) != ''){
				isTitle = false;
			}
			this.fnShowTip(findObj, msg, {hide: {event: false}, 
			 					 content:{title: {text: titleStr, // Give the tooltip a title using each elements text
						                          button: true},
						                  text: function(){
						                	  return !isTitle ? msg : $(this).attr('title');}},
						         position:{my: 'left center', // Use the corner...
						    			   at: 'right center' // ...and opposite corner
						    	}}).qtip('show');
			
		},
		
		/**
		 * 普通提示框(可以显示title属性内容，或提定要示的内容)
		 * @param oFindObj（必需）控件对象
		 * @param sMsg 提示信息
		 * @returns oQtip对象
		 * <pre>
		 * 使用举例：
		 * CFW.oTip.fnTip('a[title]',"提示信息");
		 * </pre>
		 */
		fnTip : function (findObj, msg){
			var isTitle = true;
			var options = {};
			if (jQuery.trim(msg) != ''){
				isTitle = false;
			}
			
			var defaults = 
			{content: {text: function() {return !isTitle ? msg : $(this).attr('title');}},
			 hide:{delay: 3000,
				   event: false,
		           inactive: 3000},						          
    		 position: {my: 'left center', // Use the corner...
    			        at: 'right center' // ...and opposite corner
    		}};
            jQuery.extend(true,defaults,options);            
            $(findObj).qtip(defaults).qtip('show');
		},
		
		/**
		 * 普通提示框(可以显示title属性内容，或提定要示的内容) alert title  未能显示
		 * @param oFindObj（必需）控件对象
		 * @param sMsg 提示信息
		 * @param sOptions 参数
		 * @returns oQtip对象
		 * <pre>
		 * 使用举例：
		 * CFW.oTip.fnShowTip('a[title]',"提示信息");
		 * </pre>
		 */
		fnShowTip : function (findObj, msg, options){
			var isTitle = true;
			var options2 = options == undefined || options == null ? {} : options;
			if (jQuery.trim(msg) != ''){
				isTitle = false;
			}
			
			var defaults = {content: {
								text: function() {
							         return !isTitle ? msg : $(this).attr('title');
							   }
				    		},
				    		position: {
				    			my: 'left center', // Use the corner...
				    			at: 'right center' // ...and opposite corner
				    		}};
			jQuery.extend(true,defaults,options2); 
			return $(findObj).qtip(defaults);
		},
		
		/**
		 * ajax动态内容提示框
		 * @param oFindObj（必需） 控件对象
		 * @param sOptions（必需） 参数
		 * <pre>
		 * 使用举例：
		 * CFW.oTip.fnTipDynamic("a[name='hrefTip']", options);
		 * 定义的 options
		 *     {
		   title:{
		     text: '提示', 
		     button: true
		     },
		    position:{
		     at: 'bottom right',
		     my: 'top left',
		     viewport: $(window)
		     }
		 * </pre>
		 */
		fnTipDynamic : function (findObj, options){
			
			var defaultOptions = {
					title:{
						 text: '提示', 
						 button: true
			 			},
			 		position:{
			 			at: 'bottom right',
			 			my: 'top left',
			 			viewport: $(window)
			 		},
			 		style:'ui-tooltip-wiki'
			 };
			 
			 jQuery.extend(defaultOptions,options || {}); 
			 
			 $(findObj).each(function()
					   {
					      // We make use of the .each() loop to gain access to each element via the "this" keyword...
					      $(this).qtip(
					      {
					    	  content: {
					              text: '<img class="throbber" src="'+contextPath+'/js/ui/qtip/images/throbber.gif" alt="Loading..." />',
					              ajax: defaultOptions.ajax || $(this).attr('rel'),
					              title: defaultOptions.title 
					           },
					           position: defaultOptions.position,
					           show: {
					              event: 'click',
					              solo: true // Only show one tooltip at a time
					           },
					           hide: 'unfocus',
					           style:defaultOptions.style
					        })
					        
					        // Make sure it doesn't follow the link when we click it
					        .click(function() { return false; });
					   }).qtip('show');
			 
			 defaultOptions = null;
		},
		
		/**
		 * 提示框
		 * @param msg（必需） 提示信息
		 * <pre>
		 * 使用举例：
		 * CFW.oTip.fnAlert('操作成功');
		 * </pre>
		 */
		fnAlert : function (msg){ 
			return alert(msg);
		},
		
		fnOpenProcess : function(){
			var MainID="_FWOPACITYDIV";
			var DlgID="_FWPROCESS";
			if(document.getElementById(MainID)==null){
				var MainNode=document.createElement("div");
			    
			    MainNode.setAttribute("id",MainID);
			    MainNode.style.backgroundColor="#0096FF";
			    
			    MainNode.style.left="0px";
			    MainNode.style.top="0px";    
			    MainNode.style.width="0px";
			    MainNode.style.height="0px";
			    
			    MainNode.innerHTML="";
			    MainNode.style.position="absolute";
			    MainNode.style.zIndex="400";
			    
			    MainNode.style.display="none";
			    $(MainNode).css({'opacity':'0.1'});
			    document.body.appendChild(MainNode);
			}
			if(document.getElementById(DlgID)==null){
		        //--------------------------------------------------------- 对话框----------------
				var dlgNode=document.createElement("div");
				dlgNode.setAttribute("id",DlgID);
				dlgNode.style.backgroundColor="#FFFFFF";
				dlgNode.style.zIndex="420";
				dlgNode.style.display="none";
				dlgNode.style.border="10"+"px";
				dlgNode.style.border_color="#FF0000";
				dlgNode.style.border_style="solid";
				dlgNode.innerHTML=  "<img style=\"\" src=\""+contextPath+"/themes/default/images/process.gif\" />";
				dlgNode.style.left="0px";
				dlgNode.style.top="0px";        
				dlgNode.style.width="190"+"px";        
				dlgNode.style.height="14"+"px";
				dlgNode.style.position="absolute";  
				document.body.appendChild(dlgNode);
			}
			var Dwidth;
		    var Dheight;
		    if (document.compatMode == 'BackCompat') {
		    	Dwidth=Math.max(document.body.scrollWidth, document.body.clientWidth);
		    	Dheight=Math.max(document.body.scrollHeight, document.body.clientHeight);
			} else {
				Dwidth=Math.max(document.documentElement.scrollWidth, document.documentElement.clientWidth);
				Dheight=Math.max(document.documentElement.scrollHeight, document.documentElement.clientHeight);
			}
		    var CHeight=$(window).height();
		    var CWidth=$(window).width();
		        
		    var scrolltop=$(document).scrollTop();
		    
		    var Dlgwidth=document.getElementById(DlgID).style.width;
		    var DlgHeight=document.getElementById(DlgID).style.height;
		        
		    document.getElementById(MainID).style.width=Dwidth+"px";
		    document.getElementById(MainID).style.height=Dheight+"px";
		       
		    document.getElementById(DlgID).style.left=(CWidth/2)-(parseInt(Dlgwidth)/2)+"px";
		    document.getElementById(DlgID).style.top=(scrolltop+CHeight/2-parseInt(DlgHeight)/2)+"px";

		    document.getElementById(MainID).style.display="block";
		    document.getElementById(DlgID).style.display="block";
		        
		},
		
		fnCloseProcess : function(){
			var MainID="_FWOPACITYDIV";
			var DlgID="_FWPROCESS";

	        var MainIDNode=document.getElementById(MainID);
	        var DlgIDNode=document.getElementById(DlgID);
	        if(MainIDNode!=null){
				document.body.removeChild(MainIDNode);
	        }
	        if(DlgIDNode!=null){
				document.body.removeChild(DlgIDNode);
	        }
		}
};