@innovastudio/contentbox 1.6.2 → 1.6.3
Sign up to get free protection for your applications and to get access to all the features.
- package/package.json +2 -2
- package/public/contentbox/contentbox.esm.js +67 -14
- package/public/contentbox/contentbox.min.js +3 -3
- package/readme.txt +1 -1
- package/public/contentbox/contentbox.js +0 -141156
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.3",
|
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.4.
|
55
|
+
"@innovastudio/contentbuilder": "^1.4.128",
|
56
56
|
"choices.js": "^10.2.0",
|
57
57
|
"js-beautify": "^1.14.0"
|
58
58
|
}
|
@@ -21001,6 +21001,7 @@ class PanelColumn {
|
|
21001
21001
|
</div>
|
21002
21002
|
</div>
|
21003
21003
|
<div class="group">
|
21004
|
+
<button title="${out('Space Between')}" data-content-justify="spacebetween"><svg><use xlink:href="#icon-space-between"></use></svg></button>
|
21004
21005
|
<button title="${out('Clear')}" class="btn-clear" data-content-pos=""><svg><use xlink:href="#icon-eraser"></use></svg></button>
|
21005
21006
|
</div>
|
21006
21007
|
</div>
|
@@ -21226,6 +21227,40 @@ class PanelColumn {
|
|
21226
21227
|
});
|
21227
21228
|
}); // Positiom
|
21228
21229
|
|
21230
|
+
const btnContentJustify = panel.querySelectorAll('[data-content-justify]');
|
21231
|
+
btnContentJustify.forEach(btn => {
|
21232
|
+
btn.addEventListener('click', () => {
|
21233
|
+
this.builder.editor.saveForUndo();
|
21234
|
+
let activeColumn = this.builder.controlpanel.activeColumn;
|
21235
|
+
let s = btn.getAttribute('data-content-justify');
|
21236
|
+
const config = this.builder.cssClasses;
|
21237
|
+
panel.querySelectorAll('[data-content-pos]').forEach(btn => btn.classList.remove('on'));
|
21238
|
+
let classes = config.display;
|
21239
|
+
this.addCssClass(activeColumn, classes.flex, classes);
|
21240
|
+
classes = config.flexDirection;
|
21241
|
+
this.addCssClass(activeColumn, classes.column, classes);
|
21242
|
+
|
21243
|
+
if (s === 'spacebetween') {
|
21244
|
+
classes = config.justifyContent;
|
21245
|
+
this.addCssClass(activeColumn, classes.between, classes);
|
21246
|
+
classes = config.alignItems;
|
21247
|
+
|
21248
|
+
if (activeColumn.classList.contains('items-start')) {
|
21249
|
+
panel.querySelector('[data-content-pos="centerleft"').classList.add('on');
|
21250
|
+
} else if (activeColumn.classList.contains('items-center')) {
|
21251
|
+
panel.querySelector('[data-content-pos="center"').classList.add('on');
|
21252
|
+
} else if (activeColumn.classList.contains('items-end')) {
|
21253
|
+
panel.querySelector('[data-content-pos="centerright"').classList.add('on');
|
21254
|
+
} else {
|
21255
|
+
panel.querySelector('[data-content-pos="centerleft"').classList.add('on');
|
21256
|
+
}
|
21257
|
+
}
|
21258
|
+
|
21259
|
+
panel.querySelectorAll('[data-content-justify]').forEach(btn => btn.classList.remove('on'));
|
21260
|
+
btn.classList.add('on');
|
21261
|
+
this.builder.onChange();
|
21262
|
+
});
|
21263
|
+
});
|
21229
21264
|
const btnContentPos = panel.querySelectorAll('[data-content-pos]');
|
21230
21265
|
btnContentPos.forEach(btn => {
|
21231
21266
|
btn.addEventListener('click', () => {
|
@@ -21233,6 +21268,7 @@ class PanelColumn {
|
|
21233
21268
|
let activeColumn = this.builder.controlpanel.activeColumn;
|
21234
21269
|
let s = btn.getAttribute('data-content-pos');
|
21235
21270
|
const config = this.builder.cssClasses;
|
21271
|
+
panel.querySelectorAll('[data-content-justify]').forEach(btn => btn.classList.remove('on'));
|
21236
21272
|
|
21237
21273
|
if (s !== '') {
|
21238
21274
|
let classes = config.display;
|
@@ -21242,9 +21278,10 @@ class PanelColumn {
|
|
21242
21278
|
|
21243
21279
|
if (s === 'topleft') {
|
21244
21280
|
let classes = config.justifyContent;
|
21245
|
-
this.addCssClass(activeColumn, classes.start, classes);
|
21246
|
-
|
21247
|
-
|
21281
|
+
this.addCssClass(activeColumn, classes.start, classes); // classes = config.alignItems;
|
21282
|
+
// this.addCssClass(activeColumn, classes.start, classes);
|
21283
|
+
|
21284
|
+
this.removeCssClasses(activeColumn, config.alignItems);
|
21248
21285
|
}
|
21249
21286
|
|
21250
21287
|
if (s === 'topcenter') {
|
@@ -21263,9 +21300,10 @@ class PanelColumn {
|
|
21263
21300
|
|
21264
21301
|
if (s === 'centerleft') {
|
21265
21302
|
let classes = config.justifyContent;
|
21266
|
-
this.addCssClass(activeColumn, classes.center, classes);
|
21267
|
-
|
21268
|
-
|
21303
|
+
this.addCssClass(activeColumn, classes.center, classes); // classes = config.alignItems;
|
21304
|
+
// this.addCssClass(activeColumn, classes.start, classes);
|
21305
|
+
|
21306
|
+
this.removeCssClasses(activeColumn, config.alignItems);
|
21269
21307
|
}
|
21270
21308
|
|
21271
21309
|
if (s === 'center') {
|
@@ -21284,9 +21322,10 @@ class PanelColumn {
|
|
21284
21322
|
|
21285
21323
|
if (s === 'bottomleft') {
|
21286
21324
|
let classes = config.justifyContent;
|
21287
|
-
this.addCssClass(activeColumn, classes.end, classes);
|
21288
|
-
|
21289
|
-
|
21325
|
+
this.addCssClass(activeColumn, classes.end, classes); // classes = config.alignItems;
|
21326
|
+
// this.addCssClass(activeColumn, classes.start, classes);
|
21327
|
+
|
21328
|
+
this.removeCssClasses(activeColumn, config.alignItems);
|
21290
21329
|
}
|
21291
21330
|
|
21292
21331
|
if (s === 'bottomcenter') {
|
@@ -21558,17 +21597,27 @@ class PanelColumn {
|
|
21558
21597
|
} // Position
|
21559
21598
|
|
21560
21599
|
|
21561
|
-
panel.querySelectorAll('[data-content-pos]').forEach(btn => btn.classList.remove('on'));
|
21562
21600
|
let justifyContent = this.builder.cssClasses.justifyContent;
|
21601
|
+
panel.querySelectorAll('[data-content-justify]').forEach(btn => btn.classList.remove('on'));
|
21602
|
+
|
21603
|
+
if (activeColumn.classList.contains(justifyContent.between)) {
|
21604
|
+
panel.querySelector('[data-content-justify="spacebetween"').classList.add('on');
|
21605
|
+
}
|
21606
|
+
|
21607
|
+
panel.querySelectorAll('[data-content-pos]').forEach(btn => btn.classList.remove('on'));
|
21563
21608
|
let alignItems = this.builder.cssClasses.alignItems;
|
21564
21609
|
let pos = '';
|
21565
21610
|
|
21566
21611
|
if (activeColumn.classList.contains(justifyContent.start)) {
|
21567
|
-
if (activeColumn.classList.contains(alignItems.start)) pos = 'topleft';else if (activeColumn.classList.contains(alignItems.center)) pos = 'topcenter';else if (activeColumn.classList.contains(alignItems.end)) pos = 'topright';
|
21612
|
+
if (activeColumn.classList.contains(alignItems.start)) pos = 'topleft';else if (activeColumn.classList.contains(alignItems.center)) pos = 'topcenter';else if (activeColumn.classList.contains(alignItems.end)) pos = 'topright';else pos = 'topleft';
|
21568
21613
|
} else if (activeColumn.classList.contains(justifyContent.center)) {
|
21569
|
-
if (activeColumn.classList.contains(alignItems.start)) pos = 'centerleft';else if (activeColumn.classList.contains(alignItems.center)) pos = 'center';else if (activeColumn.classList.contains(alignItems.end)) pos = 'centerright';
|
21614
|
+
if (activeColumn.classList.contains(alignItems.start)) pos = 'centerleft';else if (activeColumn.classList.contains(alignItems.center)) pos = 'center';else if (activeColumn.classList.contains(alignItems.end)) pos = 'centerright';else pos = 'centerleft';
|
21570
21615
|
} else if (activeColumn.classList.contains(justifyContent.end)) {
|
21571
|
-
if (activeColumn.classList.contains(alignItems.start)) pos = 'bottomleft';else if (activeColumn.classList.contains(alignItems.center)) pos = 'bottomcenter';else if (activeColumn.classList.contains(alignItems.end)) pos = 'bottomright';
|
21616
|
+
if (activeColumn.classList.contains(alignItems.start)) pos = 'bottomleft';else if (activeColumn.classList.contains(alignItems.center)) pos = 'bottomcenter';else if (activeColumn.classList.contains(alignItems.end)) pos = 'bottomright';else pos = 'bottomleft';
|
21617
|
+
}
|
21618
|
+
|
21619
|
+
if (activeColumn.classList.contains(justifyContent.between)) {
|
21620
|
+
if (activeColumn.classList.contains(alignItems.start)) pos = 'centerleft';else if (activeColumn.classList.contains(alignItems.center)) pos = 'center';else if (activeColumn.classList.contains(alignItems.end)) pos = 'centerright';else pos = 'centerleft';
|
21572
21621
|
}
|
21573
21622
|
|
21574
21623
|
if (pos === 'topleft') {
|
@@ -30052,6 +30101,10 @@ class ControlPanel {
|
|
30052
30101
|
this.animSelection(this.activeSection);
|
30053
30102
|
}
|
30054
30103
|
}
|
30104
|
+
|
30105
|
+
if (selectFromBreadcrumb) {
|
30106
|
+
if (this.builder.onBreadcrumbSelect) this.builder.onBreadcrumbSelect();
|
30107
|
+
}
|
30055
30108
|
}
|
30056
30109
|
|
30057
30110
|
hidePanels() {
|
@@ -109869,7 +109922,7 @@ class ContentBuilder {
|
|
109869
109922
|
selection.addRange(range);
|
109870
109923
|
}
|
109871
109924
|
}
|
109872
|
-
|
109925
|
+
this.doc.execCommand('insertHTML', false, sPastedText);
|
109873
109926
|
if (this.activeCol) {
|
109874
109927
|
/*
|
109875
109928
|
Additional Cleanup:
|