1 /** 2 * @fileOverview simple menuitem render 3 * @author yiminghe@gmail.com 4 */ 5 KISSY.add("menu/menuitemRender", function (S, Node, Component) { 6 7 var CHECK_CLS = "ks-menuitem-checkbox"; 8 9 function setUpCheckEl(self) { 10 var el = self.get("el"), 11 checkEl = el.one("." + CHECK_CLS); 12 if (!checkEl) { 13 checkEl = new Node("<div class='" + CHECK_CLS + "'/>").prependTo(el); 14 // if not ie will lose focus when click 15 checkEl.unselectable(); 16 } 17 return checkEl; 18 } 19 20 return Component.Render.extend({ 21 22 _uiSetChecked:function (v) { 23 var self = this, 24 el = self.get("el"), 25 cls = self.getComponentCssClassWithState("-checked"); 26 el[v ? 'addClass' : 'removeClass'](cls); 27 }, 28 29 _uiSetSelected:function (v) { 30 var self = this, 31 el = self.get("el"), 32 cls = self.getComponentCssClassWithState("-selected"); 33 el[v ? 'addClass' : 'removeClass'](cls); 34 }, 35 36 _uiSetSelectable:function (v) { 37 this.get("el").attr("role", v ? 'menuitemradio' : 'menuitem'); 38 }, 39 40 _uiSetCheckable:function (v) { 41 if (v) { 42 setUpCheckEl(this); 43 } 44 this.get("el").attr("role", v ? 'menuitemcheckbox' : 'menuitem'); 45 }, 46 47 containsElement:function (element) { 48 var el = this.get("el"); 49 return el && ( el[0] == element || el.contains(element)); 50 } 51 }, { 52 ATTRS:{ 53 elAttrs:{ 54 valueFn:function () { 55 return { 56 role:"menuitem", 57 id:S.guid("ks-menuitem") 58 }; 59 } 60 }, 61 selected:{}, 62 // @inheritedDoc 63 // content:{}, 64 // 属性必须声明,否则无法和 _uiSetChecked 绑定在一起 65 checked:{} 66 }, 67 HTML_PARSER:{ 68 selectable:function (el) { 69 var cls = this.getCssClassWithPrefix("menuitem-selectable"); 70 return el.hasClass(cls); 71 }, 72 checkable:function (el) { 73 var cls = this.getCssClassWithPrefix("menuitem-checkable"); 74 return el.hasClass(cls); 75 } 76 } 77 }); 78 }, { 79 requires:['node', 'component'] 80 });