@innovastudio/contentbox 1.6.50 → 1.6.52
Sign up to get free protection for your applications and to get access to all the features.
package/package.json
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"name": "@innovastudio/contentbox",
|
3
3
|
"type": "module",
|
4
|
-
"version": "1.6.
|
4
|
+
"version": "1.6.52",
|
5
5
|
"description": "",
|
6
6
|
"main": "public/contentbox/contentbox.esm.js",
|
7
7
|
"files": [
|
@@ -52,7 +52,7 @@
|
|
52
52
|
"ws": "^8.13.0"
|
53
53
|
},
|
54
54
|
"dependencies": {
|
55
|
-
"@innovastudio/contentbuilder": "^1.5.
|
55
|
+
"@innovastudio/contentbuilder": "^1.5.38",
|
56
56
|
"js-beautify": "^1.14.0"
|
57
57
|
}
|
58
58
|
}
|
@@ -25645,14 +25645,34 @@ class ControlPanel {
|
|
25645
25645
|
let activeImage = this.builder.editor.activeImage;
|
25646
25646
|
let activeModule = this.builder.editor.activeModule;
|
25647
25647
|
|
25648
|
-
if (
|
25649
|
-
|
25650
|
-
|
25651
|
-
|
25652
|
-
|
25653
|
-
}, 1);
|
25648
|
+
if (activeModule) {
|
25649
|
+
const moduleTool = this.builder.doc.querySelector('.is-module-tool');
|
25650
|
+
moduleTool.style.opacity = '0';
|
25651
|
+
const lockInfo = this.builder.doc.querySelector('.is-locked-indicator');
|
25652
|
+
lockInfo.style.opacity = '0';
|
25654
25653
|
setTimeout(() => {
|
25655
25654
|
this.builder.editor.util.refreshModuleLayout(activeModule);
|
25655
|
+
setTimeout(() => {
|
25656
|
+
moduleTool.style.opacity = '';
|
25657
|
+
this.builder.editor.element.module.repositionModuleTool();
|
25658
|
+
lockInfo.style.opacity = '';
|
25659
|
+
this.builder.editor.colTool.showHideLockIndicator(activeModule);
|
25660
|
+
}, 200);
|
25661
|
+
}, 600);
|
25662
|
+
}
|
25663
|
+
|
25664
|
+
if (activeModule && activeImage) {
|
25665
|
+
this.builder.editor.element.image.hideImageTool();
|
25666
|
+
setTimeout(() => {
|
25667
|
+
activeModule.querySelectorAll('img').forEach(img => {
|
25668
|
+
if (img.outerHTML === activeImage.outerHTML) {
|
25669
|
+
setTimeout(() => {
|
25670
|
+
if (img.closest('.glide__slide--active')) {
|
25671
|
+
img.click();
|
25672
|
+
}
|
25673
|
+
}, 100);
|
25674
|
+
}
|
25675
|
+
});
|
25656
25676
|
}, 600);
|
25657
25677
|
} else if (activeImage) {
|
25658
25678
|
// normal image
|
@@ -25669,6 +25689,33 @@ class ControlPanel {
|
|
25669
25689
|
this.builder.editor.element.image.repositionImageTool();
|
25670
25690
|
}, 600);
|
25671
25691
|
}
|
25692
|
+
/*
|
25693
|
+
if(activeImage && activeModule) {
|
25694
|
+
// if image is in module
|
25695
|
+
this.builder.editor.element.image.hideImageTool();
|
25696
|
+
setTimeout(()=>{
|
25697
|
+
this.panelImage.classList.remove('active');
|
25698
|
+
},1);
|
25699
|
+
setTimeout(()=>{
|
25700
|
+
this.builder.editor.util.refreshModuleLayout(activeModule);
|
25701
|
+
},600);
|
25702
|
+
} else if(activeImage) {
|
25703
|
+
// normal image
|
25704
|
+
const imageTool = document.querySelector('#divImageTool');
|
25705
|
+
const imageResizer = document.querySelector('#divImageResizer');
|
25706
|
+
const moveableBox = document.querySelector('.moveable-control-box');
|
25707
|
+
imageTool.style.opacity = '0';
|
25708
|
+
imageResizer.style.opacity = '0';
|
25709
|
+
moveableBox.style.opacity = '0';
|
25710
|
+
setTimeout(()=>{
|
25711
|
+
imageTool.style.opacity = '';
|
25712
|
+
imageResizer.style.opacity = '';
|
25713
|
+
moveableBox.style.opacity = '';
|
25714
|
+
this.builder.editor.element.image.repositionImageTool();
|
25715
|
+
},600);
|
25716
|
+
}
|
25717
|
+
*/
|
25718
|
+
|
25672
25719
|
}
|
25673
25720
|
|
25674
25721
|
getActive() {
|
@@ -26072,7 +26119,7 @@ class ControlPanel {
|
|
26072
26119
|
if (element.closest('[data-subblock]')) {
|
26073
26120
|
let titleHtml = '';
|
26074
26121
|
let module = element.closest('[data-html]');
|
26075
|
-
let desc = module.getAttribute('data-module-desc');
|
26122
|
+
let desc = module ? module.getAttribute('data-module-desc') : '';
|
26076
26123
|
|
26077
26124
|
if (desc) {
|
26078
26125
|
titleHtml = out(desc);
|
@@ -38898,6 +38945,7 @@ class Grid {
|
|
38898
38945
|
if (!cell) return;
|
38899
38946
|
if (cell.previousElementSibling) {
|
38900
38947
|
this.builder.uo.saveForUndo();
|
38948
|
+
this.builder.hideTools();
|
38901
38949
|
cell.parentElement.insertBefore(cell, cell.previousElementSibling);
|
38902
38950
|
this.builder.opts.onChange();
|
38903
38951
|
}
|
@@ -38909,6 +38957,7 @@ class Grid {
|
|
38909
38957
|
const cellnext = util.cellNext(cell);
|
38910
38958
|
if (cellnext) {
|
38911
38959
|
this.builder.uo.saveForUndo();
|
38960
|
+
this.builder.hideTools();
|
38912
38961
|
cell.parentElement.insertBefore(cellnext, cell);
|
38913
38962
|
this.builder.opts.onChange();
|
38914
38963
|
}
|
@@ -38935,6 +38984,7 @@ class Grid {
|
|
38935
38984
|
//+2 => includes is-row-tool & is-rowaddtool
|
38936
38985
|
|
38937
38986
|
this.builder.uo.saveForUndo();
|
38987
|
+
this.builder.hideTools();
|
38938
38988
|
|
38939
38989
|
//Move row up
|
38940
38990
|
row.parentNode.insertBefore(row, row.previousElementSibling);
|
@@ -38942,6 +38992,7 @@ class Grid {
|
|
38942
38992
|
return;
|
38943
38993
|
} else {
|
38944
38994
|
this.builder.uo.saveForUndo();
|
38995
|
+
this.builder.hideTools();
|
38945
38996
|
|
38946
38997
|
//Add inside prev row
|
38947
38998
|
let tool = row.previousElementSibling.querySelector('.is-row-tool');
|
@@ -38969,6 +39020,7 @@ class Grid {
|
|
38969
39020
|
}
|
38970
39021
|
} else {
|
38971
39022
|
this.builder.uo.saveForUndo();
|
39023
|
+
this.builder.hideTools();
|
38972
39024
|
var rowElement = row.cloneNode(true);
|
38973
39025
|
rowElement.innerHTML = '';
|
38974
39026
|
rowElement.appendChild(cell);
|
@@ -39012,6 +39064,7 @@ class Grid {
|
|
39012
39064
|
//+2 => includes is-row-tool & is-rowadd-tool
|
39013
39065
|
|
39014
39066
|
this.builder.uo.saveForUndo();
|
39067
|
+
this.builder.hideTools();
|
39015
39068
|
|
39016
39069
|
//Move row down
|
39017
39070
|
row.parentNode.insertBefore(row.nextElementSibling, row);
|
@@ -39019,6 +39072,7 @@ class Grid {
|
|
39019
39072
|
return;
|
39020
39073
|
} else {
|
39021
39074
|
this.builder.uo.saveForUndo();
|
39075
|
+
this.builder.hideTools();
|
39022
39076
|
|
39023
39077
|
//Add inside next row
|
39024
39078
|
let tool = row.nextElementSibling.querySelector('.is-row-tool');
|
@@ -39046,6 +39100,7 @@ class Grid {
|
|
39046
39100
|
}
|
39047
39101
|
} else {
|
39048
39102
|
this.builder.uo.saveForUndo();
|
39103
|
+
this.builder.hideTools();
|
39049
39104
|
var rowElement = row.cloneNode(true);
|
39050
39105
|
rowElement.innerHTML = '';
|
39051
39106
|
rowElement.appendChild(cell);
|
@@ -43511,8 +43566,10 @@ const renderSnippetPanel = (builder, snippetOpen) => {
|
|
43511
43566
|
// evt.related.getBoundingClientRect().top>window.innerHeight) {
|
43512
43567
|
// return false;
|
43513
43568
|
// }
|
43514
|
-
},
|
43515
43569
|
|
43570
|
+
const wrapper = builder.doc.querySelector(builder.page);
|
43571
|
+
if (wrapper) wrapper.style.marginLeft = '';
|
43572
|
+
},
|
43516
43573
|
onSort: evt => {
|
43517
43574
|
if (!builder.canvas) return;
|
43518
43575
|
let snippetX = evt.originalEvent.clientX;
|
@@ -43528,6 +43585,12 @@ const renderSnippetPanel = (builder, snippetOpen) => {
|
|
43528
43585
|
block.style.left = x + '%';
|
43529
43586
|
block.removeAttribute('data-new-dummy');
|
43530
43587
|
}
|
43588
|
+
|
43589
|
+
// to prevent flicker caused by snippet panel above wrapper (see contentbuilder.js sectionDropSetup)
|
43590
|
+
if (builder.page && builder.page === '.is-wrapper') {
|
43591
|
+
const wrapper = builder.doc.querySelector(builder.page);
|
43592
|
+
if (wrapper) wrapper.style.marginLeft = '';
|
43593
|
+
}
|
43531
43594
|
},
|
43532
43595
|
onStart: () => {
|
43533
43596
|
// Remove .builder-active during dragging (because this class makes rows have border-right/left 120px)
|
@@ -43576,6 +43639,12 @@ const renderSnippetPanel = (builder, snippetOpen) => {
|
|
43576
43639
|
}
|
43577
43640
|
let dummies = builder.doc.querySelectorAll('.block-dummy');
|
43578
43641
|
dummies.forEach(elm => elm.parentNode.removeChild(elm));
|
43642
|
+
|
43643
|
+
// to prevent flicker caused by snippet panel above wrapper (see contentbuilder.js sectionDropSetup)
|
43644
|
+
if (builder.page && builder.page === '.is-wrapper') {
|
43645
|
+
const wrapper = builder.doc.querySelector(builder.page);
|
43646
|
+
if (wrapper) wrapper.style.marginLeft = '';
|
43647
|
+
}
|
43579
43648
|
}, 10);
|
43580
43649
|
}
|
43581
43650
|
});
|
@@ -112615,7 +112684,7 @@ class ContentBuilder {
|
|
112615
112684
|
deleteConfirm: false,
|
112616
112685
|
disableBootstrapIcons: false,
|
112617
112686
|
sectionTemplate: `
|
112618
|
-
<div class="is-section is-box is-section-100 type-
|
112687
|
+
<div class="is-section is-box is-section-100 type-system-ui">
|
112619
112688
|
<div class="is-overlay"></div>
|
112620
112689
|
<div class="is-boxes">
|
112621
112690
|
<div class="is-box-centered">
|
@@ -113681,10 +113750,17 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
|
|
113681
113750
|
this.util.repositionColumnTool();
|
113682
113751
|
}
|
113683
113752
|
this.elmTool.repositionElementTool(true);
|
113684
|
-
|
113685
|
-
if
|
113686
|
-
if
|
113687
|
-
this.
|
113753
|
+
|
113754
|
+
// if(this.element.image.imageTool) this.element.image.imageTool.style.display='';
|
113755
|
+
// if(this.element.module.moduleTool) this.element.module.moduleTool.style.display='';
|
113756
|
+
// if(this.element.hyperlink.linkTool) this.element.hyperlink.linkTool.style.display='';
|
113757
|
+
// this.colTool.lockIndicator.style.display='';
|
113758
|
+
|
113759
|
+
// this.hideTools();
|
113760
|
+
setTimeout(() => {
|
113761
|
+
this.hideTools();
|
113762
|
+
}, 40); // give delay, in case of programmatically click after col move
|
113763
|
+
|
113688
113764
|
return ret;
|
113689
113765
|
};
|
113690
113766
|
|
@@ -118742,6 +118818,11 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
|
|
118742
118818
|
if (this.page) {
|
118743
118819
|
if (this.page !== '.is-wrapper') return; // only for ContentBox
|
118744
118820
|
const wrapper = this.doc.querySelector(this.page);
|
118821
|
+
|
118822
|
+
// to prevent flicker caused by snippet panel above wrapper
|
118823
|
+
if (!wrapper.querySelector('.is-section')) {
|
118824
|
+
wrapper.style.marginLeft = '300px';
|
118825
|
+
}
|
118745
118826
|
this.sortableOnPage = new Sortable(wrapper, {
|
118746
118827
|
scroll: true,
|
118747
118828
|
group: 'shared',
|
@@ -118835,6 +118916,13 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
|
|
118835
118916
|
|
118836
118917
|
if (this.opts.emailMode) bSnippet = false;
|
118837
118918
|
|
118919
|
+
// check if is block
|
118920
|
+
let isBlock = false;
|
118921
|
+
if (html.includes('"is-block')) {
|
118922
|
+
isBlock = true;
|
118923
|
+
bSnippet = false;
|
118924
|
+
}
|
118925
|
+
|
118838
118926
|
// Convert snippet into your defined 12 columns grid
|
118839
118927
|
var rowClass = this.opts.row; //row
|
118840
118928
|
var colClass = this.opts.cols; //['col s1', 'col s2', 'col s3', 'col s4', 'col s5', 'col s6', 'col s7', 'col s8', 'col s9', 'col s10', 'col s11', 'col s12']
|
@@ -118892,6 +118980,14 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
|
|
118892
118980
|
// </div>
|
118893
118981
|
// `;
|
118894
118982
|
itemEl.outerHTML = this.settings.sectionTemplate.replace('[%CONTENT%]', html);
|
118983
|
+
} else if (isBlock) {
|
118984
|
+
let canvasTemplate = `
|
118985
|
+
<div class="is-section is-box is-section-100 type-system-ui box-canvas autolayout last-box">
|
118986
|
+
<div class="is-overlay"></div>
|
118987
|
+
[%CONTENT%]
|
118988
|
+
</div>
|
118989
|
+
`;
|
118990
|
+
itemEl.outerHTML = canvasTemplate.replace('[%CONTENT%]', html);
|
118895
118991
|
} else {
|
118896
118992
|
// Snippet is wrapped in row/colum (may contain custom code or has [data-html] attribute)
|
118897
118993
|
// Can only be inserted after current row or last row (not on column or element).
|
@@ -118977,6 +119073,16 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
|
|
118977
119073
|
hideElementTools() {
|
118978
119074
|
let elmTool = this.doc.querySelector('.is-element-tool');
|
118979
119075
|
if (elmTool) elmTool.style.display = '';
|
119076
|
+
let videoTool = this.doc.querySelector('.is-video-tool');
|
119077
|
+
if (videoTool) videoTool.style.display = '';
|
119078
|
+
let audioTool = this.doc.querySelector('.is-audio-tool');
|
119079
|
+
if (audioTool) audioTool.style.display = '';
|
119080
|
+
let iframeTool = this.doc.querySelector('.is-iframe-tool');
|
119081
|
+
if (iframeTool) iframeTool.style.display = '';
|
119082
|
+
let moduleTool = this.doc.querySelector('.is-module-tool');
|
119083
|
+
if (moduleTool) moduleTool.style.display = '';
|
119084
|
+
let lockIndicator = this.doc.querySelector('.is-locked-indicator');
|
119085
|
+
if (lockIndicator) lockIndicator.style.display = '';
|
118980
119086
|
let linkTool = this.doc.querySelector('#divLinkTool');
|
118981
119087
|
if (linkTool) linkTool.style.display = '';
|
118982
119088
|
let spacerTool = this.builderStuff.querySelector('.is-spacer-tool');
|
@@ -118990,6 +119096,32 @@ Add an image for each feature.`, 'Create a new content showcasing a photo galler
|
|
118990
119096
|
this.inspectedElement = null;
|
118991
119097
|
this.activeElement = null;
|
118992
119098
|
}
|
119099
|
+
hideTools() {
|
119100
|
+
// used by contentbuilder.js & grid.js
|
119101
|
+
|
119102
|
+
// let elmTool = this.doc.querySelector('.is-element-tool');
|
119103
|
+
// if(elmTool) elmTool.style.display = '';
|
119104
|
+
|
119105
|
+
let videoTool = this.doc.querySelector('.is-video-tool');
|
119106
|
+
if (videoTool) videoTool.style.display = '';
|
119107
|
+
let audioTool = this.doc.querySelector('.is-audio-tool');
|
119108
|
+
if (audioTool) audioTool.style.display = '';
|
119109
|
+
let iframeTool = this.doc.querySelector('.is-iframe-tool');
|
119110
|
+
if (iframeTool) iframeTool.style.display = '';
|
119111
|
+
let moduleTool = this.doc.querySelector('.is-module-tool');
|
119112
|
+
if (moduleTool) moduleTool.style.display = '';
|
119113
|
+
let lockIndicator = this.doc.querySelector('.is-locked-indicator');
|
119114
|
+
if (lockIndicator) lockIndicator.style.display = '';
|
119115
|
+
let linkTool = this.doc.querySelector('#divLinkTool');
|
119116
|
+
if (linkTool) linkTool.style.display = '';
|
119117
|
+
let spacerTool = this.builderStuff.querySelector('.is-spacer-tool');
|
119118
|
+
if (spacerTool) spacerTool.style.display = '';
|
119119
|
+
this.element.image.hideImageTool();
|
119120
|
+
|
119121
|
+
// this.doc.querySelectorAll('.icon-active').forEach(elm => elm.classList.remove('icon-active'));
|
119122
|
+
// this.doc.querySelectorAll('.elm-inspected').forEach(elm => elm.classList.remove('elm-inspected'));
|
119123
|
+
// this.doc.querySelectorAll('.elm-active').forEach(elm => elm.classList.remove('elm-active'));
|
119124
|
+
}
|
118993
119125
|
}
|
118994
119126
|
|
118995
119127
|
class ContentStuff {
|
@@ -145657,6 +145789,7 @@ class IframePanel {
|
|
145657
145789
|
|
145658
145790
|
document.addEventListener('mousemove', this.handleResizeMove);
|
145659
145791
|
document.addEventListener('touchmove', this.handleResizeMove);
|
145792
|
+
this.hideTools();
|
145660
145793
|
}, 100);
|
145661
145794
|
document.addEventListener('mouseup', this.handleResizeEnd);
|
145662
145795
|
document.addEventListener('touchend', this.handleResizeEnd);
|
@@ -145881,7 +146014,42 @@ class IframePanel {
|
|
145881
146014
|
this.repositionTool(); // this.builder.editor.screenMode = this.builder.screenMode; // Passsing screenMode into ContentBuilder
|
145882
146015
|
}
|
145883
146016
|
|
146017
|
+
hideTools() {
|
146018
|
+
let elmTool = this.builder.doc.querySelector('.is-element-tool');
|
146019
|
+
if (elmTool) elmTool.style.display = '';
|
146020
|
+
let videoTool = this.builder.doc.querySelector('.is-video-tool');
|
146021
|
+
if (videoTool) videoTool.style.display = '';
|
146022
|
+
let audioTool = this.builder.doc.querySelector('.is-audio-tool');
|
146023
|
+
if (audioTool) audioTool.style.display = '';
|
146024
|
+
let iframeTool = this.builder.doc.querySelector('.is-iframe-tool');
|
146025
|
+
if (iframeTool) iframeTool.style.display = '';
|
146026
|
+
let moduleTool = this.builder.doc.querySelector('.is-module-tool');
|
146027
|
+
if (moduleTool) moduleTool.style.display = '';
|
146028
|
+
let lockIndicator = this.builder.doc.querySelector('.is-locked-indicator');
|
146029
|
+
if (lockIndicator) lockIndicator.style.display = '';
|
146030
|
+
let linkTool = this.builder.doc.querySelector('#divLinkTool');
|
146031
|
+
if (linkTool) linkTool.style.display = '';
|
146032
|
+
let spacerTool = this.builderStuff.querySelector('.is-spacer-tool');
|
146033
|
+
if (spacerTool) spacerTool.style.display = '';
|
146034
|
+
this.builder.editor.element.image.hideImageTool(); // this.builder.doc.querySelectorAll('.icon-active').forEach(elm => elm.classList.remove('icon-active'));
|
146035
|
+
// this.builder.doc.querySelectorAll('.elm-inspected').forEach(elm => elm.classList.remove('elm-inspected'));
|
146036
|
+
// this.builder.doc.querySelectorAll('.elm-active').forEach(elm => elm.classList.remove('elm-active'));
|
146037
|
+
}
|
146038
|
+
|
145884
146039
|
repositionTool() {
|
146040
|
+
this.hideTools();
|
146041
|
+
let activeImage = this.builder.editor.activeImage;
|
146042
|
+
|
146043
|
+
if (activeImage) {
|
146044
|
+
setTimeout(() => {
|
146045
|
+
if (activeImage.closest('[data-html]')) {
|
146046
|
+
this.builder.editor.util.refreshModuleLayout(activeImage.closest('[data-html]'));
|
146047
|
+
}
|
146048
|
+
}, 600);
|
146049
|
+
}
|
146050
|
+
}
|
146051
|
+
|
146052
|
+
repositionTool_bak() {
|
145885
146053
|
const col = this.builder.editor.activeCol;
|
145886
146054
|
|
145887
146055
|
if (col) {
|
@@ -145927,7 +146095,19 @@ class IframePanel {
|
|
145927
146095
|
}
|
145928
146096
|
}
|
145929
146097
|
}, 600);
|
145930
|
-
}
|
146098
|
+
} // let activeModule = this.builder.editor.activeModule;
|
146099
|
+
// if(activeModule) {
|
146100
|
+
// const moduleTool = this.builder.doc.querySelector('.is-module-tool');
|
146101
|
+
// moduleTool.style.opacity = '0';
|
146102
|
+
// setTimeout(()=>{
|
146103
|
+
// moduleTool.style.opacity = '';
|
146104
|
+
// moduleTool.style.display = 'flex';
|
146105
|
+
// this.builder.editor.element.module.repositionModuleTool();
|
146106
|
+
// },600);
|
146107
|
+
// }
|
146108
|
+
// const lockInfo = this.builder.doc.querySelector('.is-locked-indicator');
|
146109
|
+
// lockInfo.style.display = '';
|
146110
|
+
|
145931
146111
|
}
|
145932
146112
|
|
145933
146113
|
loadIframe() {
|
@@ -146363,7 +146543,7 @@ class ContentBox {
|
|
146363
146543
|
deleteConfirm: false,
|
146364
146544
|
blockRotate: true,
|
146365
146545
|
sectionTemplate: `
|
146366
|
-
<div class="is-section is-box is-section-100 box-autofit type-
|
146546
|
+
<div class="is-section is-box is-section-100 box-autofit type-system-ui">
|
146367
146547
|
<div class="is-overlay"></div>
|
146368
146548
|
<div class="is-container is-content-1000 v2 size-18 leading-14">
|
146369
146549
|
[%CONTENT%]
|
@@ -150125,6 +150305,11 @@ Add an image for each feature.`, 'Create a new block showcasing a photo gallery
|
|
150125
150305
|
.is-wrapper.is-container-edit > div.section-select, .is-wrapper.is-clean-edit > div.section-select {
|
150126
150306
|
overflow-x: unset !important;
|
150127
150307
|
overflow-y: unset !important;
|
150308
|
+
z-index: 2;
|
150309
|
+
}
|
150310
|
+
|
150311
|
+
.is-wrapper.is-edit {
|
150312
|
+
min-height: 100vh;
|
150128
150313
|
}
|
150129
150314
|
|
150130
150315
|
${this.iframe ? '' : `
|