1 /** 2 * @fileOverview mask extension for kissy 3 * @author yiminghe@gmail.com 4 */ 5 KISSY.add("component/uibase/maskrender", function (S, UA, Node) { 6 7 /** 8 * 每组相同 prefixCls 的 position 共享一个遮罩 9 */ 10 var maskMap = { 11 /** 12 * { 13 * node: 14 * num: 15 * } 16 */ 17 18 }, 19 ie6 = (UA['ie'] === 6), 20 $ = Node.all; 21 22 function getMaskCls(self) { 23 return self.get("prefixCls") + "ext-mask"; 24 } 25 26 function docWidth() { 27 return ie6 ? ("expression(KISSY.DOM.docWidth())") : "100%"; 28 } 29 30 function docHeight() { 31 return ie6 ? ("expression(KISSY.DOM.docHeight())") : "100%"; 32 } 33 34 function initMask(maskCls) { 35 var mask = $("<div " + 36 " style='width:" + docWidth() + ";" + 37 "left:0;" + 38 "top:0;" + 39 "height:" + docHeight() + ";" + 40 "position:" + (ie6 ? "absolute" : "fixed") + ";'" + 41 " class='" + 42 maskCls + 43 "'>" + 44 (ie6 ? "<" + "iframe " + 45 "style='position:absolute;" + 46 "left:" + "0" + ";" + 47 "top:" + "0" + ";" + 48 "background:red;" + 49 "width: expression(this.parentNode.offsetWidth);" + 50 "height: expression(this.parentNode.offsetHeight);" + 51 "filter:alpha(opacity=0);" + 52 "z-index:-1;'></iframe>" : "") + 53 "</div>") 54 .prependTo("body"); 55 /** 56 * 点 mask 焦点不转移 57 */ 58 mask.unselectable(); 59 mask.on("mousedown", function (e) { 60 e.preventDefault(); 61 }); 62 return mask; 63 } 64 65 function Mask() { 66 } 67 68 Mask.ATTRS = { 69 maskShared:{ 70 value:true 71 } 72 } 73 74 Mask.prototype = { 75 76 _maskExtShow:function () { 77 var self = this, 78 maskCls = getMaskCls(self), 79 maskDesc = maskMap[maskCls], 80 maskShared = self.get("maskShared"), 81 mask = self.get("maskNode"); 82 if (!mask) { 83 if (maskShared) { 84 if (maskDesc) { 85 mask = maskDesc.node; 86 } else { 87 mask = initMask(maskCls); 88 maskDesc = maskMap[maskCls] = { 89 num:0, 90 node:mask 91 }; 92 } 93 } else { 94 mask = initMask(maskCls); 95 } 96 self.__set("maskNode", mask); 97 } 98 mask.css("z-index", self.get("zIndex") - 1); 99 if (maskShared) { 100 maskDesc.num++; 101 } 102 if (!maskShared || maskDesc.num == 1) { 103 mask.show(); 104 } 105 }, 106 107 _maskExtHide:function () { 108 var self = this, 109 maskCls = getMaskCls(self), 110 maskDesc = maskMap[maskCls], 111 maskShared = self.get("maskShared"), 112 mask = self.get("maskNode"); 113 if (maskShared && maskDesc) { 114 maskDesc.num = Math.max(maskDesc.num - 1, 0); 115 if (maskDesc.num == 0) { 116 mask.hide(); 117 } 118 } else { 119 mask.hide(); 120 } 121 }, 122 123 __destructor:function () { 124 var self = this, 125 maskShared = self.get("maskShared"), 126 mask = self.get("maskNode"); 127 if (self.get("maskNode")) { 128 if (maskShared) { 129 if (self.get("visible")) { 130 self._maskExtHide(); 131 } 132 } else { 133 mask.remove(); 134 } 135 } 136 } 137 138 }; 139 140 return Mask; 141 }, { 142 requires:["ua", "node"] 143 }); 144 145 /** 146 * TODO 147 * - mask index 隐藏时不会恢复 z-index,需要业务架构自己实现 DialogManager 148 **/