Using grapesjs with custom blocks I need
and I do it as with timer:
let has_opened_block= false
setTimeout(() => {
console.log('setTimeout::')
var closedBlocks = ['Templates', 'Blocks', 'Images', 'Basic', 'Extra', 'forms']; // I need to collapse these blocks and move them to the bottom
gjsEditor.Blocks.getCategories().forEach(ct => {
ct.set('open', false);
if(!has_opened_block) { // to open only 1st block which is not in closedBlocks
if (!closedBlocks.includes(ct.id)) {
has_opened_block = true
ct.set('open', true);
}
}
});
const bm = gjsEditor.BlockManager;
var blocksToRender= [ // I want to see these blocks at top
bm.get('h2'),
bm.get('d5'),
bm.get('f4')
]
for (var i=0; i< closedBlocks.length;i++) { // I want to see all blocks which are not in blocksToRender at bottom
blocksToRender[blocksToRender.length]= bm.get(closedBlocks[i])
}
bm.render( blocksToRender )
}, 8000)
But as result I see 9 blocks, but which looks like empty : https://prnt.sc/86w-dqziZakn
Also I can not drag and drop content of these blocks - nothing is dropped.
What is wrong in my blocks ordering ?
Thanks!