src/basis/ui.js
function(super_){
    return {
      // methods
      insertBefore: function(newChild, refChild){
        /** @cut */ if (this.noChildNodesElement_)
        /** @cut */ {
        /** @cut */   delete this.noChildNodesElement_;
        /** @cut */   basis.dev.warn('basis.ui: Template has no childNodesElement container, but insertBefore method called; probably it\'s a bug');
        /** @cut */ }

        // inherit
        newChild = super_.insertBefore.call(this, newChild, refChild);

        var target = newChild.groupNode || this;
        var container = target.childNodesElement || this.childNodesElement;

        var nextSibling = newChild.nextSibling;
        var insertPoint = nextSibling && nextSibling.element.parentNode == container ? nextSibling.element : null;

        var childElement = newChild.element;
        var refNode = insertPoint || container.insertPoint || null; // NOTE: null at the end for IE

        if (childElement.parentNode !== container || childElement.nextSibling !== refNode) // prevent dom update
          container.insertBefore(childElement, refNode);

        return newChild;
      },
      removeChild: function(oldChild){
        // inherit
        super_.removeChild.call(this, oldChild);

        // remove from dom
        var element = oldChild.element;
        var parent = element.parentNode;

        if (parent)
          parent.removeChild(element);

        return oldChild;
      },
      clear: function(alive){
        // if not alive mode node element will be removed on node destroy
        if (alive)
        {
          var node = this.firstChild;
          while (node)
          {
            var element = node.element;
            var parent = element.parentNode;

            if (parent)
              parent.removeChild(element);

            node = node.nextSibling;
          }
        }

        // inherit
        super_.clear.call(this, alive);
      },
      setChildNodes: function(childNodes, keepAlive){
        /** @cut */ if (this.noChildNodesElement_)
        /** @cut */ {
        /** @cut */   delete this.noChildNodesElement_;
        /** @cut */   basis.dev.warn('basis.ui: Template has no childNodesElement container, but setChildNodes method called; probably it\'s a bug');
        /** @cut */ }

        // reallocate childNodesElement to new DocumentFragment
        var domFragment = document.createDocumentFragment();
        var target = this.grouping || this;
        var container = target.childNodesElement;

        // set child nodes element points to DOM fragment
        target.childNodesElement = domFragment;

        // call inherit method
        // NOTE: make sure that dispatching childNodesModified event handlers are not sensetive
        // for child node positions at real DOM (html document), because all new child nodes
        // will be inserted into temporary DocumentFragment that will be inserted into html document
        // later (after inherited method call)
        super_.setChildNodes.call(this, childNodes, keepAlive);

        // flush dom fragment nodes into container
        container.insertBefore(domFragment, container.insertPoint || null); // NOTE: null at the end for IE

        // restore childNodesElement
        target.childNodesElement = container;
      }
    };
  }
function(super_){
    return {
      // methods
      insertBefore: function(newChild, refChild){
        /** @cut */ if (this.noChildNodesElement_)
        /** @cut */ {
        /** @cut */   delete this.noChildNodesElement_;
        /** @cut */   basis.dev.warn('basis.ui: Template has no childNodesElement container, but insertBefore method called; probably it\'s a bug');
        /** @cut */ }

        // inherit
        newChild = super_.insertBefore.call(this, newChild, refChild);

        var target = newChild.groupNode || this;
        var container = target.childNodesElement || this.childNodesElement;

        var nextSibling = newChild.nextSibling;
        var insertPoint = nextSibling && nextSibling.element.parentNode == container ? nextSibling.element : null;

        var childElement = newChild.element;
        var refNode = insertPoint || container.insertPoint || null; // NOTE: null at the end for IE

        if (childElement.parentNode !== container || childElement.nextSibling !== refNode) // prevent dom update
          container.insertBefore(childElement, refNode);

        return newChild;
      },
      removeChild: function(oldChild){
        // inherit
        super_.removeChild.call(this, oldChild);

        // remove from dom
        var element = oldChild.element;
        var parent = element.parentNode;

        if (parent)
          parent.removeChild(element);

        return oldChild;
      },
      clear: function(alive){
        // if not alive mode node element will be removed on node destroy
        if (alive)
        {
          var node = this.firstChild;
          while (node)
          {
            var element = node.element;
            var parent = element.parentNode;

            if (parent)
              parent.removeChild(element);

            node = node.nextSibling;
          }
        }

        // inherit
        super_.clear.call(this, alive);
      },
      setChildNodes: function(childNodes, keepAlive){
        /** @cut */ if (this.noChildNodesElement_)
        /** @cut */ {
        /** @cut */   delete this.noChildNodesElement_;
        /** @cut */   basis.dev.warn('basis.ui: Template has no childNodesElement container, but setChildNodes method called; probably it\'s a bug');
        /** @cut */ }

        // reallocate childNodesElement to new DocumentFragment
        var domFragment = document.createDocumentFragment();
        var target = this.grouping || this;
        var container = target.childNodesElement;

        // set child nodes element points to DOM fragment
        target.childNodesElement = domFragment;

        // call inherit method
        // NOTE: make sure that dispatching childNodesModified event handlers are not sensetive
        // for child node positions at real DOM (html document), because all new child nodes
        // will be inserted into temporary DocumentFragment that will be inserted into html document
        // later (after inherited method call)
        super_.setChildNodes.call(this, childNodes, keepAlive);

        // flush dom fragment nodes into container
        container.insertBefore(domFragment, container.insertPoint || null); // NOTE: null at the end for IE

        // restore childNodesElement
        target.childNodesElement = container;
      }
    };
  }
function ( super_ ) { return { // methods insertBefore : function ( newChild , refChild ) { /** @cut */ if ( this . noChildNodesElement_ ) /** @cut */ { /** @cut */ delete this . noChildNodesElement_ ; /** @cut */ basis . dev . warn ( 'basis.ui: Template has no childNodesElement container, but insertBefore method called; probably it\'s a bug' ) ; /** @cut */ } // inherit newChild = super_ . insertBefore . call ( this , newChild , refChild ) ; var target = newChild . groupNode || this ; var container = target . childNodesElement || this . childNodesElement ; var nextSibling = newChild . nextSibling ; var insertPoint = nextSibling && nextSibling . element . parentNode == container ? nextSibling . element : null ; var childElement = newChild . element ; var refNode = insertPoint || container . insertPoint || null ; // NOTE: null at the end for IE if ( childElement . parentNode !== container || childElement . nextSibling !== refNode ) // prevent dom update container . insertBefore ( childElement , refNode ) ; return newChild ; } , removeChild : function ( oldChild ) { // inherit super_ . removeChild . call ( this , oldChild ) ; // remove from dom var element = oldChild . element ; var parent = element . parentNode ; if ( parent ) parent . removeChild ( element ) ; return oldChild ; } , clear : function ( alive ) { // if not alive mode node element will be removed on node destroy if ( alive ) { var node = this . firstChild ; while ( node ) { var element = node . element ; var parent = element . parentNode ; if ( parent ) parent . removeChild ( element ) ; node = node . nextSibling ; } } // inherit super_ . clear . call ( this , alive ) ; } , setChildNodes : function ( childNodes , keepAlive ) { /** @cut */ if ( this . noChildNodesElement_ ) /** @cut */ { /** @cut */ delete this . noChildNodesElement_ ; /** @cut */ basis . dev . warn ( 'basis.ui: Template has no childNodesElement container, but setChildNodes method called; probably it\'s a bug' ) ; /** @cut */ } // reallocate childNodesElement to new DocumentFragment var domFragment = document . createDocumentFragment ( ) ; var target = this . grouping || this ; var container = target . childNodesElement ; // set child nodes element points to DOM fragment target . childNodesElement = domFragment ; // call inherit method // NOTE: make sure that dispatching childNodesModified event handlers are not sensetive // for child node positions at real DOM (html document), because all new child nodes // will be inserted into temporary DocumentFragment that will be inserted into html document // later (after inherited method call) super_ . setChildNodes . call ( this , childNodes , keepAlive ) ; // flush dom fragment nodes into container container . insertBefore ( domFragment , container . insertPoint || null ) ; // NOTE: null at the end for IE // restore childNodesElement target . childNodesElement = container ; } } ; }
Template mixin for containers classes
@mixin
Template mixin for containers classes