@innovastudio/contentbuilder 1.4.148 → 1.4.150
Sign up to get free protection for your applications and to get access to all the features.
package/package.json
CHANGED
@@ -11958,7 +11958,6 @@ const prepareSvgIcons = builder => {
|
|
11958
11958
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 15h2" /><path d="M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14z" /><path d="M11 12h6" /><path d="M13 9h4" />
|
11959
11959
|
</symbol>
|
11960
11960
|
|
11961
|
-
|
11962
11961
|
<symbol id="icon-stack-forward" viewBox="0 0 24 24" stroke-width="1.4" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
11963
11962
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 5l-8 4l8 4l8 -4l-8 -4" fill="currentColor" /><path d="M10 12l-6 3l8 4l8 -4l-6 -3" />
|
11964
11963
|
</symbol>
|
@@ -11972,7 +11971,45 @@ const prepareSvgIcons = builder => {
|
|
11972
11971
|
<path d="M12 5l0 14" /><path d="M18 11l-6 -6" /><path d="M6 11l6 -6" />
|
11973
11972
|
</symbol>
|
11974
11973
|
|
11975
|
-
|
11974
|
+
<symbol id="icon-group" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
11975
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M16 16v2a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2v-8a2 2 0 0 1 2 -2h2v-2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-2" />
|
11976
|
+
</symbol>
|
11977
|
+
<symbol id="icon-ungroup" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
11978
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M8 4m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z" /><path d="M4 8m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z" />
|
11979
|
+
</symbol>
|
11980
|
+
|
11981
|
+
<symbol id="icon-group2" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
11982
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 6v-1a1 1 0 0 1 1 -1h1m5 0h2m5 0h1a1 1 0 0 1 1 1v1m0 5v2m0 5v1a1 1 0 0 1 -1 1h-1m-5 0h-2m-5 0h-1a1 1 0 0 1 -1 -1v-1m0 -5v-2" />
|
11983
|
+
</symbol>
|
11984
|
+
<symbol id="icon-group3" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
11985
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M16 16v2a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2v-8a2 2 0 0 1 2 -2h2v-2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-2" /><path d="M10 8l-2 0l0 2" /><path d="M8 14l0 2l2 0" /><path d="M14 8l2 0l0 2" /><path d="M16 14l0 2l-2 0" />
|
11986
|
+
</symbol>
|
11987
|
+
<symbol id="icon-group4" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
11988
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M7 19a2 2 0 0 1 -2 -2" /><path d="M5 13v-2" /><path d="M5 7a2 2 0 0 1 2 -2" /><path d="M11 5h2" /><path d="M17 5a2 2 0 0 1 2 2" /><path d="M19 11v2" /><path d="M19 17v4" /><path d="M21 19h-4" /><path d="M13 19h-2" />
|
11989
|
+
</symbol>
|
11990
|
+
<symbol id="icon-ungroup2" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
11991
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 6c0 -.556 .227 -1.059 .593 -1.421" /><path d="M9 4h1.5" /><path d="M13.5 4h1.5" /><path d="M18 4a2 2 0 0 1 2 2" /><path d="M20 9v1.5" /><path d="M20 13.5v1.5" /><path d="M19.402 19.426a1.993 1.993 0 0 1 -1.402 .574" /><path d="M15 20h-1.5" /><path d="M10.5 20h-1.5" /><path d="M6 20a2 2 0 0 1 -2 -2" /><path d="M4 15v-1.5" /><path d="M4 10.5v-1.5" /><path d="M3 3l18 18" />
|
11992
|
+
</symbol>
|
11993
|
+
<symbol id="icon-ungroup3" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
11994
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 16.572v2.42a2.01 2.01 0 0 1 -2.009 2.008h-7.981a2.01 2.01 0 0 1 -2.01 -2.009v-7.981a2.01 2.01 0 0 1 2.009 -2.01h2.954" /><path d="M9.167 4.511a2.04 2.04 0 0 1 2.496 -1.441l7.826 2.097a2.04 2.04 0 0 1 1.441 2.496l-2.097 7.826a2.04 2.04 0 0 1 -2.496 1.441l-7.827 -2.097a2.04 2.04 0 0 1 -1.441 -2.496l2.098 -7.827z" />
|
11995
|
+
</symbol>
|
11996
|
+
|
11997
|
+
<symbol id="icon-duplicate" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
11998
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 16.572v2.42a2.01 2.01 0 0 1 -2.009 2.008h-7.981a2.01 2.01 0 0 1 -2.01 -2.009v-7.981a2.01 2.01 0 0 1 2.009 -2.01h2.954" /><path d="M9.167 4.511a2.04 2.04 0 0 1 2.496 -1.441l7.826 2.097a2.04 2.04 0 0 1 1.441 2.496l-2.097 7.826a2.04 2.04 0 0 1 -2.496 1.441l-7.827 -2.097a2.04 2.04 0 0 1 -1.441 -2.496l2.098 -7.827z" />
|
11999
|
+
</symbol>
|
12000
|
+
<symbol id="icon-duplicate2" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
12001
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M7 3m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z" /><path d="M17 17v2a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h2" />
|
12002
|
+
</symbol>
|
12003
|
+
|
12004
|
+
<symbol id="icon-trash" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
12005
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
12006
|
+
<path d="M4 7l16 0"></path>
|
12007
|
+
<path d="M10 11l0 6"></path>
|
12008
|
+
<path d="M14 11l0 6"></path>
|
12009
|
+
<path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12"></path>
|
12010
|
+
<path d="M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3"></path>
|
12011
|
+
</symbol>
|
12012
|
+
|
11976
12013
|
</svg>`;
|
11977
12014
|
builder.dom.appendHtml(builder.builderStuff, html);
|
11978
12015
|
};
|
@@ -18285,6 +18322,21 @@ const renderSnippetPanel = (builder, snippetOpen) => {
|
|
18285
18322
|
// }
|
18286
18323
|
},
|
18287
18324
|
|
18325
|
+
onSort: evt => {
|
18326
|
+
if (!builder.canvas) return;
|
18327
|
+
let snippetX = evt.originalEvent.clientX;
|
18328
|
+
let snippetY = evt.originalEvent.clientY;
|
18329
|
+
const block = builder.doc.querySelector('[data-new-dummy]');
|
18330
|
+
if (block) {
|
18331
|
+
const docContainer = block.parentNode;
|
18332
|
+
block.offsetWidth / 2;
|
18333
|
+
let x = (snippetX - block.offsetWidth / 2) / docContainer.offsetWidth * 100;
|
18334
|
+
let y = (snippetY - block.offsetHeight / 2) / docContainer.offsetHeight * 100;
|
18335
|
+
block.style.top = y + '%';
|
18336
|
+
block.style.left = x + '%';
|
18337
|
+
block.removeAttribute('data-new-dummy');
|
18338
|
+
}
|
18339
|
+
},
|
18288
18340
|
onStart: () => {
|
18289
18341
|
// Remove .builder-active during dragging (because this class makes rows have border-right/left 120px)
|
18290
18342
|
activeBuilderArea = null;
|
@@ -46988,13 +47040,15 @@ class Image$1 {
|
|
46988
47040
|
const movControlBox = document.querySelector('.moveable-control-box');
|
46989
47041
|
if (movControlBox) movControlBox.style.display = 'none';
|
46990
47042
|
}
|
46991
|
-
|
46992
|
-
|
46993
|
-
|
46994
|
-
|
46995
|
-
|
46996
|
-
|
46997
|
-
|
47043
|
+
if (this.builder.canvas) ; else {
|
47044
|
+
let prog = false;
|
47045
|
+
if (e.screenX && e.screenX !== 0 && e.screenY && e.screenY !== 0) ; else {
|
47046
|
+
// console.log('Programmatically');
|
47047
|
+
prog = true;
|
47048
|
+
}
|
47049
|
+
if (prog) {
|
47050
|
+
this.hideImageTool();
|
47051
|
+
}
|
46998
47052
|
}
|
46999
47053
|
|
47000
47054
|
// NOTE:
|
@@ -64243,7 +64297,7 @@ class Rte {
|
|
64243
64297
|
let inpZoomSlider;
|
64244
64298
|
if (!rteTool) {
|
64245
64299
|
if (builder.plugins.length > 0) {
|
64246
|
-
let allButtons = ['|', 'addsnippet', 'bold', 'italic', 'underline', 'formatting', 'color', 'removeformat', 'align', 'textsettings', 'createlink', 'tags', 'undo', 'redo', 'zoom', 'livepreview', 'icon', 'image', 'list', 'font', 'formatpara', 'gridtool', 'html', 'preferences', 'more', 'left', 'center', 'right', 'full'];
|
64300
|
+
let allButtons = ['|', 'addsnippet', 'bold', 'italic', 'underline', 'formatting', 'color', 'removeformat', 'align', 'textsettings', 'createlink', 'tags', 'undo', 'redo', 'zoom', 'livepreview', 'icon', 'image', 'list', 'font', 'formatpara', 'gridtool', 'html', 'preferences', 'more', 'left', 'center', 'right', 'full', 'group', 'ungroup', 'duplicate', 'addblock', 'front', 'backward', 'moveup', 'movedown', 'delete'];
|
64247
64301
|
const filterButtons = myArray => {
|
64248
64302
|
let newArray = myArray;
|
64249
64303
|
myArray.forEach(item => {
|
@@ -64330,7 +64384,7 @@ class Rte {
|
|
64330
64384
|
let html_elementrte = '';
|
64331
64385
|
for (j = 0; j < builder.opts.elementButtons.length; j++) {
|
64332
64386
|
btn = builder.opts.elementButtons[j].toLowerCase();
|
64333
|
-
if (btn === 'left') html_elementrte += `<button tabindex="-1" title="${util.out('Align Left')}" data-align="left"><svg class="is-icon-flex" style="width:14px;height:14px;"><use xlink:href="#icon-align-left"></use></svg></button>`;else if (btn === 'center') html_elementrte += `<button tabindex="-1" title="${util.out('Align Center')}" data-align="center"><svg class="is-icon-flex" style="width:14px;height:14px;"><use xlink:href="#icon-align-center"></use></svg></button>`;else if (btn === 'right') html_elementrte += `<button tabindex="-1" title="${util.out('Align Right')}" data-align="right"><svg class="is-icon-flex" style="width:14px;height:14px;"><use xlink:href="#icon-align-right"></use></svg></button>`;else if (btn === 'full') html_elementrte += `<button tabindex="-1" title="${util.out('Align Full')}" data-align="justify"><svg class="is-icon-flex" style="width:14px;height:14px;"><use xlink:href="#icon-align-full"></use></svg></button>`;else if (btn === 'gridtool') html_elementrte += `<button tabindex="-1" title="${util.out('Grid Tool')}" class="rte-grideditor"><svg class="is-icon-flex" style="margin-right:-3px;width:17px;height:17px;"><use xlink:href="#ion-grid"></use></svg></button>`;else if (btn === 'html') html_elementrte += `<button tabindex="-1" title="${util.out('HTML')}" class="rte-html"><svg class="is-icon-flex" style="margin-right:-3px;width:14px;height:14px;"><use xlink:href="#ion-ios-arrow-left"></use></svg><svg class="is-icon-flex" style="margin-left:-2px;width:14px;height:14px;"><use xlink:href="#ion-ios-arrow-right"></use></svg></button>`;else if (btn === 'preferences') html_elementrte += `<button tabindex="-1" title="${util.out('Preferences')}" class="rte-preferences"><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#ion-wrench"></use></svg></button>`;else if (btn === 'addsnippet') html_elementrte += `<button tabindex="-1" title="${util.out('Add Snippet')}" class="rte-addsnippet"><svg class="is-icon-flex" style="width:18px;height:18px;margin-top:-1px;"><use xlink:href="#ion-ios-plus-empty"></use></svg></button>`;else if (btn === 'undo') html_elementrte += `<button tabindex="-1" title="${util.out('Undo')}" class="rte-undo"><svg class="is-icon-flex" style="margin-top:2px;width:15px;height:15px;"><use xlink:href="#ion-ios-undo"></use></svg></button>`;else if (btn === 'redo') html_elementrte += `<button tabindex="-1" title="${util.out('Redo')}" class="rte-redo"><svg class="is-icon-flex" style="margin-top:2px;width:15px;height:15px;"><use xlink:href="#ion-ios-redo"></use></svg></button>`;else if (btn === 'more' && html_elementrtemore !== '') html_elementrte += `<button tabindex="-1" title="${util.out('More')}" class="rte-more"><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#ion-more"></use></svg></button>`;else if (btn === 'zoom') html_elementrte += `<button tabindex="-1" title="${util.out('Zoom')}" class="rte-zoom"><svg class="is-icon-flex" style="margin-top:2px;width:15px;height:15px;"><use xlink:href="#icon-zoom-in"></use></svg></button>`;else if (btn === 'livepreview') html_elementrte += `<button tabindex="-1" title="${util.out('Live Preview')}" class="rte-livepreview"><svg class="is-icon-flex" style="margin-top:2px;width:15px;height:15px;"><use xlink:href="#icon-device-desktop"></use></svg></button>`;else if (btn === '|') {
|
64387
|
+
if (btn === 'left') html_elementrte += `<button tabindex="-1" title="${util.out('Align Left')}" data-align="left"><svg class="is-icon-flex" style="width:14px;height:14px;"><use xlink:href="#icon-align-left"></use></svg></button>`;else if (btn === 'center') html_elementrte += `<button tabindex="-1" title="${util.out('Align Center')}" data-align="center"><svg class="is-icon-flex" style="width:14px;height:14px;"><use xlink:href="#icon-align-center"></use></svg></button>`;else if (btn === 'right') html_elementrte += `<button tabindex="-1" title="${util.out('Align Right')}" data-align="right"><svg class="is-icon-flex" style="width:14px;height:14px;"><use xlink:href="#icon-align-right"></use></svg></button>`;else if (btn === 'full') html_elementrte += `<button tabindex="-1" title="${util.out('Align Full')}" data-align="justify"><svg class="is-icon-flex" style="width:14px;height:14px;"><use xlink:href="#icon-align-full"></use></svg></button>`;else if (btn === 'gridtool') html_elementrte += `<button tabindex="-1" title="${util.out('Grid Tool')}" class="rte-grideditor"><svg class="is-icon-flex" style="margin-right:-3px;width:17px;height:17px;"><use xlink:href="#ion-grid"></use></svg></button>`;else if (btn === 'html') html_elementrte += `<button tabindex="-1" title="${util.out('HTML')}" class="rte-html"><svg class="is-icon-flex" style="margin-right:-3px;width:14px;height:14px;"><use xlink:href="#ion-ios-arrow-left"></use></svg><svg class="is-icon-flex" style="margin-left:-2px;width:14px;height:14px;"><use xlink:href="#ion-ios-arrow-right"></use></svg></button>`;else if (btn === 'preferences') html_elementrte += `<button tabindex="-1" title="${util.out('Preferences')}" class="rte-preferences"><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#ion-wrench"></use></svg></button>`;else if (btn === 'addsnippet') html_elementrte += `<button tabindex="-1" title="${util.out('Add Snippet')}" class="rte-addsnippet"><svg class="is-icon-flex" style="width:18px;height:18px;margin-top:-1px;"><use xlink:href="#ion-ios-plus-empty"></use></svg></button>`;else if (btn === 'group') html_elementrte += `<button style="display:none" tabindex="-1" title="${util.out('Group')}" class="rte-group"><svg class="is-icon-flex" style="width:20px;height:20px;margin-top:-1px;"><use xlink:href="#icon-group"></use></svg></button>`;else if (btn === 'ungroup') html_elementrte += `<button style="display:none" tabindex="-1" title="${util.out('Ungroup')}" class="rte-ungroup"><svg class="is-icon-flex" style="width:20px;height:20px;margin-top:-1px;"><use xlink:href="#icon-ungroup"></use></svg></button>`;else if (btn === 'duplicate') html_elementrte += `<button style="display:none" tabindex="-1" title="${util.out('Duplicate')}" class="rte-duplicate"><svg class="is-icon-flex" style="width:20px;height:20px;margin-top:-1px;"><use xlink:href="#icon-duplicate"></use></svg></button>`;else if (btn === 'front') html_elementrte += `<button style="display:none" tabindex="-1" title="${util.out('Bring to Front')}" class="rte-front"><svg class="is-icon-flex" style="width:18px;height:18px;margin-top:-1px;"><use xlink:href="#icon-stack-forward"></use></svg></button>`;else if (btn === 'backward') html_elementrte += `<button style="display:none" tabindex="-1" title="${util.out('Send to Back')}" class="rte-backward"><svg class="is-icon-flex" style="width:18px;height:18px;margin-top:-1px;"><use xlink:href="#icon-stack-backward"></use></svg></button>`;else if (btn === 'moveup') html_elementrte += `<button style="display:none" tabindex="-1" title="${util.out('Move Up')}" class="rte-moveup"><svg class="is-icon-flex" style="width:18px;height:18px;margin-top:-1px;"><use xlink:href="#icon-arrow-up"></use></svg></button>`;else if (btn === 'movedown') html_elementrte += `<button style="display:none" tabindex="-1" title="${util.out('Move Down')}" class="rte-movedown"><svg class="is-icon-flex" style="width:18px;height:18px;margin-top:-1px;"><use xlink:href="#icon-arrow-down"></use></svg></button>`;else if (btn === 'delete') html_elementrte += `<button style="display:none" tabindex="-1" title="${util.out('Delete')}" class="rte-delete"><svg class="is-icon-flex" style="width:18px;height:18px;margin-top:-1px;"><use xlink:href="#icon-trash"></use></svg></button>`;else if (btn === 'undo') html_elementrte += `<button tabindex="-1" title="${util.out('Undo')}" class="rte-undo"><svg class="is-icon-flex" style="margin-top:2px;width:15px;height:15px;"><use xlink:href="#ion-ios-undo"></use></svg></button>`;else if (btn === 'redo') html_elementrte += `<button tabindex="-1" title="${util.out('Redo')}" class="rte-redo"><svg class="is-icon-flex" style="margin-top:2px;width:15px;height:15px;"><use xlink:href="#ion-ios-redo"></use></svg></button>`;else if (btn === 'more' && html_elementrtemore !== '') html_elementrte += `<button tabindex="-1" title="${util.out('More')}" class="rte-more"><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#ion-more"></use></svg></button>`;else if (btn === 'zoom') html_elementrte += `<button tabindex="-1" title="${util.out('Zoom')}" class="rte-zoom"><svg class="is-icon-flex" style="margin-top:2px;width:15px;height:15px;"><use xlink:href="#icon-zoom-in"></use></svg></button>`;else if (btn === 'livepreview') html_elementrte += `<button tabindex="-1" title="${util.out('Live Preview')}" class="rte-livepreview"><svg class="is-icon-flex" style="margin-top:2px;width:15px;height:15px;"><use xlink:href="#icon-device-desktop"></use></svg></button>`;else if (btn === '|') {
|
64334
64388
|
html_elementrte += '<div class="rte-separator"></div>';
|
64335
64389
|
} else {
|
64336
64390
|
html_elementrte += `<button tabindex="-1" title="button not found" data-plugin="${btn}"></button>`; //temporary (later will be replaced with plugin button)
|
@@ -66638,6 +66692,71 @@ class Rte {
|
|
66638
66692
|
});
|
66639
66693
|
});
|
66640
66694
|
|
66695
|
+
// freeform
|
66696
|
+
|
66697
|
+
let btnGroup = builderStuff.querySelectorAll('button.rte-group');
|
66698
|
+
btnGroup.forEach(btn => {
|
66699
|
+
btn.addEventListener('click', () => {
|
66700
|
+
this.builder.group();
|
66701
|
+
builderStuff.querySelectorAll('button.rte-group').forEach(elm => elm.style.display = 'none');
|
66702
|
+
builderStuff.querySelectorAll('button.rte-ungroup').forEach(elm => elm.style.display = '');
|
66703
|
+
});
|
66704
|
+
});
|
66705
|
+
let btnUnGroup = builderStuff.querySelectorAll('button.rte-ungroup');
|
66706
|
+
btnUnGroup.forEach(btn => {
|
66707
|
+
btn.addEventListener('click', () => {
|
66708
|
+
this.builder.unGroup();
|
66709
|
+
builderStuff.querySelectorAll('button.rte-group').forEach(elm => elm.style.display = '');
|
66710
|
+
builderStuff.querySelectorAll('button.rte-ungroup').forEach(elm => elm.style.display = 'none');
|
66711
|
+
});
|
66712
|
+
});
|
66713
|
+
let btnDelete = builderStuff.querySelectorAll('button.rte-delete');
|
66714
|
+
btnDelete.forEach(btn => {
|
66715
|
+
btn.addEventListener('click', () => {
|
66716
|
+
this.builder.delete();
|
66717
|
+
});
|
66718
|
+
});
|
66719
|
+
let btnFront = builderStuff.querySelectorAll('button.rte-front');
|
66720
|
+
btnFront.forEach(btn => {
|
66721
|
+
btn.addEventListener('click', () => {
|
66722
|
+
let activeBlock = this.builder.doc.querySelector('.is-block.cloned');
|
66723
|
+
if (!activeBlock) return;
|
66724
|
+
this.builder.forward(activeBlock);
|
66725
|
+
});
|
66726
|
+
});
|
66727
|
+
let btnBackward = builderStuff.querySelectorAll('button.rte-backward');
|
66728
|
+
btnBackward.forEach(btn => {
|
66729
|
+
btn.addEventListener('click', () => {
|
66730
|
+
let activeBlock = this.builder.doc.querySelector('.is-block.cloned');
|
66731
|
+
if (!activeBlock) return;
|
66732
|
+
this.builder.backward(activeBlock);
|
66733
|
+
});
|
66734
|
+
});
|
66735
|
+
let btnMoveUp = builderStuff.querySelectorAll('button.rte-moveup');
|
66736
|
+
btnMoveUp.forEach(btn => {
|
66737
|
+
btn.addEventListener('click', () => {
|
66738
|
+
let activeBlock = this.builder.doc.querySelector('.is-block.active');
|
66739
|
+
if (!activeBlock) return;
|
66740
|
+
this.builder.moveUp(activeBlock);
|
66741
|
+
});
|
66742
|
+
});
|
66743
|
+
let btnMoveDown = builderStuff.querySelectorAll('button.rte-movedown');
|
66744
|
+
btnMoveDown.forEach(btn => {
|
66745
|
+
btn.addEventListener('click', () => {
|
66746
|
+
let activeBlock = this.builder.doc.querySelector('.is-block.active');
|
66747
|
+
if (!activeBlock) return;
|
66748
|
+
this.builder.moveDown(activeBlock);
|
66749
|
+
});
|
66750
|
+
});
|
66751
|
+
let btnDuplicate = builderStuff.querySelectorAll('button.rte-duplicate');
|
66752
|
+
btnDuplicate.forEach(btn => {
|
66753
|
+
btn.addEventListener('click', () => {
|
66754
|
+
let activeBlock = this.builder.doc.querySelector('.is-block.cloned');
|
66755
|
+
if (!activeBlock) return;
|
66756
|
+
this.builder.duplicate(activeBlock);
|
66757
|
+
});
|
66758
|
+
});
|
66759
|
+
|
66641
66760
|
// -----------------------------
|
66642
66761
|
|
66643
66762
|
// Click anywhere will hide Column tool
|
@@ -67570,6 +67689,40 @@ class Rte {
|
|
67570
67689
|
btn.style.display = 'none';
|
67571
67690
|
});
|
67572
67691
|
}
|
67692
|
+
hideBlockButtons() {
|
67693
|
+
let elms = this.elementRteTool.querySelectorAll('.rte-group');
|
67694
|
+
Array.prototype.forEach.call(elms, elm => {
|
67695
|
+
elm.style.display = 'none';
|
67696
|
+
});
|
67697
|
+
elms = this.elementRteTool.querySelectorAll('.rte-ungroup');
|
67698
|
+
Array.prototype.forEach.call(elms, elm => {
|
67699
|
+
elm.style.display = 'none';
|
67700
|
+
});
|
67701
|
+
elms = this.elementRteTool.querySelectorAll('.rte-duplicate');
|
67702
|
+
Array.prototype.forEach.call(elms, elm => {
|
67703
|
+
elm.style.display = 'none';
|
67704
|
+
});
|
67705
|
+
elms = this.elementRteTool.querySelectorAll('.rte-front');
|
67706
|
+
Array.prototype.forEach.call(elms, elm => {
|
67707
|
+
elm.style.display = 'none';
|
67708
|
+
});
|
67709
|
+
elms = this.elementRteTool.querySelectorAll('.rte-backward');
|
67710
|
+
Array.prototype.forEach.call(elms, elm => {
|
67711
|
+
elm.style.display = 'none';
|
67712
|
+
});
|
67713
|
+
elms = this.elementRteTool.querySelectorAll('.rte-moveup');
|
67714
|
+
Array.prototype.forEach.call(elms, elm => {
|
67715
|
+
elm.style.display = 'none';
|
67716
|
+
});
|
67717
|
+
elms = this.elementRteTool.querySelectorAll('.rte-movedown');
|
67718
|
+
Array.prototype.forEach.call(elms, elm => {
|
67719
|
+
elm.style.display = 'none';
|
67720
|
+
});
|
67721
|
+
elms = this.elementRteTool.querySelectorAll('.rte-delete');
|
67722
|
+
Array.prototype.forEach.call(elms, elm => {
|
67723
|
+
elm.style.display = 'none';
|
67724
|
+
});
|
67725
|
+
}
|
67573
67726
|
showAlignButtons() {
|
67574
67727
|
let separators = this.elementRteTool.querySelectorAll('.rte-separator');
|
67575
67728
|
Array.prototype.forEach.call(separators, separator => {
|
@@ -67619,6 +67772,7 @@ class Rte {
|
|
67619
67772
|
subblock = true;
|
67620
67773
|
}
|
67621
67774
|
}
|
67775
|
+
if (this.builder.canvas) this.hideBlockButtons();
|
67622
67776
|
this.rteTool.querySelector('.rte-for-text').style.display = 'flex';
|
67623
67777
|
this.rteTool.querySelector('.rte-for-icon').style.display = 'none';
|
67624
67778
|
this.rteMoreOptions.querySelector('.rte-for-text').style.display = 'flex';
|
@@ -76653,6 +76807,7 @@ class Draggable {
|
|
76653
76807
|
this.selector = options && options.selector || '.is-block';
|
76654
76808
|
this.doc = options && options.doc || document;
|
76655
76809
|
this.win = options && options.win || window;
|
76810
|
+
this.controlSelector = options && options.controlSelector || null;
|
76656
76811
|
this.onDelete = options && options.onDelete || null;
|
76657
76812
|
this.onBeforeChange = options && options.onBeforeChange || null;
|
76658
76813
|
this.onChange = options && options.onChange || null;
|
@@ -76922,7 +77077,7 @@ class Draggable {
|
|
76922
77077
|
this.doc.querySelectorAll('.block-active').forEach(elm => elm.classList.remove('block-active'));
|
76923
77078
|
}
|
76924
77079
|
} else {
|
76925
|
-
if (event.target.closest('.keep-selection')) return;
|
77080
|
+
if (event.target.closest('.keep-selection') || this.controlSelector && event.target.closest(this.controlSelector)) return;
|
76926
77081
|
|
76927
77082
|
// // Make empty height set with value
|
76928
77083
|
// // if(this.clickedBlock) this.common.updateHeight(this.clickedBlock);
|
@@ -77054,7 +77209,7 @@ class Editable {
|
|
77054
77209
|
this.doc.addEventListener('touchstart', this.handleMouseClick, {
|
77055
77210
|
passive: false
|
77056
77211
|
});
|
77057
|
-
if (this.onEditStart) this.onEditStart(currentTarget);
|
77212
|
+
if (this.onEditStart) this.onEditStart(event, currentTarget);
|
77058
77213
|
}
|
77059
77214
|
handleTouchStart(event) {
|
77060
77215
|
// Handle Double Tab
|
@@ -77353,6 +77508,7 @@ class EditableBlocks {
|
|
77353
77508
|
disableOnMobile: this.disableOnMobile,
|
77354
77509
|
doc: this.doc,
|
77355
77510
|
win: this.win,
|
77511
|
+
controlSelector: this.controlSelector,
|
77356
77512
|
onDelete: element => {
|
77357
77513
|
if (this.rotatable) this.rotatable.destroy(element);
|
77358
77514
|
this.resizable.destroy(element);
|
@@ -77409,10 +77565,10 @@ class EditableBlocks {
|
|
77409
77565
|
doc: this.doc,
|
77410
77566
|
win: this.win,
|
77411
77567
|
onContentClick: this.onContentClick,
|
77412
|
-
onEditStart: block => {
|
77568
|
+
onEditStart: (event, block) => {
|
77413
77569
|
if (block.classList.contains('clone')) {
|
77414
77570
|
const clonedTarget = this.doc.querySelector(this.selector + '.cloned');
|
77415
|
-
this.onEditStart(clonedTarget);
|
77571
|
+
this.onEditStart(event, clonedTarget);
|
77416
77572
|
this.selectClear();
|
77417
77573
|
|
77418
77574
|
// Disable drag during editing
|
@@ -77420,7 +77576,7 @@ class EditableBlocks {
|
|
77420
77576
|
this.draggable.disableDrag(clonedTarget);
|
77421
77577
|
return;
|
77422
77578
|
}
|
77423
|
-
this.onEditStart(block);
|
77579
|
+
this.onEditStart(event, block);
|
77424
77580
|
|
77425
77581
|
// Disable drag during editing
|
77426
77582
|
if (!this.draggable) return;
|
@@ -78665,13 +78821,21 @@ class ContentBuilder {
|
|
78665
78821
|
let oldOnUndo = this.opts.onUndo;
|
78666
78822
|
this.opts.onUndo = () => {
|
78667
78823
|
let ret = oldOnUndo.apply(this, arguments);
|
78668
|
-
if (this.eb)
|
78824
|
+
if (this.eb) {
|
78825
|
+
this.eb.refresh();
|
78826
|
+
this.rte.hideBlockButtons();
|
78827
|
+
this.rte.positionToolbar();
|
78828
|
+
}
|
78669
78829
|
return ret;
|
78670
78830
|
};
|
78671
78831
|
let oldOnRedo = this.opts.onRedo;
|
78672
78832
|
this.opts.onRedo = () => {
|
78673
78833
|
let ret = oldOnRedo.apply(this, arguments);
|
78674
|
-
if (this.eb)
|
78834
|
+
if (this.eb) {
|
78835
|
+
this.eb.refresh();
|
78836
|
+
this.rte.hideBlockButtons();
|
78837
|
+
this.rte.positionToolbar();
|
78838
|
+
}
|
78675
78839
|
return ret;
|
78676
78840
|
};
|
78677
78841
|
this.elmTool = new ElementTool(this); // Render Element Tool
|
@@ -78746,7 +78910,7 @@ class ContentBuilder {
|
|
78746
78910
|
doc: this.doc,
|
78747
78911
|
win: this.win,
|
78748
78912
|
selector: '.is-block',
|
78749
|
-
controlSelector: '.is-tool,.is-pop,.is-modal,#divImageResizer,.is-rte-tool
|
78913
|
+
controlSelector: '.is-tool,.is-pop,.is-modal,#divImageResizer,.is-rte-tool,.is-elementrte-tool,.is-rte-pop,.keep-selection',
|
78750
78914
|
parentSelector: '.box-canvas',
|
78751
78915
|
rotate: true,
|
78752
78916
|
// disableOnMobile: 760,
|
@@ -78756,12 +78920,40 @@ class ContentBuilder {
|
|
78756
78920
|
onChange: () => {
|
78757
78921
|
this.opts.onChange();
|
78758
78922
|
},
|
78759
|
-
onEditStart: block => {
|
78923
|
+
onEditStart: (event, block) => {
|
78760
78924
|
block.classList.add('editable');
|
78761
|
-
|
78762
|
-
|
78763
|
-
|
78764
|
-
|
78925
|
+
|
78926
|
+
// get element to activate
|
78927
|
+
let x = event.clientX;
|
78928
|
+
let y = event.clientY;
|
78929
|
+
let activeBlock = this.doc.querySelector('.is-block.cloned');
|
78930
|
+
if (!activeBlock) return;
|
78931
|
+
const container = activeBlock.querySelector('.is-container');
|
78932
|
+
if (!container) return;
|
78933
|
+
const cols = this.getAllColumns(container);
|
78934
|
+
let clickedElm;
|
78935
|
+
let clickedCol;
|
78936
|
+
cols.forEach(col => {
|
78937
|
+
let elms = col.children;
|
78938
|
+
for (let i = 0; i < elms.length; i++) {
|
78939
|
+
let rect = elms[i].getBoundingClientRect();
|
78940
|
+
if (x >= rect.left && x <= rect.right && y >= rect.top && y <= rect.bottom) {
|
78941
|
+
clickedElm = elms[i];
|
78942
|
+
}
|
78943
|
+
}
|
78944
|
+
let rect = col.getBoundingClientRect();
|
78945
|
+
if (x >= rect.left && x <= rect.right && y >= rect.top && y <= rect.bottom) {
|
78946
|
+
clickedCol = col;
|
78947
|
+
}
|
78948
|
+
});
|
78949
|
+
if (clickedElm) {
|
78950
|
+
const tagName = clickedElm.tagName.toLowerCase();
|
78951
|
+
if (tagName !== 'img') this.eb.placeCursorAtEnd(clickedElm);
|
78952
|
+
setTimeout(() => {
|
78953
|
+
clickedElm.click();
|
78954
|
+
}, 1); // give time for the placeCursorAtEnd
|
78955
|
+
} else if (clickedCol) {
|
78956
|
+
clickedCol.click();
|
78765
78957
|
}
|
78766
78958
|
},
|
78767
78959
|
onEditEnd: block => {
|
@@ -78798,10 +78990,108 @@ class ContentBuilder {
|
|
78798
78990
|
const builder = block.querySelector(this.container);
|
78799
78991
|
this.applyBehaviorOn(builder);
|
78800
78992
|
},
|
78801
|
-
onMultipleSelect:
|
78802
|
-
|
78803
|
-
|
78804
|
-
|
78993
|
+
onMultipleSelect: () => {
|
78994
|
+
if (this.onMultipleSelect) this.onMultipleSelect();
|
78995
|
+
setTimeout(() => {
|
78996
|
+
this.rte.rteTool.style.display = 'none';
|
78997
|
+
this.rte.elementRteTool.style.display = 'flex';
|
78998
|
+
this.rte.hideAlignButtons();
|
78999
|
+
this.rte.hideBlockButtons();
|
79000
|
+
|
79001
|
+
// group/ungroup
|
79002
|
+
let elms = this.rte.elementRteTool.querySelectorAll('.rte-group');
|
79003
|
+
Array.prototype.forEach.call(elms, elm => {
|
79004
|
+
elm.style.display = '';
|
79005
|
+
});
|
79006
|
+
this.rte.positionToolbar();
|
79007
|
+
}, 10);
|
79008
|
+
},
|
79009
|
+
onDelete: () => {
|
79010
|
+
if (this.onDelete) this.onDelete();
|
79011
|
+
this.rte.hideBlockButtons();
|
79012
|
+
this.rte.positionToolbar();
|
79013
|
+
},
|
79014
|
+
onSelectBlock: block => {
|
79015
|
+
if (this.onSelectBlock) this.onSelectBlock(block);
|
79016
|
+
if (block.classList.contains('editable')) return;
|
79017
|
+
if (this.controlPanel) return;
|
79018
|
+
this.rte.rteTool.style.display = 'none';
|
79019
|
+
this.rte.elementRteTool.style.display = 'flex';
|
79020
|
+
this.rte.hideAlignButtons();
|
79021
|
+
let elms = this.rte.elementRteTool.querySelectorAll('.rte-duplicate');
|
79022
|
+
Array.prototype.forEach.call(elms, elm => {
|
79023
|
+
elm.style.display = '';
|
79024
|
+
});
|
79025
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-moveup');
|
79026
|
+
Array.prototype.forEach.call(elms, elm => {
|
79027
|
+
elm.style.display = '';
|
79028
|
+
});
|
79029
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-movedown');
|
79030
|
+
Array.prototype.forEach.call(elms, elm => {
|
79031
|
+
elm.style.display = '';
|
79032
|
+
});
|
79033
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-delete');
|
79034
|
+
Array.prototype.forEach.call(elms, elm => {
|
79035
|
+
elm.style.display = '';
|
79036
|
+
});
|
79037
|
+
const viewportWidth = this.doc.body.clientWidth;
|
79038
|
+
if (viewportWidth <= 768) {
|
79039
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-moveup');
|
79040
|
+
Array.prototype.forEach.call(elms, elm => {
|
79041
|
+
elm.style.display = '';
|
79042
|
+
});
|
79043
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-movedown');
|
79044
|
+
Array.prototype.forEach.call(elms, elm => {
|
79045
|
+
elm.style.display = '';
|
79046
|
+
});
|
79047
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-front');
|
79048
|
+
Array.prototype.forEach.call(elms, elm => {
|
79049
|
+
elm.style.display = 'none';
|
79050
|
+
});
|
79051
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-backward');
|
79052
|
+
Array.prototype.forEach.call(elms, elm => {
|
79053
|
+
elm.style.display = 'none';
|
79054
|
+
});
|
79055
|
+
} else {
|
79056
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-moveup');
|
79057
|
+
Array.prototype.forEach.call(elms, elm => {
|
79058
|
+
elm.style.display = 'none';
|
79059
|
+
});
|
79060
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-movedown');
|
79061
|
+
Array.prototype.forEach.call(elms, elm => {
|
79062
|
+
elm.style.display = 'none';
|
79063
|
+
});
|
79064
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-front');
|
79065
|
+
Array.prototype.forEach.call(elms, elm => {
|
79066
|
+
elm.style.display = '';
|
79067
|
+
});
|
79068
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-backward');
|
79069
|
+
Array.prototype.forEach.call(elms, elm => {
|
79070
|
+
elm.style.display = '';
|
79071
|
+
});
|
79072
|
+
}
|
79073
|
+
|
79074
|
+
// group/ungroup
|
79075
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-group');
|
79076
|
+
Array.prototype.forEach.call(elms, elm => {
|
79077
|
+
elm.style.display = 'none';
|
79078
|
+
});
|
79079
|
+
if (block.classList.contains('is-group')) {
|
79080
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-ungroup');
|
79081
|
+
Array.prototype.forEach.call(elms, elm => {
|
79082
|
+
elm.style.display = '';
|
79083
|
+
});
|
79084
|
+
} else {
|
79085
|
+
elms = this.rte.elementRteTool.querySelectorAll('.rte-ungroup');
|
79086
|
+
Array.prototype.forEach.call(elms, elm => {
|
79087
|
+
elm.style.display = 'none';
|
79088
|
+
});
|
79089
|
+
}
|
79090
|
+
this.rte.positionToolbar();
|
79091
|
+
},
|
79092
|
+
onUnselectBlock: () => {
|
79093
|
+
if (this.onUnselectBlock) this.onUnselectBlock();
|
79094
|
+
}
|
78805
79095
|
});
|
78806
79096
|
if (this.iframe) {
|
78807
79097
|
this.win.addEventListener('scroll', this.doWindowScroll = () => {
|
@@ -78902,6 +79192,8 @@ class ContentBuilder {
|
|
78902
79192
|
|
78903
79193
|
util.clearActiveCell();
|
78904
79194
|
util.clearControls();
|
79195
|
+
if (!target.closest('.is-block')) this.rte.hideBlockButtons(); // freeform
|
79196
|
+
|
78905
79197
|
if (!this.controlPanel) if (this.toolbarDisplay !== 'auto') {
|
78906
79198
|
this.rte.showDefaultToolbar();
|
78907
79199
|
}
|
@@ -79011,6 +79303,20 @@ class ContentBuilder {
|
|
79011
79303
|
static run(opts = {}) {
|
79012
79304
|
return new ContentBuilder(opts);
|
79013
79305
|
}
|
79306
|
+
getAllColumns(container) {
|
79307
|
+
let arrCells = [];
|
79308
|
+
let rows = container.children;
|
79309
|
+
for (let i = 0; i < rows.length; i++) {
|
79310
|
+
let cols = rows[i].children;
|
79311
|
+
for (let j = 0; j < cols.length; j++) {
|
79312
|
+
let col = cols[j];
|
79313
|
+
if (col.classList.contains('is-row-tool') || col.classList.contains('is-col-tool') || col.classList.contains('is-rowadd-tool') || col.classList.contains('is-row-overlay')) ; else {
|
79314
|
+
arrCells.push(col);
|
79315
|
+
}
|
79316
|
+
}
|
79317
|
+
}
|
79318
|
+
return arrCells;
|
79319
|
+
}
|
79014
79320
|
setZoom() {
|
79015
79321
|
// Complete (On Area + On Control)
|
79016
79322
|
|
@@ -79731,6 +80037,47 @@ class ContentBuilder {
|
|
79731
80037
|
this.eb.backward(target);
|
79732
80038
|
this.opts.onChange();
|
79733
80039
|
}
|
80040
|
+
moveUp(target) {
|
80041
|
+
let arrBlocks = [];
|
80042
|
+
const container = target.parentNode;
|
80043
|
+
let elms = container.querySelectorAll('.is-block');
|
80044
|
+
elms.forEach(elm => {
|
80045
|
+
arrBlocks.push(elm);
|
80046
|
+
});
|
80047
|
+
let previousBlock; //, nextBlock;
|
80048
|
+
for (let i = 0; i < arrBlocks.length; i++) {
|
80049
|
+
if (arrBlocks[i] === target) {
|
80050
|
+
if (i - 1 >= 0) previousBlock = arrBlocks[i - 1];
|
80051
|
+
// if(i+1<arrBlocks.length) nextBlock = arrBlocks[i+1];
|
80052
|
+
}
|
80053
|
+
}
|
80054
|
+
|
80055
|
+
if (previousBlock) {
|
80056
|
+
this.uo.saveForUndo();
|
80057
|
+
container.insertBefore(target, previousBlock);
|
80058
|
+
this.opts.onChange();
|
80059
|
+
}
|
80060
|
+
}
|
80061
|
+
moveDown(target) {
|
80062
|
+
let arrBlocks = [];
|
80063
|
+
const container = target.parentNode;
|
80064
|
+
let elms = container.querySelectorAll('.is-block');
|
80065
|
+
elms.forEach(elm => {
|
80066
|
+
arrBlocks.push(elm);
|
80067
|
+
});
|
80068
|
+
let nextBlock; //, previousBlock;
|
80069
|
+
for (let i = 0; i < arrBlocks.length; i++) {
|
80070
|
+
if (arrBlocks[i] === target) {
|
80071
|
+
// if(i-1>=0) previousBlock = arrBlocks[i-1];
|
80072
|
+
if (i + 1 < arrBlocks.length) nextBlock = arrBlocks[i + 1];
|
80073
|
+
}
|
80074
|
+
}
|
80075
|
+
if (nextBlock) {
|
80076
|
+
this.uo.saveForUndo();
|
80077
|
+
container.insertBefore(nextBlock, target);
|
80078
|
+
this.opts.onChange();
|
80079
|
+
}
|
80080
|
+
}
|
79734
80081
|
enableShape() {
|
79735
80082
|
if (!this.eb) return;
|
79736
80083
|
this.uo.saveForUndo();
|
@@ -82347,14 +82694,18 @@ class ContentBuilder {
|
|
82347
82694
|
}
|
82348
82695
|
boxes.forEach(box => {
|
82349
82696
|
box.insertAdjacentHTML('afterbegin', `
|
82350
|
-
<div class="is-block block-dummy" style="top:
|
82351
|
-
|
82697
|
+
<div class="is-block block-dummy" style="top: 0%; left: 0%; width: 100%; height: 20%;background:#eee;opacity:0"></div>
|
82698
|
+
<div class="is-block block-dummy" style="top: 20%; left: 0%; width: 100%; height: 20%;background:#eee;opacity:0"></div>
|
82699
|
+
<div class="is-block block-dummy" style="top: 40%; left: 0%; width: 100%; height: 20%;background:#eee;opacity:0"></div>
|
82700
|
+
<div class="is-block block-dummy" style="top: 60%; left: 0%; width: 100%; height: 20%;background:#eee;opacity:0"></div>
|
82701
|
+
<div class="is-block block-dummy" style="top: 80%; left: 0%; width: 100%; height: 20%;background:#eee;opacity:0"></div>
|
82702
|
+
`);
|
82352
82703
|
const obj = new Sortable(box, {
|
82353
82704
|
scroll: true,
|
82354
82705
|
group: 'shared',
|
82355
82706
|
direction: 'horizontal',
|
82356
82707
|
animation: 150,
|
82357
|
-
sort: true,
|
82708
|
+
// sort: true,
|
82358
82709
|
onAdd: evt => {
|
82359
82710
|
let itemEl = evt.item;
|
82360
82711
|
if (itemEl.getAttribute('data-id')) {
|
@@ -82427,12 +82778,12 @@ class ContentBuilder {
|
|
82427
82778
|
itemEl.removeAttribute('draggable');
|
82428
82779
|
this.dom.removeClass(itemEl, 'snippet-item');
|
82429
82780
|
const blockTemplate = `
|
82430
|
-
<div class="is-block block-steady height-auto" style="top: 20%; left: 20%; width: 800px;">
|
82781
|
+
<div class="is-block block-steady height-auto" data-new-dummy="1" style="top: 20%; left: 20%; width: 800px;">
|
82431
82782
|
<div class="is-container container-new leading-12 size-17">
|
82432
82783
|
[%CONTENT%]
|
82433
82784
|
</div>
|
82434
82785
|
</div>
|
82435
|
-
`;
|
82786
|
+
`; // data-new-dummy will be used by onSort to apply top/left position (snippetpanel.js)
|
82436
82787
|
itemEl.outerHTML = blockTemplate.replace('[%CONTENT%]', html);
|
82437
82788
|
} else {
|
82438
82789
|
// Snippet is wrapped in row/colum (may contain custom code or has [data-html] attribute)
|
@@ -82465,7 +82816,7 @@ class ContentBuilder {
|
|
82465
82816
|
range.setStart(itemEl, 0);
|
82466
82817
|
itemEl.appendChild(range.createContextualFragment(html));
|
82467
82818
|
const blockTemplate = `
|
82468
|
-
<div class="is-block block-steady height-auto" style="top: 20%; left: 20%; width: 800px;">
|
82819
|
+
<div class="is-block block-steady height-auto" data-new-dummy="1" style="top: 20%; left: 20%; width: 800px;">
|
82469
82820
|
<div class="is-container container-new leading-12 size-17">
|
82470
82821
|
[%CONTENT%]
|
82471
82822
|
</div>
|