1 /** 2 * @fileOverview support standard mod for component 3 * @author yiminghe@gmail.com 4 */ 5 KISSY.add("component/uibase/stdmodrender", function (S, Node) { 6 7 8 var CLS_PREFIX = "ks-stdmod-"; 9 10 function StdMod() { 11 } 12 13 StdMod.ATTRS = { 14 header:{ 15 }, 16 body:{ 17 }, 18 footer:{ 19 }, 20 bodyStyle:{ 21 sync:false 22 }, 23 footerStyle:{ 24 sync:false 25 }, 26 headerStyle:{ 27 sync:false 28 }, 29 headerContent:{ 30 sync:false 31 }, 32 bodyContent:{ 33 sync:false 34 }, 35 footerContent:{ 36 sync:false 37 } 38 }; 39 40 function serialize(css) { 41 var str = ""; 42 if (css) { 43 for (var i in css) { 44 if (css.hasOwnProperty(i)) { 45 str += i + ":" + css[i] + ";" 46 } 47 } 48 } 49 return str; 50 } 51 52 StdMod.HTML_PARSER = { 53 header:function (el) { 54 return el.one("." + CLS_PREFIX + "header"); 55 }, 56 body:function (el) { 57 return el.one("." + CLS_PREFIX + "body"); 58 }, 59 footer:function (el) { 60 return el.one("." + CLS_PREFIX + "footer"); 61 } 62 }; 63 64 function renderUI(self, part) { 65 var el = self.get("contentEl"), 66 style = self.get(part + "Style"), 67 content = self.get(part + "Content"), 68 isString = S.isString(content), 69 partEl = self.get(part); 70 if (!partEl) { 71 style = serialize(style); 72 partEl = new Node("<div class='" + 73 CLS_PREFIX + part + "'" + 74 " " + 75 (style ? ("style='" + style + "'") : "") + 76 " >" + 77 (isString ? content : "") + 78 "</div>"); 79 if (!isString) { 80 partEl.append(content); 81 } 82 partEl.appendTo(el); 83 self.__set(part, partEl); 84 } else if (style) { 85 partEl.css(style); 86 } 87 } 88 89 90 function _setStdModContent(self, part, v) { 91 part = self.get(part); 92 if (S.isString(v)) { 93 part.html(v); 94 } else { 95 part.html("") 96 .append(v); 97 } 98 } 99 100 StdMod.prototype = { 101 102 __createDom:function () { 103 renderUI(this, "header"); 104 renderUI(this, "body"); 105 renderUI(this, "footer"); 106 }, 107 108 _uiSetBodyStyle:function (v) { 109 this.get("body").css(v); 110 }, 111 112 _uiSetHeaderStyle:function (v) { 113 this.get("header").css(v); 114 }, 115 _uiSetFooterStyle:function (v) { 116 this.get("footer").css(v); 117 }, 118 119 _uiSetBodyContent:function (v) { 120 _setStdModContent(this, "body", v); 121 }, 122 123 _uiSetHeaderContent:function (v) { 124 _setStdModContent(this, "header", v); 125 }, 126 127 _uiSetFooterContent:function (v) { 128 _setStdModContent(this, "footer", v); 129 } 130 }; 131 132 return StdMod; 133 134 }, { 135 requires:['node'] 136 });