Container content not loading

I’m very impressed with this project, I’ve been trying to find the right balance between user-edits & avoiding page breakage for some time, and this is perfect!

I’m having problems loading a page that has containers in it. In the saved JSON I can see the data that is supposed to go into the containers, but all I see on the page are placeholders. My test page uses this block information:

[{"template":"Hero2","fields":[{"name":"bighead","type":"html","html":"Heading"},{"name":"col1","type":"container","blocks":[{"template":"Heading 1","fields":[{"name":"text","type":"html","html":"Heading 1"}]}],"html":"<div class=\"col-md-4 bre-field-container bre-field-selected\" data-bre-field=\"{ 'name' : 'col1', 'type': 'container' }\"><h1>Heading 1<\/h1><\/div>"},{"name":"col2","type":"container","blocks":[{"template":"Heading 2","fields":[{"name":"text","type":"html","html":"Heading 2"}]}],"html":"<div class=\"col-md-4 bre-field-container bre-field-selected\" data-bre-field=\"{ 'name' : 'col2', 'type': 'container' }\"><h2>Heading 2<\/h2><\/div>"},{"name":"col3","type":"container","blocks":[{"template":"Heading 3","fields":[{"name":"text","type":"html","html":"Heading 3"}]}],"html":"<div class=\"col-md-4 bre-field-container bre-field-selected\" data-bre-field=\"{ 'name' : 'col3', 'type': 'container' }\"><h3>Heading 3<\/h3><\/div>"}]}]

I don’t know if the problem is related to the escaped quotes (") in the encoded html fields, but when I try to trace through the editor code, it always has an empty blocks parameter when deciding whether to put a placeholder in the container, and two lines before the call to this.togglePlaceholderIfNeed() this.blocks is set to [ ].

In case it helps to see where I’ve gone wrong, here is the template:

<div class="bre-template" data-name="Hero2">
<div class="bre-template-preview">
    <div class='row'>
        <div class='text-center col-12'><b style='font-size:12px;'>Hero2 Big Heading</b></div>
    </div>
    <div class='row'>
        <div class='border border-primary col-4'>container</div>
        <div class='border border-primary col-4'>container</div>
        <div class='border border-primary col-4'>container</div>
    </div>
</div>
<div class="row">
    <div class="col">
    <h1 class="display-2 ny5-fancy-title" data-bre-field='{"name":"bighead", "type":"html"}'>Heading</h1>
    </div>
</div>
<div class="row">
    <div class='col-md-4' data-bre-field="{ 'name' : 'col1', 'type': 'container' }"></div>
    <div class='col-md-4' data-bre-field="{ 'name' : 'col2', 'type': 'container' }"></div>
    <div class='col-md-4' data-bre-field="{ 'name' : 'col3', 'type': 'container' }"></div>
</div>
</div>

[geekbrit]

Hmm… my gist worked on the simple test case I was using, but when you add more code to the containers it starts to fall apart. There are also some inconsistencies in the json data where sometimes you have to replace the contents of a div with the supplied html, and sometimes you have to replace the div with the supplied html. I’m rethinking using this editor because there isn’t an easy way to use the generated pages without having the editor in the page.

On the plus side, I found that there is a small bug in the code that when fixed reveals a very nice extra tools widget - line 1584 “this.buttons = editor.options.htmlToolsButtons;” is stopping the tools appearing, I think the conditional around this line should go around the buttons definition just above.

[geekbrit]

Hi Susan, sure… But it maybe a couple of weeks, we’re driving across the whole US and back!

My example isn’t complete - eventually it will save the HTML to a file, which will be used to serve the page. This function runs only when changes are made with the editor.

On Mon, Jun 4, 2018, 2:56 PM Susan [e-mail] wrote:

Hey @geekbrit https://github.com/geekbrit ! Do you mind showing example of using your PHP script? It is not registering in this old head.

Thanks.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/yakovlevga/brickyeditor/issues/32#issuecomment-394478885, or mute the thread https://github.com/notifications/unsubscribe-auth/ABL9SZkyOLsuFDyfEzX8Yodtn4WnnoFpks5t5ZEBgaJpZM4UWlBN .