/**
* @description Mask 弹层
* @function
* @name Mask
* @param {Object} options 配置项
*/ var passport = passport || {} passport.page = passport.page || {}; /**
* @description 获取页面宽度
* @name passport.page.getWidth
* @function
* @grammar passport.page.getWidth()
* @return {number} 页面宽度
*/
passport.page.getWidth = function () {
var doc = document,
body = doc.body,
html = doc.documentElement,
client = doc.compatMode == 'BackCompat' ? body : doc.documentElement; return Math.max(html.scrollWidth, body.scrollWidth, client.clientWidth);
}; /**
* @description 获取页面高度
* @name passport.page.getHeight
* @function
* @grammar passport.page.getHeight()
*
* @return {number} 页面高度
*/
passport.page.getHeight = function () {
var doc = document,
body = doc.body,
html = doc.documentElement,
client = doc.compatMode == 'BackCompat' ? body : doc.documentElement; return Math.max(html.scrollHeight, body.scrollHeight, client.clientHeight);
}; /**
* @description 获取页面视觉区域宽度
* @name passport.page.getViewWidth
* @function
* @grammar passport.page.getViewWidth()
*
* @return {number} 页面视觉区域宽度
*/
passport.page.getViewWidth = function () {
var doc = document,
client = doc.compatMode == 'BackCompat' ? doc.body : doc.documentElement; return client.clientWidth;
}; /**
* @description 获取页面视觉区域高度
* @name passport.page.getViewHeight
* @function
* @grammar passport.page.getViewHeight()
* @return {number} 页面视觉区域高度
*/
passport.page.getViewHeight = function () {
var doc = document,
client = doc.compatMode == 'BackCompat' ? doc.body : doc.documentElement; return client.clientHeight;
}; /**
* @description 获取纵向滚动量
* @name passport.page.getScrollTop
* @function
* @grammar passport.page.getScrollTop()
* @return {number} 纵向滚动量
*/
passport.page.getScrollTop = function () {
var d = document;
return window.pageYOffset || d.documentElement.scrollTop || d.body.scrollTop;
}; /*
* @description 获取横向滚动量
*
* @return {number} 横向滚动量
*/
passport.page.getScrollLeft = function () {
var d = document;
return window.pageXOffset || d.documentElement.scrollLeft || d.body.scrollLeft;
}; function Mask(options){
var me = this,
ua = navigator.userAgent,
maskHtml = me.toHTMLString(),
sf = /(\d+\.\d)?(?:\.\d)?\s+safari\/?(\d+\.\d+)?/i.test(ua) && !/chrome/i.test(ua) ? + (RegExp['\x241'] || RegExp['\x242']) : undefined,
ie = /msie (\d+\.\d+)/i.test(ua) ? (document.documentMode || + RegExp['\x241']) : undefined; me.zIndex = 999;
me.opacity = 0.3;
me.bgColor = "#000000";
me.coverable = false;
me.container = document.body; insertHTML.call(me.container,"afterBegin", maskHtml) me.maskDom = document.getElementById('PASSP__DIA__Mask'); if(ie == 6){
me.maskDom.style.position = "absolute";
} function insertHTML( position, html) {
var range,begin,element = this; //在opera中insertAdjacentHTML方法实现不标准，如果DOMNodeInserted方法被监听则无法一次插入多element
if (element.insertAdjacentHTML) {
element.insertAdjacentHTML(position, html);
} else {
// 这里不做"undefined" != typeof(HTMLElement) && !window.opera判断，其它浏览器将出错？！
// 但是其实做了判断，其它浏览器下等于这个函数就不能执行了
range = element.ownerDocument.createRange();
// FF下range的位置设置错误可能导致创建出来的fragment在插入dom树之后html结构乱掉
// 改用range.insertNode来插入html, by wenyuxiang @ 2010-12-14.
position = position.toUpperCase();
if (position == 'AFTERBEGIN' || position == 'BEFOREEND') {
range.selectNodeContents(element);
range.collapse(position == 'AFTERBEGIN');
} else {
begin = position == 'BEFOREBEGIN';
range[begin ? 'setStartBefore' : 'setEndAfter'](element);
range.collapse(begin);
}
range.insertNode(range.createContextualFragment(html));
}
return element;
} function resize(){
if (me.container == document.body) {
var ls = me.maskDom.style; ls.width = passport.page.getViewWidth() + 'px'; ls.height = passport.page.getViewHeight() + 'px'; ls.display = "";
}
} function scroll(){
if (me.container == document.body) {
var ls = me.maskDom.style;
ls.display = "none";
ls.top = passport.page.getScrollTop() + "px";
ls.left = passport.page.getScrollLeft() + "px";
ls.display = "";
}
} function showObjects(bool){
var objects = document.getElementsByTagName("object");
var v = bool ? "visible" : "hidden";
for(var i = 0, o, l = objects.length; i < l; i ++){
o = objects[i];
o.style.visibility = v;
}
} Mask.prototype.show = function(){
var me = this;
resize();
ie == 6 && scroll();
$(window).on("resize", resize);
ie == 6 && $(window).on("scroll", scroll); var es = me.maskDom.style;
es.opacity = me.opacity;
es.zIndex = me.zIndex;
es.filter = "alpha(opacity=" + me.opacity * 100 + ")";
es.backgroundColor = me.bgColor; es.display = ''; sf && showObjects(false);
} Mask.prototype.hide = function(){
var es = me.maskDom.style;
es.display = 'none';
$(window).off("resize", resize);
ie == 6 && $(window).off("scroll", scroll);
sf && showObjects(true);
} } Mask.prototype.toHTMLString = function(){
return "<div id='PASSP__DIA__Mask' style='top:0px; left:0px; position:fixed; display:none;'>"
+("<iframe frameborder='0' style='"
+"filter:progid:DXImageTransform.Microsoft.Alpha(opacity:0);"
+"position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:-1' "
+"src='" + (window.location.protocol.toLowerCase() == "https:" ? "https://passport.passport.com/passApi/html/_blank.html" : "about:blank") + "'></iframe><div style='position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:-1;'> </div>") +"</div>";
} /**
* @description Dialog 弹层
* @class
* @name Dialog
* @param {Object} options 配置项
* @param {Number} options.width 弹层宽度
* @param {Number} options.height 弹层高度
* @param {Boolean} options.mask 是否需要遮罩层
* @param {String} options.titleText 标题
*/ function Dialog(options){
this.options = options;
this._width = this.options.width || "auto";
this._height = this.options.height || "auto";
this.dom = this.options.dom;
this._mask = this.options.mask || true;
this._titleText = this.options.title;
this._closeBtn = this.options.closeBtn || true,
this._eventMng = [];
this.onRender = this.options.onRender || function(){};
this._num = 'PASSP__DIA__'+Math.floor(Math.random() * 2147483648).toString(36).toUpperCase()+'_';
this.init()
} Dialog.renderMask = function(){
var me = this;
if(this._mask) return this;
this._mask = new Mask()
} Dialog._createElement = function(id){
var el = document.createElement('div');
el.id = id;
return el
} Dialog.prototype.setWidth = function(width){
this.el.style.width = width + 'px'
} Dialog.prototype.setHeight = function(height){
this.el.style.width = height + 'px' } Dialog.prototype.setSize = function(size){
this.setWidth(size.width || size[0])
this.setHeight(size.height || size[1])
} Dialog.prototype.setPosition = function(pos){
if(this.el.style.position == "static"){
this.el.style.position = 'absolute'
} if(typeof pos.left == "number")
this.el.style.left = pos.left + 'px'
if(typeof pos.top == "number")
this.el.style.top = pos.top + 'px'
} Dialog.prototype.show = function(){
if(this.options.beforeShow && this.options.beforeShow() === false)
return this;
this._mask && Dialog._mask.show();
this.el.style.display = "block";
this.dom.style.display = 'block';
this._isShown = true; } Dialog.prototype.hide = function(){
if(this.options.beforeHide && this.options.beforeHide() === false)
return this;
this._mask && Dialog._mask.hide();
this.el.style.display = "none";
this._isShown = false;
} Dialog.prototype.center = function(){
var bodyWidth = passport.page.getViewWidth();
var bodyHeight = passport.page.getViewHeight();
var left = (((bodyWidth - (this._width || this.el.offsetWidth)) / 2) | 0) + passport.page.getScrollLeft();
var top = (((bodyHeight - (this._height || this.el.offsetHeight)) / 2) | 0) + passport.page.getScrollTop();
this.setPosition({left: left,top: top });
} Dialog.prototype.init = function(){ this._createContainer() if(this._mask){
Dialog.renderMask()
} if(this._titleText){
this._createTitle()
} this._createBody(); this.show(); this._bind();
} Dialog.prototype._createContainer = function(){
this.el = Dialog._createElement(this._num + 'Container');
this.el.className = 'pass-dialog-container';
this.el.style.zIndex = this.zIndex || 1000;
if(this._width){
this.el.style.width = this._width + 'px';
}
if(this._height){
this.el.style.height = this._height + 'px';
} } Dialog.prototype._createTitle = function(){
var tit = Dialog._createElement(this._num + 'Title');
tit.className = 'pass-dialog-title';
var titleText = '<span class="pass-dialog-titText" id="'+this._num + 'titleText">'+this._titleText+'</span>'
tit.appendChild($(titleText).get(0))
this.el.appendChild(tit)
if(this._closeBtn){
var closeBtn = '<span class="pass-dialog-close" id="'+this._num + 'close">X</span>'
tit.appendChild($(closeBtn).get(0))
} } /*Dialog.prototype._createMask = function(){
//var height = Math.max(document.documentElement.scrollHeight,document.body.scrollHeight);
var mask = document.createElement('div'),
height = Math.max(document.documentElement.scrollHeight,document.body.scrollHeight);
mask.id = 'PASSP__DIAMASK__'+this._num;
mask.className = 'pass-dialog-mask';
mask.style.height = height + 'px';
this.el.appendChild(mask)
//$('body').append(this.maskDom)
//this.maskDom.height(height);
}*/ Dialog.prototype._createBody = function(){
var body = Dialog._createElement(this._num + 'Body') body.appendChild(this.dom) this.el.appendChild(body) document.body.appendChild(this.el)
} Dialog.prototype.addEvent = function(el, event, handler){
el.on(event, handler);
this._eventMng.push({
el: el,
event: event,
handler: handler
});
}; Dialog.prototype._bind = function(){
var me = this;
me.action = {
'close' : function(evt){
me.hide();
evt.preventDefault()
}
}
me.addEvent($("#"+me._num + 'close'),'click',me.action['close'])
} Dialog.prototype.destroy = function(){
for(var i = 0 , j = this._eventMng.length; i < j; i++){
var e = this._eventMng[i];
e.el.off(e.event, e.handler);
}
$(el).remove()
}