/**
 * @overview <i>ccm</i> component for content
 * @author André Kless <andre.kless@web.de> 2016
 * @license The MIT License (MIT)
 */

ccm.component( /** @lends ccm.components.content */ {

  /*-------------------------------------------- public component members --------------------------------------------*/

  /**
   * @summary component index
   * @type {ccm.types.index}
   */
  index: 'content',

  /*-------------------------------------------- public component classes --------------------------------------------*/

  /**
   * @summary constructor for creating <i>ccm</i> instances out of this component
   * @class
   */
  Instance: function () {

    /*------------------------------------- private and public instance members --------------------------------------*/

    /**
     * @summary own context
     * @private
     */
    var self = this;

    /**
     * @summary contains privatized config members
     * @type {ccm.components.config.types.config}
     */
    var my;

    /*------------------------------------------- public instance methods --------------------------------------------*/

    /**
     * @summary initialize <i>ccm</i> instance
     * @description
     * Called one-time when this <i>ccm</i> instance is created, all dependencies are solved and before dependent <i>ccm</i> components, instances and datastores are initialized.
     * This method will be removed by <i>ccm</i> after the one-time call.
     * @param {function} callback - callback when this instance is initialized
     */
    this.init = function ( callback ) {

      // privatize security relevant config members
      my = ccm.helper.privatize( self, 'innerHTML' );

      // perform callback
      callback();

    };

    /**
     * @summary render content in own website area
     * @param {function} [callback] - callback when content is rendered
     */
    this.render = function ( callback ) {

      /**
       * already existing inner HTML structure of own website area
       * @type {ccm.types.element}
       */
      var $html = self.element.contents();

      /**
       * website area for own content
       * @type {ccm.types.element}
       */
      var $element = ccm.helper.element( self );

      // render call for ccm instances of inner website areas
      $html.each( function () {
        if ( this.tagName && this.tagName.indexOf( 'CCM-' ) === 0 ) {
          var split = this.tagName.toLowerCase().split( '-' );
          switch ( split[ 1 ] ) {
            case 'load':
            case 'component':
            case 'instance':
            case 'proxy':
            case 'store':
            case 'dataset':
            case 'list':
              return;
          }
          self[ split.length < 3 ? split[ 1 ] : split[ 2 ] ].render();
        }
      } );

      // put already existing inner HTML structure in website area for own content
      $element.html( $html );

      // append content for own website area
      if ( my.innerHTML )
        if ( Array.isArray( my.innerHTML ) )
          my.innerHTML.map( function ( content ) {
            $element.append( ccm.helper.isElement( content ) ? content : ccm.helper.html( content ) );
          } );
        else
          $element.append( ccm.helper.isElement( my.innerHTML ) ? my.innerHTML : ccm.helper.html( my.innerHTML ) );

      // perform callback
      if ( callback ) callback();

    };

  }

  /*------------------------------------------------ type definitions ------------------------------------------------*/

  /**
   * @namespace ccm.components.content
   */

  /**
   * @namespace ccm.components.content.types
   */

  /**
   * @summary <i>ccm</i> instance configuration
   * @typedef {ccm.config} ccm.components.content.types.config
   * @property {ccm.types.element} element - <i>ccm</i> instance website area
   * @property {ccm.types.dependency} style - CSS for own website area
   * @property {string} classes - HTML classes for own website area
   * @property {string|ccm.types.html|ccm.types.element|Array.<string|ccm.types.html|ccm.types.element>} my.innerHTML - content for own website area
   * @example {
   *   element: jQuery( 'body' ),
   *   style:   [ ccm.load, '../config/layout.css' ],
   *   classes: 'ccm-config',
   *   innerHTML: [ 'Hello, <b>World</b>!', { tag: 'br' }, jQuery( '<i>this is example content</i>' ) ]
   * }
   */

  /**
   * @external ccm.types
   * @see {@link http://akless.github.io/ccm-developer/api/ccm/ccm.types.html}
   */

} );
@@ -2280,16 +2280,83 @@
 e areas%0A
+      callRender( $html );%0A%0A      function callRender( $html ) %7B%0A  
       $h
@@ -2375,24 +2375,26 @@
 nction () %7B%0A
+  
         if (
@@ -2457,24 +2457,26 @@
 %7B%0A          
+  
 var split = 
@@ -2526,16 +2526,18 @@
         
+ 
+ 
 switch (
@@ -2560,24 +2560,26 @@
             
+  
 case 'load':
@@ -2579,16 +2579,18 @@
 'load':%0A
+  
         
@@ -2619,24 +2619,26 @@
             
+  
 case 'instan
@@ -2650,24 +2650,26 @@
             
+  
 case 'proxy'
@@ -2678,24 +2678,26 @@
             
+ 
+ 
 case 'store'
@@ -2694,24 +2694,26 @@
 se 'store':%0A
+  
             
@@ -2724,24 +2724,26 @@
  'dataset':%0A
+  
             
@@ -2769,16 +2769,18 @@
         
+  
 return;%0A
@@ -2785,26 +2785,30 @@
 ;%0A          
-%7D%0A
+  %7D%0A  
           se
@@ -2874,24 +2874,26 @@
         
+  
 %7D%0A      
 %7D );%0A%0A  
@@ -2884,20 +2884,98 @@
 %7D%0A      
-%7D );
+    else%0A            callRender( jQuery( this ).children() );%0A        %7D );%0A      %7D
 %0A%0A      

update ccm.content.js - recursive search for inner "ccm-" tags for render call