@innovastudio/contentbox 1.5.40 → 1.5.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -101905,10 +101905,24 @@ class Timeline {
|
|
|
101905
101905
|
display: flex;
|
|
101906
101906
|
}
|
|
101907
101907
|
|
|
101908
|
+
|
|
101909
|
+
.page-timeline .clear-more {
|
|
101910
|
+
display: none;
|
|
101911
|
+
position: absolute;
|
|
101912
|
+
top: auto !important;
|
|
101913
|
+
left: auto !important;
|
|
101914
|
+
right: 19px !important;
|
|
101915
|
+
bottom: 70px;
|
|
101916
|
+
padding: 8px 20px 8px;
|
|
101917
|
+
box-shadow: 3px 4px 10px 0px rgb(0 0 0 / 6%) !important;
|
|
101918
|
+
}
|
|
101919
|
+
.page-timeline .clear-more.active {
|
|
101920
|
+
display: flex;
|
|
101921
|
+
}
|
|
101908
101922
|
</style>
|
|
101909
101923
|
<div class="is-modal is-modal-content page-timeline" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">
|
|
101910
101924
|
<div class="is-modal-bar is-draggable" draggable="">
|
|
101911
|
-
<span>${out('Timeline')}</span>
|
|
101925
|
+
<span>${out('Animation Timeline Editor')}</span>
|
|
101912
101926
|
<button class="is-modal-close" tabindex="-1" title="${out('Close')}">
|
|
101913
101927
|
<svg class="is-icon-flex" style="width:23px;height:23px;"><use xlink:href="#ion-ios-close-empty"></use></svg>
|
|
101914
101928
|
</button>
|
|
@@ -102453,7 +102467,7 @@ class Timeline {
|
|
|
102453
102467
|
</button>
|
|
102454
102468
|
</div>
|
|
102455
102469
|
<div class="flex-wrap">
|
|
102456
|
-
<button type="button" class="cmd-timeline-more" style="width:40px;height:34px;"><svg class="is-icon-flex"><use xlink:href="#icon-settings"></use></svg></button>
|
|
102470
|
+
<button type="button" title="${out('More')}" class="cmd-timeline-more" style="width:40px;height:34px;"><svg class="is-icon-flex"><use xlink:href="#icon-settings"></use></svg></button>
|
|
102457
102471
|
|
|
102458
102472
|
<!--<button title="${out('Clear All')}" class="cmd-clear-timeline" style="width:40px;height:34px;">
|
|
102459
102473
|
<svg class="is-icon-flex" style="width:10px;height:10px;"><use xlink:href="#icon-clean"></use></svg>
|
|
@@ -102497,9 +102511,19 @@ class Timeline {
|
|
|
102497
102511
|
</div>
|
|
102498
102512
|
</div>
|
|
102499
102513
|
<div class="flex-wrap" style="margin-top:8px;">
|
|
102500
|
-
|
|
102501
|
-
|
|
102502
|
-
|
|
102514
|
+
<button title="${out('Clear All')}" class="cmd-clear-timeline" style="width:30px;height:23px;flex: none;box-shadow: none !important;background: transparent !important;">
|
|
102515
|
+
<svg class="is-icon-flex" style="width:10px;height:10px;"><use xlink:href="#icon-clean"></use></svg>
|
|
102516
|
+
</button>
|
|
102517
|
+
<button title="${out('More')}" type="button" class="cmd-clear-more" style="width:30px;height:23px;">
|
|
102518
|
+
<svg class="is-icon-flex" style="width: 14px;height: 14px;"><use xlink:href="#ion-more"></use></svg>
|
|
102519
|
+
</button>
|
|
102520
|
+
</div>
|
|
102521
|
+
|
|
102522
|
+
<div class="clear-more flex-wrap is-pop">
|
|
102523
|
+
<button title="${out('Clear All Animations in Section')}" class="cmd-clear-timeline-all" style="flex:none;width:auto;padding:0px !important;box-shadow:none !important;background:transparent !important;">
|
|
102524
|
+
<svg class="is-icon-flex" style="width:10px;height:10px;"><use xlink:href="#icon-clean"></use></svg>
|
|
102525
|
+
<span style="margin-left:7px">${out('Clear All Animations in Section')}</span>
|
|
102526
|
+
</button>
|
|
102503
102527
|
</div>
|
|
102504
102528
|
|
|
102505
102529
|
<div class="timeline-more flex-wrap is-pop">
|
|
@@ -102727,6 +102751,11 @@ class Timeline {
|
|
|
102727
102751
|
const more = modalTimeline.querySelector('.timeline-more');
|
|
102728
102752
|
this.builder.editor.util.showPop(more, false, btnTimelineMore);
|
|
102729
102753
|
});
|
|
102754
|
+
const btnClearMore = modalTimeline.querySelector('.cmd-clear-more');
|
|
102755
|
+
btnClearMore.addEventListener('click', () => {
|
|
102756
|
+
const more = modalTimeline.querySelector('.clear-more');
|
|
102757
|
+
this.builder.editor.util.showPop(more, false, btnClearMore);
|
|
102758
|
+
});
|
|
102730
102759
|
const chkPinSection = modalTimeline.querySelector('#chkPinSection2');
|
|
102731
102760
|
const divPinSpacing = modalTimeline.querySelector('.div-pin-spacing');
|
|
102732
102761
|
chkPinSection.addEventListener('click', () => {
|
|
@@ -102863,6 +102892,71 @@ class Timeline {
|
|
|
102863
102892
|
|
|
102864
102893
|
this.builder.settings.onChange();
|
|
102865
102894
|
});
|
|
102895
|
+
const btnClearTimelineAll = modalTimeline.querySelector('.cmd-clear-timeline-all'); // see animatescroll.js (.cmd-clear-anim-all)
|
|
102896
|
+
|
|
102897
|
+
btnClearTimelineAll.addEventListener('click', () => {
|
|
102898
|
+
let section = this.builder.activeSection;
|
|
102899
|
+
if (!section) return;
|
|
102900
|
+
this.builder.editor.saveForUndo();
|
|
102901
|
+
let activeCol = this.builder.editor.activeCol;
|
|
102902
|
+
if (activeCol) section = activeCol.closest('.is-section');
|
|
102903
|
+
let elms; // elms = section.querySelectorAll('*');
|
|
102904
|
+
|
|
102905
|
+
elms = document.querySelectorAll('[data-bottom-top],[data-center],[data-center-bottom],[data-100-top],[data-50-top],[data-top],[data-top-bottom],[data-center-top],[data--300-bottom],[data--150-bottom],[data--50-bottom],[data-bottom],[data-100-bottom],[data-150-bottom],[data-400-bottom],' + '[data--400-bottom],[data--200-bottom],[data--100-bottom],[data-50-bottom],[data-200-bottom],[data-300-bottom],' + '[data-in],[data-in-150],[data-in-300],' + '[data-cen--150],[data-cen],[data-cen-150],[data-out--300],[data-out--150],[data-out]' + '[data-t],[data-t-100],[data-t-200],[data-t-300],[data-t-400],' + '[data-t-500],[data-t-600],[data-t-700],[data-t-800],[data-t-900],[data-t-1000],' + '[data-t-1100],[data-t-1200],[data-t-1300],[data-t-1400],[data-t-1500],[data-t-1600],' + '[data-t-1700],[data-t-1800],[data-t-1900],[data-t-2000],[data-t-2100],[data-t-2200],' + '[data-t-2300],[data-t-2400],[data-t-2500],[data-t-2600],[data-t-2700],[data-t-2800]');
|
|
102906
|
+
elms.forEach(elm => {
|
|
102907
|
+
elm.removeAttribute('data-center');
|
|
102908
|
+
elm.removeAttribute('data-center-top');
|
|
102909
|
+
elm.removeAttribute('data--50-bottom');
|
|
102910
|
+
elm.removeAttribute('data--100-bottom');
|
|
102911
|
+
elm.removeAttribute('data--150-bottom');
|
|
102912
|
+
elm.removeAttribute('data--200-bottom');
|
|
102913
|
+
elm.removeAttribute('data--300-bottom');
|
|
102914
|
+
elm.removeAttribute('data--400-bottom');
|
|
102915
|
+
elm.removeAttribute('data-bottom-top');
|
|
102916
|
+
elm.removeAttribute('data-400-bottom');
|
|
102917
|
+
elm.removeAttribute('data-300-bottom');
|
|
102918
|
+
elm.removeAttribute('data-200-bottom');
|
|
102919
|
+
elm.removeAttribute('data-150-bottom');
|
|
102920
|
+
elm.removeAttribute('data-100-bottom');
|
|
102921
|
+
elm.removeAttribute('data-50-bottom');
|
|
102922
|
+
elm.removeAttribute('data-bottom');
|
|
102923
|
+
elm.removeAttribute('data-center-bottom');
|
|
102924
|
+
elm.removeAttribute('data-100-top');
|
|
102925
|
+
elm.removeAttribute('data-50-top');
|
|
102926
|
+
elm.removeAttribute('data-top');
|
|
102927
|
+
elm.removeAttribute('data-top-bottom');
|
|
102928
|
+
elm.removeAttribute('data-in');
|
|
102929
|
+
elm.removeAttribute('data-in-150');
|
|
102930
|
+
elm.removeAttribute('data-in-300');
|
|
102931
|
+
elm.removeAttribute('data-cen--150');
|
|
102932
|
+
elm.removeAttribute('data-cen');
|
|
102933
|
+
elm.removeAttribute('data-cen-150');
|
|
102934
|
+
elm.removeAttribute('data-out--300');
|
|
102935
|
+
elm.removeAttribute('data-out--150');
|
|
102936
|
+
elm.removeAttribute('data-out');
|
|
102937
|
+
elm.removeAttribute('data-hidden-onstart');
|
|
102938
|
+
this.cleanup(elm, true);
|
|
102939
|
+
this.builder.animateScroll.cleanupDelay(elm); //extra
|
|
102940
|
+
|
|
102941
|
+
elm.style.transform = '';
|
|
102942
|
+
elm.style.transition = '';
|
|
102943
|
+
elm.style.opacity = '';
|
|
102944
|
+
elm.style.transformOrigin = '';
|
|
102945
|
+
});
|
|
102946
|
+
elms = section.querySelectorAll('.is-animated');
|
|
102947
|
+
elms.forEach(elm => {
|
|
102948
|
+
// if(elm.classList.contains('is-overlay-bg')) return;
|
|
102949
|
+
this.builder.animateScroll.cleanupBasic(elm);
|
|
102950
|
+
this.builder.animateScroll.cleanupDelay(elm);
|
|
102951
|
+
});
|
|
102952
|
+
this.builder.animateScroll.refreshPage(); // Stable alternative to skrollrr.refresh()
|
|
102953
|
+
|
|
102954
|
+
this.read(); // Refresh
|
|
102955
|
+
|
|
102956
|
+
this.builder.settings.onRender(); //Trigger Change event
|
|
102957
|
+
|
|
102958
|
+
this.builder.settings.onChange();
|
|
102959
|
+
});
|
|
102866
102960
|
const chkTimelineDisableOnMobile = modalTimeline.querySelector('#chkTimelineDisableOnMobile');
|
|
102867
102961
|
chkTimelineDisableOnMobile.addEventListener('click', () => {
|
|
102868
102962
|
const section = this.builder.activeSection;
|
|
@@ -103796,11 +103890,11 @@ class Timeline {
|
|
|
103796
103890
|
this.builder.settings.onChange();
|
|
103797
103891
|
}
|
|
103798
103892
|
|
|
103799
|
-
cleanup(activeElement) {
|
|
103893
|
+
cleanup(activeElement, all) {
|
|
103800
103894
|
let device = this.getDevice();
|
|
103801
103895
|
activeElement.removeAttribute('data-hidden-onstart');
|
|
103802
103896
|
|
|
103803
|
-
if (
|
|
103897
|
+
if (all) {
|
|
103804
103898
|
activeElement.removeAttribute('data-xs');
|
|
103805
103899
|
activeElement.removeAttribute('data-xs-t');
|
|
103806
103900
|
activeElement.removeAttribute('data-xs-t-100');
|
|
@@ -103831,7 +103925,6 @@ class Timeline {
|
|
|
103831
103925
|
activeElement.removeAttribute('data-xs-t-2600');
|
|
103832
103926
|
activeElement.removeAttribute('data-xs-t-2700');
|
|
103833
103927
|
activeElement.removeAttribute('data-xs-t-2800');
|
|
103834
|
-
} else if (device === 'sm') {
|
|
103835
103928
|
activeElement.removeAttribute('data-sm');
|
|
103836
103929
|
activeElement.removeAttribute('data-sm-t');
|
|
103837
103930
|
activeElement.removeAttribute('data-sm-t-100');
|
|
@@ -103862,7 +103955,6 @@ class Timeline {
|
|
|
103862
103955
|
activeElement.removeAttribute('data-sm-t-2600');
|
|
103863
103956
|
activeElement.removeAttribute('data-sm-t-2700');
|
|
103864
103957
|
activeElement.removeAttribute('data-sm-t-2800');
|
|
103865
|
-
} else if (device === 'md') {
|
|
103866
103958
|
activeElement.removeAttribute('data-md');
|
|
103867
103959
|
activeElement.removeAttribute('data-md-t');
|
|
103868
103960
|
activeElement.removeAttribute('data-md-t-100');
|
|
@@ -103893,7 +103985,6 @@ class Timeline {
|
|
|
103893
103985
|
activeElement.removeAttribute('data-md-t-2600');
|
|
103894
103986
|
activeElement.removeAttribute('data-md-t-2700');
|
|
103895
103987
|
activeElement.removeAttribute('data-md-t-2800');
|
|
103896
|
-
} else {
|
|
103897
103988
|
activeElement.removeAttribute('data-t');
|
|
103898
103989
|
activeElement.removeAttribute('data-t-100');
|
|
103899
103990
|
activeElement.removeAttribute('data-t-200');
|
|
@@ -103923,6 +104014,131 @@ class Timeline {
|
|
|
103923
104014
|
activeElement.removeAttribute('data-t-2600');
|
|
103924
104015
|
activeElement.removeAttribute('data-t-2700');
|
|
103925
104016
|
activeElement.removeAttribute('data-t-2800');
|
|
104017
|
+
} else {
|
|
104018
|
+
if (device === 'xs') {
|
|
104019
|
+
activeElement.removeAttribute('data-xs');
|
|
104020
|
+
activeElement.removeAttribute('data-xs-t');
|
|
104021
|
+
activeElement.removeAttribute('data-xs-t-100');
|
|
104022
|
+
activeElement.removeAttribute('data-xs-t-200');
|
|
104023
|
+
activeElement.removeAttribute('data-xs-t-300');
|
|
104024
|
+
activeElement.removeAttribute('data-xs-t-400');
|
|
104025
|
+
activeElement.removeAttribute('data-xs-t-500');
|
|
104026
|
+
activeElement.removeAttribute('data-xs-t-600');
|
|
104027
|
+
activeElement.removeAttribute('data-xs-t-700');
|
|
104028
|
+
activeElement.removeAttribute('data-xs-t-800');
|
|
104029
|
+
activeElement.removeAttribute('data-xs-t-900');
|
|
104030
|
+
activeElement.removeAttribute('data-xs-t-1000');
|
|
104031
|
+
activeElement.removeAttribute('data-xs-t-1100');
|
|
104032
|
+
activeElement.removeAttribute('data-xs-t-1200');
|
|
104033
|
+
activeElement.removeAttribute('data-xs-t-1300');
|
|
104034
|
+
activeElement.removeAttribute('data-xs-t-1400');
|
|
104035
|
+
activeElement.removeAttribute('data-xs-t-1500');
|
|
104036
|
+
activeElement.removeAttribute('data-xs-t-1600');
|
|
104037
|
+
activeElement.removeAttribute('data-xs-t-1700');
|
|
104038
|
+
activeElement.removeAttribute('data-xs-t-1800');
|
|
104039
|
+
activeElement.removeAttribute('data-xs-t-1900');
|
|
104040
|
+
activeElement.removeAttribute('data-xs-t-2000');
|
|
104041
|
+
activeElement.removeAttribute('data-xs-t-2100');
|
|
104042
|
+
activeElement.removeAttribute('data-xs-t-2200');
|
|
104043
|
+
activeElement.removeAttribute('data-xs-t-2300');
|
|
104044
|
+
activeElement.removeAttribute('data-xs-t-2400');
|
|
104045
|
+
activeElement.removeAttribute('data-xs-t-2500');
|
|
104046
|
+
activeElement.removeAttribute('data-xs-t-2600');
|
|
104047
|
+
activeElement.removeAttribute('data-xs-t-2700');
|
|
104048
|
+
activeElement.removeAttribute('data-xs-t-2800');
|
|
104049
|
+
} else if (device === 'sm') {
|
|
104050
|
+
activeElement.removeAttribute('data-sm');
|
|
104051
|
+
activeElement.removeAttribute('data-sm-t');
|
|
104052
|
+
activeElement.removeAttribute('data-sm-t-100');
|
|
104053
|
+
activeElement.removeAttribute('data-sm-t-200');
|
|
104054
|
+
activeElement.removeAttribute('data-sm-t-300');
|
|
104055
|
+
activeElement.removeAttribute('data-sm-t-400');
|
|
104056
|
+
activeElement.removeAttribute('data-sm-t-500');
|
|
104057
|
+
activeElement.removeAttribute('data-sm-t-600');
|
|
104058
|
+
activeElement.removeAttribute('data-sm-t-700');
|
|
104059
|
+
activeElement.removeAttribute('data-sm-t-800');
|
|
104060
|
+
activeElement.removeAttribute('data-sm-t-900');
|
|
104061
|
+
activeElement.removeAttribute('data-sm-t-1000');
|
|
104062
|
+
activeElement.removeAttribute('data-sm-t-1100');
|
|
104063
|
+
activeElement.removeAttribute('data-sm-t-1200');
|
|
104064
|
+
activeElement.removeAttribute('data-sm-t-1300');
|
|
104065
|
+
activeElement.removeAttribute('data-sm-t-1400');
|
|
104066
|
+
activeElement.removeAttribute('data-sm-t-1500');
|
|
104067
|
+
activeElement.removeAttribute('data-sm-t-1600');
|
|
104068
|
+
activeElement.removeAttribute('data-sm-t-1700');
|
|
104069
|
+
activeElement.removeAttribute('data-sm-t-1800');
|
|
104070
|
+
activeElement.removeAttribute('data-sm-t-1900');
|
|
104071
|
+
activeElement.removeAttribute('data-sm-t-2000');
|
|
104072
|
+
activeElement.removeAttribute('data-sm-t-2100');
|
|
104073
|
+
activeElement.removeAttribute('data-sm-t-2200');
|
|
104074
|
+
activeElement.removeAttribute('data-sm-t-2300');
|
|
104075
|
+
activeElement.removeAttribute('data-sm-t-2400');
|
|
104076
|
+
activeElement.removeAttribute('data-sm-t-2500');
|
|
104077
|
+
activeElement.removeAttribute('data-sm-t-2600');
|
|
104078
|
+
activeElement.removeAttribute('data-sm-t-2700');
|
|
104079
|
+
activeElement.removeAttribute('data-sm-t-2800');
|
|
104080
|
+
} else if (device === 'md') {
|
|
104081
|
+
activeElement.removeAttribute('data-md');
|
|
104082
|
+
activeElement.removeAttribute('data-md-t');
|
|
104083
|
+
activeElement.removeAttribute('data-md-t-100');
|
|
104084
|
+
activeElement.removeAttribute('data-md-t-200');
|
|
104085
|
+
activeElement.removeAttribute('data-md-t-300');
|
|
104086
|
+
activeElement.removeAttribute('data-md-t-400');
|
|
104087
|
+
activeElement.removeAttribute('data-md-t-500');
|
|
104088
|
+
activeElement.removeAttribute('data-md-t-600');
|
|
104089
|
+
activeElement.removeAttribute('data-md-t-700');
|
|
104090
|
+
activeElement.removeAttribute('data-md-t-800');
|
|
104091
|
+
activeElement.removeAttribute('data-md-t-900');
|
|
104092
|
+
activeElement.removeAttribute('data-md-t-1000');
|
|
104093
|
+
activeElement.removeAttribute('data-md-t-1100');
|
|
104094
|
+
activeElement.removeAttribute('data-md-t-1200');
|
|
104095
|
+
activeElement.removeAttribute('data-md-t-1300');
|
|
104096
|
+
activeElement.removeAttribute('data-md-t-1400');
|
|
104097
|
+
activeElement.removeAttribute('data-md-t-1500');
|
|
104098
|
+
activeElement.removeAttribute('data-md-t-1600');
|
|
104099
|
+
activeElement.removeAttribute('data-md-t-1700');
|
|
104100
|
+
activeElement.removeAttribute('data-md-t-1800');
|
|
104101
|
+
activeElement.removeAttribute('data-md-t-1900');
|
|
104102
|
+
activeElement.removeAttribute('data-md-t-2000');
|
|
104103
|
+
activeElement.removeAttribute('data-md-t-2100');
|
|
104104
|
+
activeElement.removeAttribute('data-md-t-2200');
|
|
104105
|
+
activeElement.removeAttribute('data-md-t-2300');
|
|
104106
|
+
activeElement.removeAttribute('data-md-t-2400');
|
|
104107
|
+
activeElement.removeAttribute('data-md-t-2500');
|
|
104108
|
+
activeElement.removeAttribute('data-md-t-2600');
|
|
104109
|
+
activeElement.removeAttribute('data-md-t-2700');
|
|
104110
|
+
activeElement.removeAttribute('data-md-t-2800');
|
|
104111
|
+
} else {
|
|
104112
|
+
activeElement.removeAttribute('data-t');
|
|
104113
|
+
activeElement.removeAttribute('data-t-100');
|
|
104114
|
+
activeElement.removeAttribute('data-t-200');
|
|
104115
|
+
activeElement.removeAttribute('data-t-300');
|
|
104116
|
+
activeElement.removeAttribute('data-t-400');
|
|
104117
|
+
activeElement.removeAttribute('data-t-500');
|
|
104118
|
+
activeElement.removeAttribute('data-t-600');
|
|
104119
|
+
activeElement.removeAttribute('data-t-700');
|
|
104120
|
+
activeElement.removeAttribute('data-t-800');
|
|
104121
|
+
activeElement.removeAttribute('data-t-900');
|
|
104122
|
+
activeElement.removeAttribute('data-t-1000');
|
|
104123
|
+
activeElement.removeAttribute('data-t-1100');
|
|
104124
|
+
activeElement.removeAttribute('data-t-1200');
|
|
104125
|
+
activeElement.removeAttribute('data-t-1300');
|
|
104126
|
+
activeElement.removeAttribute('data-t-1400');
|
|
104127
|
+
activeElement.removeAttribute('data-t-1500');
|
|
104128
|
+
activeElement.removeAttribute('data-t-1600');
|
|
104129
|
+
activeElement.removeAttribute('data-t-1700');
|
|
104130
|
+
activeElement.removeAttribute('data-t-1800');
|
|
104131
|
+
activeElement.removeAttribute('data-t-1900');
|
|
104132
|
+
activeElement.removeAttribute('data-t-2000');
|
|
104133
|
+
activeElement.removeAttribute('data-t-2100');
|
|
104134
|
+
activeElement.removeAttribute('data-t-2200');
|
|
104135
|
+
activeElement.removeAttribute('data-t-2300');
|
|
104136
|
+
activeElement.removeAttribute('data-t-2400');
|
|
104137
|
+
activeElement.removeAttribute('data-t-2500');
|
|
104138
|
+
activeElement.removeAttribute('data-t-2600');
|
|
104139
|
+
activeElement.removeAttribute('data-t-2700');
|
|
104140
|
+
activeElement.removeAttribute('data-t-2800');
|
|
104141
|
+
}
|
|
103926
104142
|
} // Cleanup from simple timeline panel
|
|
103927
104143
|
|
|
103928
104144
|
|