window.theme_columns_inheritance = {initialized: false, grid: 12, last: -1, count: 0}; var initColumnsClassname = function(__) { if ('theme_columns_inheritance' in window && ! theme_columns_inheritance.initialized) { theme_columns_inheritance.initialized = true; } return __; } var addColumsClassname = function(props, blockType, attributes) { if (blockType && attributes && typeof attributes === 'object' && blockType.name === 'core/columns' && 'columns' in attributes) { if ('theme_columns_inheritance' in window && ! theme_columns_inheritance.initialized) { return props; } var tci = window.theme_columns_inheritance; var cols = 1; var classes = []; var columns = parseInt(attributes.columns) || 1; if ('_id' in attributes && attributes._id && '_columns' in attributes && attributes._columns === columns) { return props; } attributes._id = lodash.uniqueId(); attributes._columns = columns; tci.last++; var index = parseInt(tci.last); var grid = parseInt(tci.grid); cols = grid / columns; tci[index] = { _id: attributes._id, _cols: cols, columns: attributes.columns }; tci.last = index; if ('update' in tci === false && attributes._columns !== columns) { tci.update = true; } else { tci.count++; } classes.push('row'); var _classes = props.className.replace(/(\srow)/g, ''); classes = lodash.union(props.className.split(' '), classes); classes = lodash.uniq(classes); props.className = classes.join(' '); console.log('columns', arguments); } return props; } var addColumnClassname = function(props, blockType, attributes) { if (blockType && attributes && typeof attributes === 'object' && blockType.name === 'core/column') { if ('theme_columns_inheritance' in window && ! theme_columns_inheritance.initialized) { return props; } var tci = window.theme_columns_inheritance; if ('_id' in attributes && attributes._id && '_columns' in attributes && tci.update) { return props; } var classes = []; var index = tci.last; var parent = tci[index]._id; var columns = parseInt(tci[index].columns); var col = parseInt(tci[index]._cols); for (var i = parseInt(tci.count); i > 0; i--) { if (columns === 0) { parent = tci[i]._id; columns = parseInt(tci[i].columns); col = parseInt(tci[i]._cols); } } if (! columns) { return props; } attributes._id = lodash.uniqueId(); attributes._parent = parent; attributes._columns = columns; attributes.columns = columns; tci[index].columns--; classes.push('col-' + col); var _classes = props.className.replace(/(\scol-\d)/g, ''); classes = lodash.union(_classes.split(' '), classes); classes = lodash.uniq(classes); props.className = classes.join(' '); console.log('column', arguments); } return props; } wp.hooks.addFilter('editor.BlockEdit', 'theme.initColumnsClassname', initColumnsClassname); wp.hooks.addFilter('blocks.getSaveContent.extraProps', 'theme.addColumsClassname', addColumsClassname); wp.hooks.addFilter('blocks.getSaveContent.extraProps', 'theme.addColumnClassname', addColumnClassname);