nested-includer.html

<script>
    NestedIncluderBehavior = {
        properties: {
            inContentMode: {
                type: Boolean,
                value: false,
                notify: true
            },

            inEditMode: {
                type: Boolean,
                value: false,
                notify: true
            },

            parentId: {
                type: String,
                notify: true
            },

            innercomponents: {
                type: Object,
                notify: true
            },

            path: {
                type: String,
                notify: true
            }
        },

        ready: function() {
            this._handleCssGrids();
        },

        _handleCssGrids: function() {
            var contentDivs = Polymer.dom(this.root).querySelectorAll('content-slot');
                for(var i =0 ; i < contentDivs.length; i++) {
                    var cssGrid = document.createElement('css-grid'),
                        contentDivId = contentDivs[i].getAttribute('id'),
                        path = this.path + this.id + '/components/' + contentDivId + '/',
                        rawcomponents = !!this.innercomponents ? JSON.stringify(this.innercomponents[contentDivId]) : '{}';

                    cssGrid.setAttribute('path', path);
                    if(this.inEditMode) {
                        cssGrid.setAttribute('in-edit-mode', this.inEditMode);
                        cssGrid.addDragEvents();
                    }

                    if(this.inContentMode) {
                        cssGrid.setAttribute('in-content-mode', this.inContentMode);
                    }

                    cssGrid.setAttribute('rawcomponents', rawcomponents);
                    Polymer.dom(this.root).insertBefore(cssGrid, contentDivs[i]);
                }
        }
    }
</script>