1 /**
  2  * @fileOverview view for kissy mvc : event delegation,el generator
  3  * @author yiminghe@gmail.com
  4  */
  5 KISSY.add("mvc/view", function (S, Node, Base) {
  6 
  7     var $ = Node.all;
  8 
  9     function normFn(self, f) {
 10         if (S.isString(f)) {
 11             return self[f];
 12         }
 13         return f;
 14     }
 15 
 16     /**
 17      * @name View
 18      * @class
 19      * View for delegating event on root element.
 20      * @memberOf MVC
 21      * @extends Base
 22      */
 23     function View() {
 24         View.superclass.constructor.apply(this, arguments);
 25         var events;
 26         if (events = this.get("events")) {
 27             this._afterEventsChange({
 28                 newVal:events
 29             });
 30         }
 31     }
 32 
 33     View.ATTRS =
 34     /**
 35      * @lends MVC.View#
 36      */
 37     {
 38         /**
 39          * Get root element for current view instance.
 40          * @type String
 41          * @example
 42          * <code>
 43          * //  selector :
 44          * .xx
 45          * // or html string
 46          * <div>my</div>
 47          * </code>
 48          */
 49         el:{
 50             value:"<div />",
 51             getter:function (s) {
 52                 if (S.isString(s)) {
 53                     s = $(s);
 54                     this.__set("el", s);
 55                 }
 56                 return s;
 57             }
 58         },
 59 
 60         /**
 61          * Delegate event on root element.
 62          * @type Object
 63          * @example
 64          * <code>
 65          * events:{
 66          *   selector:{
 67          *     eventType:callback
 68          *   }
 69          * }
 70          * </code>
 71          */
 72         events:{
 73 
 74         }
 75     };
 76 
 77 
 78     S.extend(View, Base,
 79         /**
 80          * @lends MVC.View#
 81          */
 82         {
 83 
 84             _afterEventsChange:function (e) {
 85                 var prevVal = e.prevVal;
 86                 if (prevVal) {
 87                     this._removeEvents(prevVal);
 88                 }
 89                 this._addEvents(e.newVal);
 90             },
 91 
 92             _removeEvents:function (events) {
 93                 var el = this.get("el");
 94                 for (var selector in events) {
 95                     var event = events[selector];
 96                     for (var type in event) {
 97                         var callback = normFn(this, event[type]);
 98                         el.undelegate(type, selector, callback, this);
 99                     }
100                 }
101             },
102 
103             _addEvents:function (events) {
104                 var el = this.get("el");
105                 for (var selector in events) {
106                     var event = events[selector];
107                     for (var type in event) {
108                         var callback = normFn(this, event[type]);
109                         el.delegate(type, selector, callback, this);
110                     }
111                 }
112             },
113 
114             render:function () {
115                 return this;
116             },
117 
118             /**
119              * Remove root element.
120              */
121             destroy:function () {
122                 this.get("el").remove();
123             }
124 
125         });
126 
127     return View;
128 
129 }, {
130     requires:['node', 'base']
131 });