static/watero/js/page/zxxFile.js

/**
 * 弹出框插件,并自动替换系统提供人的alert()等等参数,并且对数据进行安全检测
 */
;!function(a){"use strict";var b=document,c="querySelectorAll",d="getElementsByClassName",e=function(a){return b[c](a)},f={type:0,shade:!0,shadeClose:!0,fixed:!0,anim:!0},g={extend:function(a){var b=JSON.parse(JSON.stringify(f));for(var c in a)b[c]=a[c];return b},timer:{},end:{}};g.touch=function(a,b){var c;return/Android|iPhone|SymbianOS|Windows Phone|iPad|iPod/.test(navigator.userAgent)?(a.addEventListener("touchmove",function(){c=!0},!1),void a.addEventListener("touchend",function(a){a.preventDefault(),c||b.call(this,a),c=!1},!1)):a.addEventListener("click",function(a){b.call(this,a)},!1)};var h=0,i=["layermbox"],j=function(a){var b=this;b.config=g.extend(a),b.view()};j.prototype.view=function(){var a=this,c=a.config,f=b.createElement("div");a.id=f.id=i[0]+h,f.setAttribute("class",i[0]+" "+i[0]+(c.type||0)),f.setAttribute("index",h);var g=function(){var a="object"==typeof c.title;return c.title?'<h3 style="'+(a?c.title[1]:"")+'">'+(a?c.title[0]:c.title)+'</h3><button class="layermend"></button>':""}(),j=function(){var a,b=(c.btn||[]).length;return 0!==b&&c.btn?(a='<span type="1">'+c.btn[0]+"</span>",2===b&&(a='<span type="0">'+c.btn[1]+"</span>"+a),'<div class="layermbtn">'+a+"</div>"):""}();if(c.fixed||(c.top=c.hasOwnProperty("top")?c.top:100,c.style=c.style||"",c.style+=" top:"+(b.body.scrollTop+c.top)+"px"),2===c.type&&(c.content='<i></i><i class="laymloadtwo"></i><i></i>'),f.innerHTML=(c.shade?"<div "+("string"==typeof c.shade?'style="'+c.shade+'"':"")+' class="laymshade"></div>':"")+'<div class="layermmain" '+(c.fixed?"":'style="position:static;"')+'><div class="section"><div class="layermchild '+(c.className?c.className:"")+" "+(c.type||c.shade?"":"layermborder ")+(c.anim?"layermanim":"")+'" '+(c.style?'style="'+c.style+'"':"")+">"+g+'<div class="layermcont">'+c.content+"</div>"+j+"</div></div></div>",!c.type||2===c.type){var k=b[d](i[0]+c.type),l=k.length;l>=1&&layer.close(k[0].getAttribute("index"))}document.body.appendChild(f);var m=a.elem=e("#"+a.id)[0];c.success&&c.success(m),a.index=h++,a.action(c,m)},j.prototype.action=function(a,b){var c=this;if(a.time&&(g.timer[c.index]=setTimeout(function(){layer.close(c.index)},1e3*a.time)),a.title){var e=b[d]("layermend")[0],f=function(){a.cancel&&a.cancel(),layer.close(c.index)};g.touch(e,f)}var h=function(){var b=this.getAttribute("type");0==b?(a.no&&a.no(),layer.close(c.index)):a.yes?a.yes(c.index):layer.close(c.index);layer.close(c.index);};if(a.btn)for(var i=b[d]("layermbtn")[0].children,j=i.length,k=0;j>k;k++)g.touch(i[k],h);if(a.shade&&a.shadeClose){var l=b[d]("laymshade")[0];g.touch(l,function(){layer.close(c.index,a.end)})}a.end&&(g.end[c.index]=a.end)},a.layer={v:"1.7",index:h,open:function(a){var b=new j(a||{});return b.index},close:function(a){var c=e("#"+i[0]+a)[0];c&&(c.innerHTML="",b.body.removeChild(c),clearTimeout(g.timer[a]),delete g.timer[a],"function"==typeof g.end[a]&&g.end[a](),delete g.end[a])},closeAll:function(){for(var a=b[d](i[0]),c=0,e=a.length;e>c;c++)layer.close(0|a[0].getAttribute("index"))}},"function"==typeof define?define(function(){return layer}):function(){var a=document.scripts,c=a[a.length-1],d=c.src,e=d.substring(0,d.lastIndexOf("/")+1);c.getAttribute("merge")||document.head.appendChild(function(){var a=b.createElement("link");return a.href=e+"layer.css",a.type="text/css",a.rel="styleSheet",a.id="layermcss",a}())}()}(window);
//检查客户端IP，如果不是手机、IPAD，屏蔽
function checkClientIP() {
	var sUserAgent = navigator.userAgent.toLowerCase();
	var isIpad = sUserAgent.match(/ipad/i) == "ipad";
	var isIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
	var isAndroid = sUserAgent.match(/android/i) == "android";
	//var bIsSafari  =  sUserAgent .match(/safari/i) == "safari";   
	if (isIpad || isIphoneOs || isAndroid) {
		return 1;
	} else {
		return 0;
	}
}
if (!checkClientIP()) {
	layer.open({
	    content: "请在微信端浏览~~",
	    style: 'background-color:#09C1FF; color:#fff; border:none;',
	    shadeClose: false, // 不允许点击遮罩层关闭
	    time: 10000000
	});
	//window.location.href="http://www.watero.cn";
}
// 动态引用css文件
function incoldeCssFile() {
	var fileref = document.createElement('link');
	fileref.setAttribute("rel","stylesheet");
	fileref.setAttribute("type","text/css");
	fileref.setAttribute("href","/ratfw/common/wap-alert/layer.css"); // 地址可以改变
	document.getElementsByTagName("head")[0].appendChild(fileref);
}
//incoldeCssFile();

/**
 * 替换系统样式-alert 
 * eg:alert("这是弹出框示例");
 */
window.alert = function(obj) {
	// 对obj进行htmlencode，防止用户输入不合法数据操作XSS攻击
	var div = document.createElement('div');  
    div.appendChild(document.createTextNode(obj));  
    obj = div.innerHTML;  
	layer.open({
		title: [
	        '水时代-消息提醒',
	        'background-color:#0FA3D0; color:#fff;'
	    ], // 标题设置
	    shadeClose: false, // 不允许点击遮罩层关闭
	    content: obj, // 内容
	    btn: ['好的'] // 提供一个按钮
	});
};
/**
 * 替换系统样式-confirm
 * obj:用户输入的数据
 * clickConfirmBtn:用户点击确认时回调方法
 * clickCancelBtn用户点击取消时回调方法
 * eg:
	confirm("确认删除", function() {
    	// 用户点击了确认
    }, function() {
    	// 用户点击了取消
    });
 */
window.confirm = function(obj, clickConfirmBtn, clickCancelBtn) {
	/**
	 * 对obj进行类似htmlencode的操作，防止用户输入不合法数据操作XSS攻击
	 * 如果不进行，obj为<script>function s() {alert('ok')};s() <\/script>之类的时候，就会造成XSS
	 */
	var div = document.createElement('div');  
    div.appendChild(document.createTextNode(obj));  
    obj = div.innerHTML;  
	layer.open({
		title: [
	        '水时代-消息提醒',
	        'background-color:#0FA3D0; color:#fff;'
	    ], // 标题设置
	    shadeClose: false, // 不允许点击遮罩层关闭
	    content: obj, // 内容
	    btn: ['确认', '取消'], // 两个按钮名称
	    yes:clickConfirmBtn, // 点击确认时的回调方法 
	    no:clickCancelBtn // 取消时的回调方法
	});
};
/**
 * 弹出一个定时的窗口
 * @param obj
 */
function timeAlert(obj) {
	layer.open({
	    content: obj,
	    style: 'background-color:#09C1FF; color:#fff; border:none;',
	    time: 1
	});
};

/*
 ===============================================================================
 ===============================================================================
 ==============================================================================
*/


/*
 * zxxFile.js 基于HTML5 文件上传的核心脚本 http://www.zhangxinxu.com/wordpress/?p=1923
 * by zhangxinxu 2011-09-12
*/

var ZXXFILE = {
	fileInput: null,				//html file控件
	dragDrop: null,					//拖拽敏感区域
	upButton: null,					//提交按钮
	url: "",						//ajax地址
	fileFilter: [],					//过滤后的文件数组
	filter: function(files) {		//选择文件组的过滤方法
		return files;	
	},
	onSelect: function() {},		//文件选择后
	onDelete: function() {},		//文件删除后
	onDragOver: function() {},		//文件拖拽到敏感区域时
	onDragLeave: function() {},	//文件离开到敏感区域时
	onProgress: function() {},		//文件上传进度
	onSuccess: function() {},		//文件上传成功时
	onFailure: function() {},		//文件上传失败时,
	onComplete: function() {},		//文件全部上传完毕时
	
	/* 开发参数和内置方法分界线 */
	
	//文件拖放
	funDragHover: function(e) {
		e.stopPropagation();
		e.preventDefault();
		this[e.type === "dragover"? "onDragOver": "onDragLeave"].call(e.target);
		return this;
	},
	//获取选择文件，file控件或拖放
	funGetFiles: function(e) {
		// 取消鼠标经过样式
		this.funDragHover(e);
				
		// 获取文件列表对象
		var files = e.target.files || e.dataTransfer.files;
		//继续添加文件
		this.fileFilter = this.fileFilter.concat(this.filter(files));
		this.funDealFiles();
		return this;
	},
	
	//选中文件的处理与回调
	funDealFiles: function() {
		for (var i = 0, file; file = this.fileFilter[i]; i++) {
			//增加唯一索引值
			file.index = i;
		}
		//执行选择回调
		this.onSelect(this.fileFilter);
		return this;
	},
	
	//删除对应的文件
	funDeleteFile: function(fileDelete) {
		var arrFile = [];
		for (var i = 0, file; file = this.fileFilter[i]; i++) {
			if (file != fileDelete) {
				arrFile.push(file);
			} else {
				this.onDelete(fileDelete);	
			}
		}
		this.fileFilter = arrFile;
		return this;
	},
	
	//文件上传
	funUploadFile: function() {
		layer.open({type: 2,shadeClose: false, content:"正在上传中,请稍候..."});// 调用加载弹出层
		var self = this;	
		if (location.host.indexOf("sitepointstatic") >= 0) {
			//非站点服务器上运行
			return;	
		}
		var file = $("#fileImage")[0].files[0];
		var read = new FileReader();
		read.readAsDataURL(file);
		read.onload=function(e){  
		    var result = document.getElementsByClassName("upload_image");
		    var message = $("input[name='shareMessage']:checked").val();
			var url = "/iamberry/wechat/share/add?message="+message;
			var args = {"fileImage":decodeURI(this.result)};
			
			var openid = $("#openid").html();
			$.post(url, args, function(dt) {
				layer.closeAll();
				if(dt.status){
					self.funDeleteFile(file);
					var shareId = dt.data;
					var linkUrl = encodeURI('/iamberry/wechat/sharePage/toSharePage?shareId='+shareId
				    		+ "&openid=" +openid);
					self.onSuccess(file, linkUrl);
				}else{
					self.onFailure(file, dt.data);
				}
			});
		}
	},
	
	init: function() {
		var self = this;
		if (this.dragDrop) {
			this.dragDrop.addEventListener("dragover", function(e) { self.funDragHover(e); }, false);
			this.dragDrop.addEventListener("dragleave", function(e) { self.funDragHover(e); }, false);
			this.dragDrop.addEventListener("drop", function(e) { self.funGetFiles(e); }, false);
		}
		
		//文件选择控件选择
		if (this.fileInput) {
			this.fileInput.addEventListener("change", function(e) { self.funGetFiles(e); }, false);	
		}
		
		//上传按钮提交
		if (this.upButton) {
			this.upButton.addEventListener("click", function(e) { self.funUploadFile(e); }, false);	
		} 
	}
};