Merge f76acc7 into 962a2f6

src/view/component.js

@@ -453,11 +453,11 @@ Component.prototype.fire = function (name, event) {
     var me = this;
     // #[begin] devtool
     emitDevtool('comp-event', {
-        name: name, 
-        event: event, 
+        name: name,
+        event: event,
         target: this
     });
-    // #[end] 
+    // #[end]
 
     each(this.listeners[name], function (listener) {
         listener.fn.call(me, event);
@@ -520,7 +520,7 @@ Component.prototype.dispatch = function (name, value) {
             // #[begin] devtool
             emitDevtool('comp-message', {
                 target: this,
-                value: value, 
+                value: value,
                 name: name,
                 receiver: parentComponent
             });
@@ -538,7 +538,7 @@ Component.prototype.dispatch = function (name, value) {
 
     // #[begin] devtool
     emitDevtool('comp-message', {target: this, value: value, name: name});
-    // #[end]    
+    // #[end]
 };
 
 /**

src/view/is-node.js

@@ -0,0 +1,117 @@
+/**
+ * Copyright (c) Baidu Inc. All rights reserved.
+ *
+ * This source code is licensed under the MIT license.
+ * See LICENSE file in the project root for license information.
+ *
+ * @file is 指令节点类
+ */
+
+var guid = require('../util/guid');
+var insertBefore = require('../browser/insert-before');
+var evalExpr = require('../runtime/eval-expr');
+var NodeType = require('./node-type');
+var createNode = require('./create-node');
+var createReverseNode = require('./create-reverse-node');
+var nodeOwnCreateStump = require('./node-own-create-stump');
+var nodeOwnSimpleDispose = require('./node-own-simple-dispose');
+
+/**
+ * is 指令节点类
+ *
+ * @class
+ * @param {Object} aNode 抽象节点
+ * @param {Node} parent 父亲节点
+ * @param {Model} scope 所属数据环境
+ * @param {Component} owner 所属组件环境
+ * @param {DOMChildrenWalker?} reverseWalker 子元素遍历对象
+ */
+function IsNode(aNode, parent, scope, owner, reverseWalker) {
+    this.aNode = aNode;
+    this.owner = owner;
+    this.scope = scope;
+    this.parent = parent;
+    this.parentComponent = parent.nodeType === NodeType.CMPT
+        ? parent
+        : parent.parentComponent;
+
+    this.id = guid++;
+    this.children = [];
+
+    // #[begin] reverse
+    if (reverseWalker) {
+        var tagName = evalExpr(this.aNode.directives['is'].value, this.scope, this.owner);
+        if (tagName) { // eslint-disable-line dot-notation
+            this.children[0] = createReverseNode(
+                this.aNode.isRinsed,
+                this,
+                this.scope,
+                this.owner,
+                reverseWalker
+            );
+        }
+
+        this._create();
+        insertBefore(this.el, reverseWalker.target, reverseWalker.current);
+    }
+    // #[end]
+}
+
+IsNode.prototype.nodeType = NodeType.IS;
+
+IsNode.prototype._create = nodeOwnCreateStump;
+IsNode.prototype.dispose = nodeOwnSimpleDispose;
+
+/**
+ * attach到页面
+ *
+ * @param {HTMLElement} parentEl 要添加到的父元素
+ * @param {HTMLElement＝} beforeEl 要添加到哪个元素之前
+ */
+IsNode.prototype.attach = function (parentEl, beforeEl) {
+    var tagName = evalExpr(this.aNode.directives['is'].value, this.scope, this.owner);// eslint-disable-line dot-notation
+    if (tagName) {
+        var child = createNode(this.aNode.isRinsed, this, this.scope, this.owner);
+
+        if (child) {
+            this.tagName = tagName;
+            this.children[0] = child;
+            child.attach(parentEl, beforeEl);
+        }
+    }
+
+    this._create();
+    insertBefore(this.el, parentEl, beforeEl);
+};
+
+/**
+ * 视图更新函数
+ *
+ * @param {Array} changes 数据变化信息
+ */
+IsNode.prototype._update = function (changes) {
+    var me = this;
+    var childANode = this.aNode.isRinsed;
+    var child = this.children[0];
+    var tagName = evalExpr(this.aNode.directives['is'].value, this.scope); // eslint-disable-line dot-notation
+
+    if (tagName === this.tagName) {
+        child && child._update(changes);
+    }
+    else {
+        child._ondisposed = newChild;
+            child.dispose();
+    }
+
+    function newChild() {
+        me.child = createNode(childANode, me, me.scope, me.owner)
+            .attach(me.el.parentNode, me.el);
+    }
+};
+
+IsNode.prototype._getElAsRootNode = function () {
+    var child = this.children[0];
+    return child && child.el || this.el;
+};
+
+exports = module.exports = IsNode;

src/view/node-type.js

@@ -21,7 +21,8 @@ var NodeType = {
     CMPT: 5,
     SLOT: 6,
     TPL: 7,
-    LOADER: 8
+    LOADER: 8,
+    IS: 9
 };
 
 exports = module.exports = NodeType;

src/view/preheat-a-node.js

@@ -20,6 +20,7 @@ var TextNode = require('./text-node');
 var SlotNode = require('./slot-node');
 var ForNode = require('./for-node');
 var IfNode = require('./if-node');
+var IsNode = require('./is-node');
 var TemplateNode = require('./template-node');
 var Element = require('./element');
 
@@ -197,6 +198,21 @@ function preheatANode(aNode, componentInstance) {
                     aNode = aNode.forRinsed;
                 }
 
+                if (aNode.directives['is']) {
+                    aNode.isRinsed = {
+                        children: aNode.children,
+                        props: aNode.props,
+                        events: aNode.events,
+                        tagName: aNode.tagName,
+                        vars: aNode.vars,
+                        hotspot: aNode.hotspot,
+                        directives: extend({}, aNode.directives)
+                    };
+                    aNode.hotspot.hasRootNode = true;
+                    aNode.Clazz = IsNode;
+                    aNode = aNode.isRinsed;
+                }
+
                 switch (aNode.tagName) {
                     case 'slot':
                         aNode.Clazz = SlotNode;
@@ -210,7 +226,7 @@ function preheatANode(aNode, componentInstance) {
 
                     default:
                         if (hotTags[aNode.tagName]) {
-                            if (!aNode.directives.is 
+                            if (!aNode.directives.is
                                 && (!componentInstance || !componentInstance.components[aNode.tagName])
                             ) {
                                 aNode.Clazz = Element;