@innovastudio/contentbox 1.2.36 → 1.3.0
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 +2 -2
- package/public/contentbox/contentbox.esm.js +1022 -583
- package/public/contentbox/contentbox.min.js +10 -10
- package/readme.txt +1 -1
|
@@ -384,7 +384,7 @@ class SideBar {
|
|
|
384
384
|
sideIndex++;
|
|
385
385
|
});
|
|
386
386
|
html += '</div>';
|
|
387
|
-
html += '' + '<div id="divSidebarSections" class="is-sidebar-content" style="-webkit-transition-duration:0.2s;transition-duration:0.2s;">' + '<div>' + '<iframe id="ifrIdeasPanel" src="about:blank" style="width:100%;height:100%;box-sizing:border-box;border:none;">' + '</iframe>' + '</div>' + '</div>' + '<div id="divSidebarSnippets" class="is-sidebar-content scroll-darker"" style="max-width:275px;border-left: transparent 50px solid;box-sizing: border-box;">' + '' + '</div>' + '<div id="divSidebarSource" class="is-sidebar-content" style="-webkit-transition-duration:0.2s;transition-duration:0.2s;">' + '<div>' + '<div style="position:absolute;width:240px;height:35px;right:10px;top:5px;z-index:1;display:flex;">' + '<button title="' + out('Cancel') + '" id="btnViewHtmlCancel" style="height:38px" class="classic-secondary"> ' + out('Cancel') + ' </button>' + '<button title="' + out('Ok') + '" id="btnViewHtmlOk" style="height:38px" class="classic-primary"> ' + out('Ok') + ' </button>' + '</div>' + '<div style="height:100%;box-sizing:border-box;border-top:#f3f3f3 50px solid;position:relative">' + '<textarea id="inpViewHtml" style="width:100%;height:100%;resize: none;"></textarea>' + '
|
|
387
|
+
html += '' + '<div id="divSidebarSections" class="is-sidebar-content" style="-webkit-transition-duration:0.2s;transition-duration:0.2s;">' + '<div>' + '<iframe id="ifrIdeasPanel" src="about:blank" style="width:100%;height:100%;box-sizing:border-box;border:none;">' + '</iframe>' + '</div>' + '</div>' + '<div id="divSidebarSnippets" class="is-sidebar-content scroll-darker"" style="max-width:275px;border-left: transparent 50px solid;box-sizing: border-box;">' + '' + '</div>' + '<div id="divSidebarSource" class="is-sidebar-content" style="-webkit-transition-duration:0.2s;transition-duration:0.2s;">' + '<div>' + '<div style="position:absolute;width:240px;height:35px;right:10px;top:5px;z-index:1;display:flex;">' + '<button title="' + out('Cancel') + '" id="btnViewHtmlCancel" style="height:38px" class="classic-secondary"> ' + out('Cancel') + ' </button>' + '<button title="' + out('Ok') + '" id="btnViewHtmlOk" style="height:38px" class="classic-primary"> ' + out('Ok') + ' </button>' + '</div>' + '<div style="height:100%;box-sizing:border-box;border-top:#f3f3f3 50px solid;position:relative">' + '<textarea id="inpViewHtml" style="width:100%;height:100%;resize: none;"></textarea>' + '</div>' + '</div>' + '</div>' + '<div id="divSidebarTypography" class="is-sidebar-content" style="-webkit-transition-duration:0.2s;transition-duration:0.2s;">' + '<div class="scroll-darker">' + '<div style="padding: 15px 0 0 20px">' + '<div class="is-sidebar-title" style="margin-bottom:12px;">' + out('Typography Styles') + '</div>' + '<div>' + out('Apply to') + ':</div>' + '<div style="display:flex;justify-content:space-between;align-items: center;">' + '<div class="typo-target-default" style="display:flex">' + '<label><input type="radio" name="typoTarget" value="page"> <span>' + out('Page') + '</span></label>' + '<label><input type="radio" name="typoTarget" value="section" checked> <span>' + out('Section') + '</span></label>' + '</div>' + '<div class="typo-target-box" style="display: flex;">' + '<span>' + out('Active Box') + '</span>' + '</div>' + '<button title="' + out('Clear') + '" id="btnTypoClear"><svg class="is-icon-flex" style="width:11px;height:11px;"><use xlink:href="#icon-clean"></use></svg></button>' + '</div>' + '</div>' + '<div id="divSelector"></div>' + '<div id="divStyles"></div>' + '</div>' + '</div>' + '<div id="divCustomSidebarArea1" class="is-sidebar-content" style="max-width:500px;">' + '<div style="padding:0 0 0 50px;box-sizing:border-box;">' + '<iframe id="ifrCustomSidebarArea1" src="about:blank" style="width:100%;height:100%;box-sizing:border-box;border:none;">' + '</iframe>' + '</div>' + '</div>' + '<div id="divCustomSidebarArea2" class="is-sidebar-content" style="max-width:500px;">' + '<div style="padding:0 0 0 50px;box-sizing:border-box;">' + '<iframe id="ifrCustomSidebarArea2" src="about:blank" style="width:100%;height:100%;box-sizing:border-box;border:none;">' + '</iframe>' + '</div>' + '</div>';
|
|
388
388
|
} else {
|
|
389
389
|
html = '<div id="divSections" style="display:none"></div>' + '<div class="is-modal addsection">' + '<div style="max-width: 900px;">' + '<div id="divSectionList" class="is-section-list"></div>' + '</div>' + '</div>';
|
|
390
390
|
}
|
|
@@ -549,27 +549,6 @@ class SideBar {
|
|
|
549
549
|
document.querySelectorAll('.is-sidebar-content.active').forEach(elm => {
|
|
550
550
|
dom$M.removeClass(elm, 'active');
|
|
551
551
|
});
|
|
552
|
-
}); //Open Larger Editor
|
|
553
|
-
|
|
554
|
-
const btnOpenLarger = builderStuff.querySelector('#divSidebarSource .edit-html-larger');
|
|
555
|
-
btnOpenLarger.addEventListener('click', () => {
|
|
556
|
-
let elms = builderStuff.querySelectorAll('[data-source-active]');
|
|
557
|
-
elms.forEach(elm => {
|
|
558
|
-
elm.removeAttribute('data-source-active');
|
|
559
|
-
});
|
|
560
|
-
elms = builderStuff.querySelectorAll('[data-source-ok]');
|
|
561
|
-
elms.forEach(elm => {
|
|
562
|
-
elm.removeAttribute('data-source-ok');
|
|
563
|
-
});
|
|
564
|
-
elms = builderStuff.querySelectorAll('[data-source-cancel]');
|
|
565
|
-
elms.forEach(elm => {
|
|
566
|
-
elm.removeAttribute('data-source-cancel');
|
|
567
|
-
});
|
|
568
|
-
let textarea = builderStuff.querySelector('#divSidebarSource textarea');
|
|
569
|
-
textarea.setAttribute('data-source-active', '1');
|
|
570
|
-
textarea.setAttribute('data-source-ok', '#btnViewHtmlOk');
|
|
571
|
-
textarea.setAttribute('data-source-cancel', '#btnViewHtmlCancel');
|
|
572
|
-
this.builder.editor.viewHtmlLarger();
|
|
573
552
|
});
|
|
574
553
|
let btnTypoClear = document.querySelector('#btnTypoClear');
|
|
575
554
|
btnTypoClear.addEventListener('click', () => {
|
|
@@ -1986,7 +1965,7 @@ class EditSection {
|
|
|
1986
1965
|
html += '<div class="div-section-bgcolor" style="display:flex;flex-direction:column;">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Background Color') + ':</div>' + '<div style="display:flex;">' + '<button title="' + out('Background Color') + '" class="input-section-bgcolor is-btn-color" style="margin-right:15px"></button>' + '<button title="' + out('Gradient') + '" class="input-section-gradient classic" data-value="+">' + out('Gradient') + '</button>' + '</div>' + '</div>' + '</div>' + '<div id="divSectionAnimation" class="is-tab-content" style="display:none;padding-top:0">' + '<div style="display:flex;flex-direction:column;">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Start') + ':</div>' + '<div style="display:flex;flex-flow:wrap;">' + '<button title="' + out('Slide Left') + '" class="cmd-section-anim-start" data-value="slide-left">' + out('Slide Left') + '</button>' + '<button title="' + out('Slide Right') + '" class="cmd-section-anim-start" data-value="slide-right">' + out('Slide Right') + '</button>' + '<button title="' + out('Zoom In') + '" class="cmd-section-anim-start" data-value="zoom-in">' + out('Zoom In') + '</button>' + // '<button title="' + out('Zoom Out') + '" class="cmd-section-anim-start" data-value="zoom-out">' + out('Zoom Out') + '</button>' +
|
|
1987
1966
|
'<button title="' + out('Clear') + '" class="cmd-section-anim-start" data-value=""><svg class="is-icon-flex"><use xlink:href="#icon-clean"></use></svg></button>' + '</div>' + '</div>';
|
|
1988
1967
|
html += '<div style="display:flex;flex-direction:column;">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('End') + ':</div>' + '<div style="display:flex;flex-flow:wrap;">' + '<button title="' + out('Slide Left') + '" class="cmd-section-anim-end" data-value="slide-left">' + out('Slide Left') + '</button>' + '<button title="' + out('Slide Right') + '" class="cmd-section-anim-end" data-value="slide-right">' + out('Slide Right') + '</button>' + '<button title="' + out('Slide Back') + '" class="cmd-section-anim-end" data-value="slide-back">' + out('Slide Back') + '</button>' + '<button title="' + out('Overlap') + '" class="cmd-section-anim-end" data-value="overlap">' + out('Overlap') + '</button>' + '<button title="' + out('Zoom In') + '" class="cmd-section-anim-end" data-value="zoom-in">' + out('Zoom In') + '</button>' + '<button title="' + out('Zoom Out') + '" class="cmd-section-anim-end" data-value="zoom-out">' + out('Zoom Out') + '</button>' + '<button title="' + out('Clear') + '" class="cmd-section-anim-end" data-value=""><svg class="is-icon-flex"><use xlink:href="#icon-clean"></use></svg></button>' + '</div>' + '</div>' + '</div>' + '<div id="divSectionScrollButton" class="is-tab-content" style="display:none;padding-top:0">' + '<div style="display:none;flex-direction:column;">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + '<label for="chkScrollIcon" style="margin:0;"><input id="chkScrollIcon" type="checkbox" /> ' + out('Scroll Icon') + '</label>' + '</div>' + '<div style="display:flex;padding-top:10px;">' + '<button title="' + out('Light') + '" class="cmd-section-scroll" data-value="light" style="min-width:80px;">' + out('Light') + '</button>' + '<button title="' + out('Dark') + '" class="cmd-section-scroll" data-value="dark" style="border-left:none;min-width:80px;">' + out('Dark') + '</button>' + '</div>' + '</div>' + '<div style="display:flex;flex-direction:column;padding-bottom:3px;">' + '<div style="padding-top:20px;padding-bottom:3px;">' + out('Scroll Button') + ':</div>' + '<div style="display:flex;flex-flow:wrap;">' + '<button class="cmd-scroll-preset" data-value="1" title="' + out('Apply') + '" type="button">1</button>' + '<button class="cmd-scroll-preset" data-value="2" title="' + out('Apply') + '" type="button">2</button>' + '<button class="cmd-scroll-preset" data-value="3" title="' + out('Apply') + '" type="button">3</button>' + '<button class="cmd-scroll-preset" data-value="4" title="' + out('Apply') + '" type="button">4</button>' + '<button class="cmd-scroll-preset" data-value="5" title="' + out('Apply') + '" type="button">5</button>' + '<button class="cmd-scroll-preset" data-value="6" title="' + out('Apply') + '" type="button">6</button>' + '<button class="cmd-scroll-preset" data-value="7" title="' + out('Apply') + '" type="button">7</button>' + '<button class="cmd-scroll-preset" data-value="8" title="' + out('Apply') + '" type="button">8</button>' + '<button class="cmd-scroll-preset" data-value="9" title="' + out('Apply') + '" type="button">9</button>' + '<button class="cmd-scroll-preset" data-value="10" title="' + out('Apply') + '" type="button">10</button>' + '<button class="cmd-scroll-preset" data-value="11" title="' + out('Apply') + '" type="button">11</button>' + '<button class="cmd-scroll-preset" data-value="12" title="' + out('Apply') + '" type="button">12</button>' + '<button class="cmd-scroll-preset" data-value="13" title="' + out('Apply') + '" type="button">13</button>' + '<button class="cmd-scroll-preset" data-value="14" title="' + out('Apply') + '" type="button">14</button>' + '<button class="cmd-scroll-preset" data-value="" title="' + out('Remove') + '" type="button"><svg class="is-icon-flex" style="flex:none;width:10px;height:10px;"><use xlink:href="#icon-clean"></use></svg></button>' + '</div>' + '</div>' + '</div>' + '</div>' + '</div>';
|
|
1989
|
-
html += '<div class="is-modal editmodule">' + '<div style="max-width:900px;height:570px;padding:0;box-sizing:border-box;position:relative;">' + '<div class="is-modal-bar is-draggable" style="position: absolute;top: 0;left: 0;width: 100%;z-index:1;">' + out('Module Settings') + '</div>' + '<iframe style="position: absolute;top: 0;left: 0;width:100%;height:100%;border:none;border-bottom:60px solid transparent;border-top:40px solid transparent;margin:0;box-sizing:border-box;" src="about:blank"></iframe>' + '<input id="hidModuleCode" type="hidden" />' + '<input id="hidModuleSettings" type="hidden" />' + '<button class="input-ok classic" style="height:60px;position:absolute;left:0;bottom:0;">' + out('Ok') + '</button>' + '</div>' + '</div>' + '' + '
|
|
1968
|
+
html += '<div class="is-modal editmodule">' + '<div style="max-width:900px;height:570px;padding:0;box-sizing:border-box;position:relative;">' + '<div class="is-modal-bar is-draggable" style="position: absolute;top: 0;left: 0;width: 100%;z-index:1;">' + out('Module Settings') + '</div>' + '<iframe style="position: absolute;top: 0;left: 0;width:100%;height:100%;border:none;border-bottom:60px solid transparent;border-top:40px solid transparent;margin:0;box-sizing:border-box;" src="about:blank"></iframe>' + '<input id="hidModuleCode" type="hidden" />' + '<input id="hidModuleSettings" type="hidden" />' + '<button class="input-ok classic" style="height:60px;position:absolute;left:0;bottom:0;">' + out('Ok') + '</button>' + '</div>' + '</div>' + '' + '';
|
|
1990
1969
|
dom$L.appendHtml(builderStuff, html);
|
|
1991
1970
|
let modalEditSection = builderStuff.querySelector('.is-modal.editsection');
|
|
1992
1971
|
this.modalEditSection = modalEditSection;
|
|
@@ -4374,7 +4353,7 @@ var digit$1 = /[0-9]/;
|
|
|
4374
4353
|
var dot_pattern$1 = /[^\d\.]/;
|
|
4375
4354
|
|
|
4376
4355
|
var positionable_operators$3 = (
|
|
4377
|
-
">>> === !== " +
|
|
4356
|
+
">>> === !== &&= ??= ||= " +
|
|
4378
4357
|
"<< && >= ** != == <= >> || ?? |> " +
|
|
4379
4358
|
"< / - + > : & % ? ^ | *").split(' ');
|
|
4380
4359
|
|
|
@@ -4382,7 +4361,7 @@ var positionable_operators$3 = (
|
|
|
4382
4361
|
// Also, you must update possitionable operators separately from punct
|
|
4383
4362
|
var punct$1 =
|
|
4384
4363
|
">>>= " +
|
|
4385
|
-
"... >>= <<= === >>> !== **= " +
|
|
4364
|
+
"... >>= <<= === >>> !== **= &&= ??= ||= " +
|
|
4386
4365
|
"=> ^= :: /= << <= == && -= >= >> != -- += ** || ?? ++ %= &= *= |= |> " +
|
|
4387
4366
|
"= ! ? > < : / ^ - + * & % ~ |";
|
|
4388
4367
|
|
|
@@ -4426,7 +4405,7 @@ var Tokenizer$8 = function(input_string, options) {
|
|
|
4426
4405
|
html_comment_end: pattern_reader.matching(/-->/),
|
|
4427
4406
|
include: pattern_reader.starting_with(/#include/).until_after(acorn$4.lineBreak),
|
|
4428
4407
|
shebang: pattern_reader.starting_with(/#!/).until_after(acorn$4.lineBreak),
|
|
4429
|
-
xml: pattern_reader.matching(/[\s\S]*?<(\/?)([-a-zA-Z:0-9_.]+|{[
|
|
4408
|
+
xml: pattern_reader.matching(/[\s\S]*?<(\/?)([-a-zA-Z:0-9_.]+|{[^}]+?}|!\[CDATA\[[^\]]*?\]\]|)(\s*{[^}]+?}|\s+[-a-zA-Z:0-9_.]+|\s+[-a-zA-Z:0-9_.]+\s*=\s*('[^']*'|"[^"]*"|{([^{}]|{[^}]+?})+?}))*\s*(\/?)\s*>/),
|
|
4430
4409
|
single_quote: templatable.until(/['\\\n\r\u2028\u2029]/),
|
|
4431
4410
|
double_quote: templatable.until(/["\\\n\r\u2028\u2029]/),
|
|
4432
4411
|
template_text: templatable.until(/[`\\$]/),
|
|
@@ -5028,6 +5007,7 @@ Beautifier$b.prototype.create_flags = function(flags_base, mode) {
|
|
|
5028
5007
|
in_case_statement: false, // switch(..){ INSIDE HERE }
|
|
5029
5008
|
in_case: false, // we're on the exact line with "case 0:"
|
|
5030
5009
|
case_body: false, // the indented case-action block
|
|
5010
|
+
case_block: false, // the indented case-action block is wrapped with {}
|
|
5031
5011
|
indentation_level: next_indent_level,
|
|
5032
5012
|
alignment: 0,
|
|
5033
5013
|
line_indent_level: flags_base ? flags_base.line_indent_level : next_indent_level,
|
|
@@ -5527,10 +5507,10 @@ Beautifier$b.prototype.handle_start_block = function(current_token) {
|
|
|
5527
5507
|
)) {
|
|
5528
5508
|
// We don't support TypeScript,but we didn't break it for a very long time.
|
|
5529
5509
|
// We'll try to keep not breaking it.
|
|
5530
|
-
if (
|
|
5531
|
-
this.set_mode(MODE$1.ObjectLiteral);
|
|
5532
|
-
} else {
|
|
5510
|
+
if (in_array$4(this._last_last_text, ['class', 'interface']) && !in_array$4(second_token.text, [':', ','])) {
|
|
5533
5511
|
this.set_mode(MODE$1.BlockStatement);
|
|
5512
|
+
} else {
|
|
5513
|
+
this.set_mode(MODE$1.ObjectLiteral);
|
|
5534
5514
|
}
|
|
5535
5515
|
} else if (this._flags.last_token.type === TOKEN$7.OPERATOR && this._flags.last_token.text === '=>') {
|
|
5536
5516
|
// arrow function: (param1, paramN) => { statements }
|
|
@@ -5646,7 +5626,7 @@ Beautifier$b.prototype.handle_word = function(current_token) {
|
|
|
5646
5626
|
if (current_token.type === TOKEN$7.RESERVED) {
|
|
5647
5627
|
if (in_array$4(current_token.text, ['set', 'get']) && this._flags.mode !== MODE$1.ObjectLiteral) {
|
|
5648
5628
|
current_token.type = TOKEN$7.WORD;
|
|
5649
|
-
} else if (current_token.text === 'import' && this._tokens.peek().text
|
|
5629
|
+
} else if (current_token.text === 'import' && in_array$4(this._tokens.peek().text, ['(', '.'])) {
|
|
5650
5630
|
current_token.type = TOKEN$7.WORD;
|
|
5651
5631
|
} else if (in_array$4(current_token.text, ['as', 'from']) && !this._flags.import_block) {
|
|
5652
5632
|
current_token.type = TOKEN$7.WORD;
|
|
@@ -5706,7 +5686,7 @@ Beautifier$b.prototype.handle_word = function(current_token) {
|
|
|
5706
5686
|
|
|
5707
5687
|
if (this._flags.in_case_statement && reserved_array$1(current_token, ['case', 'default'])) {
|
|
5708
5688
|
this.print_newline();
|
|
5709
|
-
if (this._flags.
|
|
5689
|
+
if (!this._flags.case_block && (this._flags.case_body || this._options.jslint_happy)) {
|
|
5710
5690
|
// switch cases following one another
|
|
5711
5691
|
this.deindent();
|
|
5712
5692
|
}
|
|
@@ -6012,7 +5992,9 @@ Beautifier$b.prototype.handle_operator = function(current_token) {
|
|
|
6012
5992
|
if (this._tokens.peek().type !== TOKEN$7.START_BLOCK) {
|
|
6013
5993
|
this.indent();
|
|
6014
5994
|
this.print_newline();
|
|
5995
|
+
this._flags.case_block = false;
|
|
6015
5996
|
} else {
|
|
5997
|
+
this._flags.case_block = true;
|
|
6016
5998
|
this._output.space_before_token = true;
|
|
6017
5999
|
}
|
|
6018
6000
|
return;
|
|
@@ -6110,7 +6092,7 @@ Beautifier$b.prototype.handle_operator = function(current_token) {
|
|
|
6110
6092
|
|
|
6111
6093
|
// http://www.ecma-international.org/ecma-262/5.1/#sec-7.9.1
|
|
6112
6094
|
// if there is a newline between -- or ++ and anything else we should preserve it.
|
|
6113
|
-
if (current_token.newlines && (current_token.text === '--' || current_token.text === '++')) {
|
|
6095
|
+
if (current_token.newlines && (current_token.text === '--' || current_token.text === '++' || current_token.text === '~')) {
|
|
6114
6096
|
this.print_newline(false, true);
|
|
6115
6097
|
}
|
|
6116
6098
|
|
|
@@ -6376,6 +6358,9 @@ function Beautifier$9(source_text, options) {
|
|
|
6376
6358
|
"@supports": true,
|
|
6377
6359
|
"@document": true
|
|
6378
6360
|
};
|
|
6361
|
+
this.NON_SEMICOLON_NEWLINE_PROPERTY = [
|
|
6362
|
+
"grid-template"
|
|
6363
|
+
];
|
|
6379
6364
|
|
|
6380
6365
|
}
|
|
6381
6366
|
|
|
@@ -6500,7 +6485,9 @@ Beautifier$9.prototype.beautify = function() {
|
|
|
6500
6485
|
var enteringConditionalGroup = false;
|
|
6501
6486
|
var insideAtExtend = false;
|
|
6502
6487
|
var insideAtImport = false;
|
|
6488
|
+
var insideScssMap = false;
|
|
6503
6489
|
var topCharacter = this._ch;
|
|
6490
|
+
var insideNonSemiColonValues = false;
|
|
6504
6491
|
var whitespace;
|
|
6505
6492
|
var isAfterSpace;
|
|
6506
6493
|
var previous_ch;
|
|
@@ -6552,7 +6539,7 @@ Beautifier$9.prototype.beautify = function() {
|
|
|
6552
6539
|
|
|
6553
6540
|
// Ensures any new lines following the comment are preserved
|
|
6554
6541
|
this.eatWhitespace(true);
|
|
6555
|
-
} else if (this._ch === '@') {
|
|
6542
|
+
} else if (this._ch === '@' || this._ch === '$') {
|
|
6556
6543
|
this.preserveSingleSpace(isAfterSpace);
|
|
6557
6544
|
|
|
6558
6545
|
// deal with less propery mixins @{...}
|
|
@@ -6623,7 +6610,12 @@ Beautifier$9.prototype.beautify = function() {
|
|
|
6623
6610
|
this.indent();
|
|
6624
6611
|
this._output.set_indent(this._indentLevel);
|
|
6625
6612
|
} else {
|
|
6626
|
-
|
|
6613
|
+
// inside mixin and first param is object
|
|
6614
|
+
if (previous_ch === '(') {
|
|
6615
|
+
this._output.space_before_token = false;
|
|
6616
|
+
} else if (previous_ch !== ',') {
|
|
6617
|
+
this.indent();
|
|
6618
|
+
}
|
|
6627
6619
|
this.print_string(this._ch);
|
|
6628
6620
|
}
|
|
6629
6621
|
|
|
@@ -6655,7 +6647,21 @@ Beautifier$9.prototype.beautify = function() {
|
|
|
6655
6647
|
this._output.add_new_line(true);
|
|
6656
6648
|
}
|
|
6657
6649
|
}
|
|
6650
|
+
if (this._input.peek() === ')') {
|
|
6651
|
+
this._output.trim(true);
|
|
6652
|
+
if (this._options.brace_style === "expand") {
|
|
6653
|
+
this._output.add_new_line(true);
|
|
6654
|
+
}
|
|
6655
|
+
}
|
|
6658
6656
|
} else if (this._ch === ":") {
|
|
6657
|
+
|
|
6658
|
+
for (var i = 0; i < this.NON_SEMICOLON_NEWLINE_PROPERTY.length; i++) {
|
|
6659
|
+
if (this._input.lookBack(this.NON_SEMICOLON_NEWLINE_PROPERTY[i])) {
|
|
6660
|
+
insideNonSemiColonValues = true;
|
|
6661
|
+
break;
|
|
6662
|
+
}
|
|
6663
|
+
}
|
|
6664
|
+
|
|
6659
6665
|
if ((insideRule || enteringConditionalGroup) && !(this._input.lookBack("&") || this.foundNestedPseudoClass()) && !this._input.lookBack("(") && !insideAtExtend && parenLevel === 0) {
|
|
6660
6666
|
// 'property: value' delimiter
|
|
6661
6667
|
// which could be in a conditional group query
|
|
@@ -6688,6 +6694,7 @@ Beautifier$9.prototype.beautify = function() {
|
|
|
6688
6694
|
this.print_string(this._ch + this.eatString(this._ch));
|
|
6689
6695
|
this.eatWhitespace(true);
|
|
6690
6696
|
} else if (this._ch === ';') {
|
|
6697
|
+
insideNonSemiColonValues = false;
|
|
6691
6698
|
if (parenLevel === 0) {
|
|
6692
6699
|
if (insidePropertyValue) {
|
|
6693
6700
|
this.outdent();
|
|
@@ -6729,20 +6736,32 @@ Beautifier$9.prototype.beautify = function() {
|
|
|
6729
6736
|
} else {
|
|
6730
6737
|
this.preserveSingleSpace(isAfterSpace);
|
|
6731
6738
|
this.print_string(this._ch);
|
|
6732
|
-
|
|
6733
|
-
|
|
6734
|
-
this.
|
|
6739
|
+
|
|
6740
|
+
// handle scss/sass map
|
|
6741
|
+
if (insidePropertyValue && previous_ch === "$" && this._options.selector_separator_newline) {
|
|
6742
|
+
this._output.add_new_line();
|
|
6743
|
+
insideScssMap = true;
|
|
6744
|
+
} else {
|
|
6745
|
+
this.eatWhitespace();
|
|
6746
|
+
parenLevel++;
|
|
6747
|
+
this.indent();
|
|
6748
|
+
}
|
|
6735
6749
|
}
|
|
6736
6750
|
} else if (this._ch === ')') {
|
|
6737
6751
|
if (parenLevel) {
|
|
6738
6752
|
parenLevel--;
|
|
6739
6753
|
this.outdent();
|
|
6740
6754
|
}
|
|
6755
|
+
if (insideScssMap && this._input.peek() === ";" && this._options.selector_separator_newline) {
|
|
6756
|
+
insideScssMap = false;
|
|
6757
|
+
this.outdent();
|
|
6758
|
+
this._output.add_new_line();
|
|
6759
|
+
}
|
|
6741
6760
|
this.print_string(this._ch);
|
|
6742
6761
|
} else if (this._ch === ',') {
|
|
6743
6762
|
this.print_string(this._ch);
|
|
6744
6763
|
this.eatWhitespace(true);
|
|
6745
|
-
if (this._options.selector_separator_newline && !insidePropertyValue && parenLevel === 0 && !insideAtImport && !insideAtExtend) {
|
|
6764
|
+
if (this._options.selector_separator_newline && (!insidePropertyValue || insideScssMap) && parenLevel === 0 && !insideAtImport && !insideAtExtend) {
|
|
6746
6765
|
this._output.add_new_line();
|
|
6747
6766
|
} else {
|
|
6748
6767
|
this._output.space_before_token = true;
|
|
@@ -6776,8 +6795,13 @@ Beautifier$9.prototype.beautify = function() {
|
|
|
6776
6795
|
this.print_string(' ');
|
|
6777
6796
|
this.print_string(this._ch);
|
|
6778
6797
|
} else {
|
|
6779
|
-
|
|
6798
|
+
var preserveAfterSpace = previous_ch === '"' || previous_ch === '\'';
|
|
6799
|
+
this.preserveSingleSpace(preserveAfterSpace || isAfterSpace);
|
|
6780
6800
|
this.print_string(this._ch);
|
|
6801
|
+
|
|
6802
|
+
if (!this._output.just_added_newline() && this._input.peek() === '\n' && insideNonSemiColonValues) {
|
|
6803
|
+
this._output.add_new_line();
|
|
6804
|
+
}
|
|
6781
6805
|
}
|
|
6782
6806
|
}
|
|
6783
6807
|
|
|
@@ -7766,7 +7790,7 @@ var TagOpenParserToken$1 = function(parent, raw_token) {
|
|
|
7766
7790
|
|
|
7767
7791
|
// handle "{{#> myPartial}}
|
|
7768
7792
|
if (raw_token.text === '{{#>' && this.tag_check === '>' && raw_token.next !== null) {
|
|
7769
|
-
this.tag_check = raw_token.next.text;
|
|
7793
|
+
this.tag_check = raw_token.next.text.split(' ')[0];
|
|
7770
7794
|
}
|
|
7771
7795
|
}
|
|
7772
7796
|
this.tag_check = this.tag_check.toLowerCase();
|
|
@@ -8110,7 +8134,7 @@ class EditBox {
|
|
|
8110
8134
|
this.builderStuff = this.builder.builderStuff;
|
|
8111
8135
|
const builderStuff = this.builderStuff;
|
|
8112
8136
|
let html = '' + '<div id="divBoxTool">' + '<form id="form-upload-cover" data-tooltip-top data-title="' + out('Background Image') + '" target="frame-upload-cover" method="post" action="' + this.builder.coverImageHandler + '" enctype="multipart/form-data" style="position:relative;width:40px;height:40px;display:inline-block;float:left;background: rgb(90, 156, 38);">' + '<div style="width:40px;height:40px;overflow:hidden;">' + '<div style="position:absolute;width:100%;height:100%;"><svg class="is-icon-flex" style="position: absolute;top: 12px;left: 12px;fill:rgb(255,255,255);"><use xlink:href="#ion-image"></use></svg></div>' + '<input type="file" title="' + out('Background Image') + '" id="fileCover" name="fileCover" accept="image/*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;"/>' + '</div>' + '<input id="hidcustomval" name="hidcustomval" type="hidden" value="" />' + '<iframe id="frame-upload-cover" name="frame-upload-cover" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>' + '</form>' + '<button id="btnEditBox" data-tooltip-top data-title="' + out('Box Settings') + '" title="' + out('Box Settings') + '"><svg class="is-icon-flex"><use xlink:href="#ion-wrench"></use></svg></button>' + '<button id="btnEditModule" data-tooltip-top data-title="' + out('Module Settings') + '" title="' + out('Module Settings') + '"><svg class="is-icon-flex"><use xlink:href="#ion-ios-gear"></use></svg></button>' + '</div>' + '' + '<div class="is-modal editmodule">' + '<div style="max-width:900px;height:570px;padding:0;box-sizing:border-box;position:relative;">' + '<div class="is-modal-bar is-draggable" style="position: absolute;top: 0;left: 0;width: 100%;z-index:1;">' + out('Module Settings') + '</div>' + '<iframe style="position: absolute;top: 0;left: 0;width:100%;height:100%;border:none;border-bottom:60px solid transparent;border-top:40px solid transparent;margin:0;box-sizing:border-box;" src="about:blank"></iframe>' + '<input id="hidModuleCode" type="hidden" />' + '<input id="hidModuleSettings" type="hidden" />' + '<button class="input-ok classic" style="height:60px;position:absolute;left:0;bottom:0;">' + out('Ok') + '</button>' + '</div>' + '</div>';
|
|
8113
|
-
html += '<div class="is-modal editcustomcode">' + '<div style="max-width:900px;height:570px;padding:0;box-sizing:border-box;position:relative;">' + '<div class="is-modal-bar is-draggable" style="position: absolute;top: 0;left: 0;width: 100%;z-index:1;">' + out('Custom Code (Javascript Allowed)') + '</div>' + '<textarea id="txtBoxCustomCode" class="inptxt" style="background: #fff;position: absolute;top: 0;left: 0;width:100%;height:100%;border:none;border-bottom:60px solid transparent;border-top:40px solid transparent;box-sizing:border-box;"></textarea>' + '<input id="hidBoxCustomCode" type="hidden" />' + '<button class="
|
|
8137
|
+
html += '<div class="is-modal editcustomcode">' + '<div style="max-width:900px;height:570px;padding:0;box-sizing:border-box;position:relative;">' + '<div class="is-modal-bar is-draggable" style="position: absolute;top: 0;left: 0;width: 100%;z-index:1;">' + out('Custom Code (Javascript Allowed)') + '</div>' + '<textarea id="txtBoxCustomCode" class="inptxt" style="background: #fff;position: absolute;top: 0;left: 0;width:100%;height:100%;border:none;border-bottom:60px solid transparent;border-top:40px solid transparent;box-sizing:border-box;"></textarea>' + '<input id="hidBoxCustomCode" type="hidden" />' + '<button class="input-ok classic" style="height:60px;position:absolute;left:0;bottom:0;">' + out('Ok') + '</button>' + '</div>' + '</div>' + '<div class="is-modal editbox">' + '<div class="is-modal-content" style="max-width:380px;min-height:300px;padding:0">' + '<div class="is-modal-bar is-draggable">' + out('Box Settings') + '</div>' + '<div class="is-tabs clearfix" style="padding-top:37px;">' + '<a id="tabBoxGeneral" href="" data-content="divBoxGeneral" class="active">' + out('General') + '</a>' + '<a id="tabBoxContentContainer" href="" data-content="divBoxContentContainer">' + out('Content') + '</a>' + '<a id="tabBoxContentText" href="" data-content="divBoxContentText">' + out('Text') + '</a>' + '<a id="tabBoxImage" href="" data-content="divBoxImage">' + out('Image') + '</a>' + '<a id="tabBoxAnimate" href="" data-content="divBoxAnimate">' + out('Animate') + '</a>' + '<a id="tabBoxClick" href="" data-content="divBoxClick">' + out('On Click') + '</a>' + '</div>' + '<div id="divBoxGeneral" class="is-tab-content" data-group="boxsettings" style="display:flex;padding-top:0">' + '<div id="divBoxSize">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Box Size') + ':</div>' + '<div style="display:flex">' + '<button title="' + out('Decrease') + '" class="cmd-box-smaller" style="width:40px;">-</button>' + '<button title="' + out('Increase') + '" class="cmd-box-larger" style="width:40px;border-left:none">+</button>' + '<br style="clear:both">' + '</div>' + '</div>';
|
|
8114
8138
|
html += '<div id="divContentSize">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Content Size') + ': <span class="val-box-size" style="font-size:12px"></span></div>' + '<div style="display: flex;flex-direction: row;flex-wrap: wrap;">' + '<input class="inp-box-size" type="text" style="display:none;width:80px;height:35px;text-align:center;font-size:12px;" />' + '<button class="cmd-box-size" data-value="500" style="width:40px;border-left:none">500</button>' + '<button class="cmd-box-size" data-value="600" style="width:40px;border-left:none">600</button>' + '<button class="cmd-box-size" data-value="700" style="width:40px;border-left:none">700</button>' + '<button class="cmd-box-size" data-value="800" style="width:40px;border-top:none">800</button>' + '<button class="cmd-box-size" data-value="900" style="width:40px;border-top:none">900</button>' + '<button class="cmd-box-size" data-value="1000" style="width:40px;border-top:none;border-left:none">1000</button>' + '<button class="cmd-box-size" data-value="1100" style="width:40px;border-top:none;border-left:none">1100</button>' + '<button class="cmd-box-size" data-value="1200" style="width:40px;border-top:none;border-left:none">1200</button>' + '<button class="cmd-box-size" data-value="1300" style="width:40px;border-top:none;border-left:none">1300</button>' + '<button class="cmd-box-size" data-value="1400" style="width:40px;border-top:none;border-left:none">1400</button>' + '<button class="cmd-box-size" data-value="1500" style="width:40px;border-top:none;border-left:none">1500</button>' + '<button class="cmd-box-size" data-value="1600" style="width:40px;border-top:none;border-left:none">1600</button>' + '<button class="cmd-box-size" data-value="1800" style="width:40px;border-top:none;border-left:none">1800</button>' + '<button title="' + out('Clear') + '" class="cmd-box-size" data-value=""><svg class="is-icon-flex" style="width:10px;height:10px;"><use xlink:href="#icon-clean"></use></svg></button>' + '<button title="' + out('Decrease') + '" class="cmd-box-size" data-value="-" style="width:40px;border-top:none;border-left:none">-</button>' + '<button title="' + out('Increase') + '"class="cmd-box-size" data-value="+" style="width:40px;border-top:none;border-left:none">+</button>' + '<br style="clear:both">' + '</div>' + '</div>';
|
|
8115
8139
|
html += '<div id="divBoxBackgroundColor">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Background Color') + ':</div>' + '<div style="display:flex;">' + '<button title="' + out('Background Color') + '" class="input-box-bgcolor is-btn-color" style="margin-right:15px"></button>' + '<button title="' + out('Gradient') + '" class="input-box-gradient classic" data-value="+">' + out('Gradient') + '</button>' + '</div>' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Background Image') + ':</div>' + '<div style="height:auto">' + '<div style="display:flex;align-items:flex-end;">' + '<div class="box-bgimage-preview"></div>' + '<label class="label-box-bgimage-grayscale label-checkbox" for="chkBoxBgImageGrayscale" style="margin:0;margin-left:8px;margin-bottom:5px;"><input id="chkBoxBgImageGrayscale" class="chk-box-bgimage-grayscale" type="checkbox" /> ' + out('Grayscale') + '</label>' + '</div>' + '<div style="display:flex;align-items: flex-end;">' + '<button title="' + out('Image') + '" class="input-box-bgimage">' + '<svg class="is-icon-flex"><use xlink:href="#ion-image"></use></svg>' + '<span>' + out('Image') + '</span>' + '</button>' + '<button title="' + out('Remove') + '" class="input-box-bgremove"><svg class="is-icon-flex" style="width:11px;height:11px;"><use xlink:href="#icon-clean"></use></svg></button>' + '<button title="' + out('Adjust') + '" class="input-box-bgimageadjust"><svg class="is-icon-flex"><use xlink:href="#ion-wrench"></use></svg></button>' + '</div>' + '</div>' + '</div>' + '<div id="divBoxPickPhoto" class="is-settings" style="padding-top:20px">' + '<button class="cmd-box-pickphoto" data-value="" style="width:100%"><svg class="is-icon-flex" style=""><use xlink:href="#ion-image"></use></svg></button>' + '</div>' + '<div style="display:flex;justify-content:flex-end;">' + '<button title="' + out('Add Text') + '" class="cmd-box-addtext" style="display:none;margin-top:20px;"><svg class="is-icon-flex" style="width:11px;height:11px;"><use xlink:href="#ion-android-add"></use></svg> <span>' + out('Text') + '</span></button>' + '<button title="' + out('Remove Text') + '" class="cmd-box-removetext" style="display:none;margin-top:20px;"><svg class="is-icon-flex" style="width:11px;height:11px;"><use xlink:href="#icon-clean"></use></svg> <span>' + out('Clear') + '</span></button>' + '</div>' + '<p id="divNoBoxSettings" style="text-align: center;display:none;">' + out('This box has no available settings.') + '</p>' + '</div>';
|
|
8116
8140
|
html += '<div id="divBoxClick" class="is-tab-content" data-group="boxsettings" style="padding-top:0">' + '<label for="inpBoxLinkSource" style="display:block;padding-top:20px;">' + out('Open') + ':</label>' + '<div class="image-src" style="display:flex">' + '<input id="inpBoxLinkSource" class="input-src" type="text" style="height:38px">' + '<button title="' + out('Select') + '" class="input-select" style="flex:none;width:40px;height:38px;background:transparent;"><svg class="is-icon-flex"><use xlink:href="#ion-more"></use></svg></button>' + '<div class="image-larger5" style="position: relative; flex: 0 0 auto; width: 40px; height: 38px; box-shadow: rgba(0, 0, 0, 0.32) 0px 3px 6px -6px;">' + '<form class="form-upload-larger" target="frameTargetBoxLinkUpload" method="post" action="' + this.builder.largerImageHandler + '" enctype="multipart/form-data" style="position:absolute;top:0;left:0;width:100%;height:100%;">' + '<input id="hidRefId5" name="hidRefId" type="hidden" value="">' + '<svg class="is-icon-flex" style="position: absolute;top: 10px;left: 15px;"><use xlink:href="#ion-image"></use></svg>' + '<input title="' + out('Select') + '" id="fileImage5" name="fileImage" type="file" accept="image/*,video/mp4" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">' + '</form>' + '<iframe id="frameTargetBoxLinkUpload" name="frameTargetBoxLinkUpload" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>' + '</div>' + '</div>' + '<div style="padding-top:20px">' + '<button class="cmd-box-testclick">' + out('Test') + '</button>' + '</div>' + '</div>';
|
|
@@ -9415,26 +9439,6 @@ class EditBox {
|
|
|
9415
9439
|
this.builder.settings.onChange();
|
|
9416
9440
|
this.builder.hideModal(modalEditCode); // dom.removeClass(activeBox, 'box-active'); //REVIEW
|
|
9417
9441
|
});
|
|
9418
|
-
const btnOpenLarger = builderStuff.querySelector('.editcustomcode .cell-html-larger');
|
|
9419
|
-
btnOpenLarger.addEventListener('click', () => {
|
|
9420
|
-
let elms = builderStuff.querySelectorAll('[data-source-active]');
|
|
9421
|
-
elms.forEach(elm => {
|
|
9422
|
-
elm.removeAttribute('data-source-active');
|
|
9423
|
-
});
|
|
9424
|
-
elms = builderStuff.querySelectorAll('[data-source-ok]');
|
|
9425
|
-
elms.forEach(elm => {
|
|
9426
|
-
elm.removeAttribute('data-source-ok');
|
|
9427
|
-
});
|
|
9428
|
-
elms = builderStuff.querySelectorAll('[data-source-cancel]');
|
|
9429
|
-
elms.forEach(elm => {
|
|
9430
|
-
elm.removeAttribute('data-source-cancel');
|
|
9431
|
-
});
|
|
9432
|
-
let textarea = builderStuff.querySelector('.editcustomcode textarea');
|
|
9433
|
-
textarea.setAttribute('data-source-active', '1');
|
|
9434
|
-
textarea.setAttribute('data-source-ok', '.editcustomcode .input-ok');
|
|
9435
|
-
textarea.setAttribute('data-source-cancel', '.editcustomcode');
|
|
9436
|
-
this.builder.editor.viewHtmlLarger();
|
|
9437
|
-
});
|
|
9438
9442
|
const btnModuleOk = modalEditModule.querySelector('.input-ok');
|
|
9439
9443
|
btnModuleOk.addEventListener('click', () => {
|
|
9440
9444
|
let activeBox = this.builder.activeBox;
|
|
@@ -14706,6 +14710,10 @@ class Util {
|
|
|
14706
14710
|
return document.querySelector('.cell-active');
|
|
14707
14711
|
}
|
|
14708
14712
|
|
|
14713
|
+
rowSelected() {
|
|
14714
|
+
return document.querySelector('.row-active');
|
|
14715
|
+
}
|
|
14716
|
+
|
|
14709
14717
|
builderStuff() {
|
|
14710
14718
|
return document.querySelector('#_cbhtml');
|
|
14711
14719
|
}
|
|
@@ -23818,6 +23826,633 @@ function get_beautify(js_beautify, css_beautify, html_beautify) {
|
|
|
23818
23826
|
|
|
23819
23827
|
var JsBeautify = js$1.exports;
|
|
23820
23828
|
|
|
23829
|
+
function _defineProperty$3(obj, key, value) {
|
|
23830
|
+
if (key in obj) {
|
|
23831
|
+
Object.defineProperty(obj, key, {
|
|
23832
|
+
value: value,
|
|
23833
|
+
enumerable: true,
|
|
23834
|
+
configurable: true,
|
|
23835
|
+
writable: true
|
|
23836
|
+
});
|
|
23837
|
+
} else {
|
|
23838
|
+
obj[key] = value;
|
|
23839
|
+
}
|
|
23840
|
+
|
|
23841
|
+
return obj;
|
|
23842
|
+
}
|
|
23843
|
+
|
|
23844
|
+
function ownKeys$3(object, enumerableOnly) {
|
|
23845
|
+
var keys = Object.keys(object);
|
|
23846
|
+
|
|
23847
|
+
if (Object.getOwnPropertySymbols) {
|
|
23848
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
23849
|
+
if (enumerableOnly) symbols = symbols.filter(function (sym) {
|
|
23850
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
23851
|
+
});
|
|
23852
|
+
keys.push.apply(keys, symbols);
|
|
23853
|
+
}
|
|
23854
|
+
|
|
23855
|
+
return keys;
|
|
23856
|
+
}
|
|
23857
|
+
|
|
23858
|
+
function _objectSpread2$3(target) {
|
|
23859
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
23860
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
23861
|
+
|
|
23862
|
+
if (i % 2) {
|
|
23863
|
+
ownKeys$3(Object(source), true).forEach(function (key) {
|
|
23864
|
+
_defineProperty$3(target, key, source[key]);
|
|
23865
|
+
});
|
|
23866
|
+
} else if (Object.getOwnPropertyDescriptors) {
|
|
23867
|
+
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
23868
|
+
} else {
|
|
23869
|
+
ownKeys$3(Object(source)).forEach(function (key) {
|
|
23870
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
23871
|
+
});
|
|
23872
|
+
}
|
|
23873
|
+
}
|
|
23874
|
+
|
|
23875
|
+
return target;
|
|
23876
|
+
}
|
|
23877
|
+
|
|
23878
|
+
function _objectWithoutPropertiesLoose$1(source, excluded) {
|
|
23879
|
+
if (source == null) return {};
|
|
23880
|
+
var target = {};
|
|
23881
|
+
var sourceKeys = Object.keys(source);
|
|
23882
|
+
var key, i;
|
|
23883
|
+
|
|
23884
|
+
for (i = 0; i < sourceKeys.length; i++) {
|
|
23885
|
+
key = sourceKeys[i];
|
|
23886
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
23887
|
+
target[key] = source[key];
|
|
23888
|
+
}
|
|
23889
|
+
|
|
23890
|
+
return target;
|
|
23891
|
+
}
|
|
23892
|
+
|
|
23893
|
+
function _objectWithoutProperties$1(source, excluded) {
|
|
23894
|
+
if (source == null) return {};
|
|
23895
|
+
|
|
23896
|
+
var target = _objectWithoutPropertiesLoose$1(source, excluded);
|
|
23897
|
+
|
|
23898
|
+
var key, i;
|
|
23899
|
+
|
|
23900
|
+
if (Object.getOwnPropertySymbols) {
|
|
23901
|
+
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
23902
|
+
|
|
23903
|
+
for (i = 0; i < sourceSymbolKeys.length; i++) {
|
|
23904
|
+
key = sourceSymbolKeys[i];
|
|
23905
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
23906
|
+
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
23907
|
+
target[key] = source[key];
|
|
23908
|
+
}
|
|
23909
|
+
}
|
|
23910
|
+
|
|
23911
|
+
return target;
|
|
23912
|
+
}
|
|
23913
|
+
|
|
23914
|
+
function _slicedToArray(arr, i) {
|
|
23915
|
+
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$1(arr, i) || _nonIterableRest();
|
|
23916
|
+
}
|
|
23917
|
+
|
|
23918
|
+
function _arrayWithHoles(arr) {
|
|
23919
|
+
if (Array.isArray(arr)) return arr;
|
|
23920
|
+
}
|
|
23921
|
+
|
|
23922
|
+
function _iterableToArrayLimit(arr, i) {
|
|
23923
|
+
if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
|
|
23924
|
+
var _arr = [];
|
|
23925
|
+
var _n = true;
|
|
23926
|
+
var _d = false;
|
|
23927
|
+
var _e = undefined;
|
|
23928
|
+
|
|
23929
|
+
try {
|
|
23930
|
+
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
|
|
23931
|
+
_arr.push(_s.value);
|
|
23932
|
+
|
|
23933
|
+
if (i && _arr.length === i) break;
|
|
23934
|
+
}
|
|
23935
|
+
} catch (err) {
|
|
23936
|
+
_d = true;
|
|
23937
|
+
_e = err;
|
|
23938
|
+
} finally {
|
|
23939
|
+
try {
|
|
23940
|
+
if (!_n && _i["return"] != null) _i["return"]();
|
|
23941
|
+
} finally {
|
|
23942
|
+
if (_d) throw _e;
|
|
23943
|
+
}
|
|
23944
|
+
}
|
|
23945
|
+
|
|
23946
|
+
return _arr;
|
|
23947
|
+
}
|
|
23948
|
+
|
|
23949
|
+
function _unsupportedIterableToArray$1(o, minLen) {
|
|
23950
|
+
if (!o) return;
|
|
23951
|
+
if (typeof o === "string") return _arrayLikeToArray$1(o, minLen);
|
|
23952
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
23953
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
23954
|
+
if (n === "Map" || n === "Set") return Array.from(o);
|
|
23955
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$1(o, minLen);
|
|
23956
|
+
}
|
|
23957
|
+
|
|
23958
|
+
function _arrayLikeToArray$1(arr, len) {
|
|
23959
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
23960
|
+
|
|
23961
|
+
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
|
|
23962
|
+
|
|
23963
|
+
return arr2;
|
|
23964
|
+
}
|
|
23965
|
+
|
|
23966
|
+
function _nonIterableRest() {
|
|
23967
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
23968
|
+
}
|
|
23969
|
+
|
|
23970
|
+
function _defineProperty$2(obj, key, value) {
|
|
23971
|
+
if (key in obj) {
|
|
23972
|
+
Object.defineProperty(obj, key, {
|
|
23973
|
+
value: value,
|
|
23974
|
+
enumerable: true,
|
|
23975
|
+
configurable: true,
|
|
23976
|
+
writable: true
|
|
23977
|
+
});
|
|
23978
|
+
} else {
|
|
23979
|
+
obj[key] = value;
|
|
23980
|
+
}
|
|
23981
|
+
|
|
23982
|
+
return obj;
|
|
23983
|
+
}
|
|
23984
|
+
|
|
23985
|
+
function ownKeys$2(object, enumerableOnly) {
|
|
23986
|
+
var keys = Object.keys(object);
|
|
23987
|
+
|
|
23988
|
+
if (Object.getOwnPropertySymbols) {
|
|
23989
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
23990
|
+
if (enumerableOnly) symbols = symbols.filter(function (sym) {
|
|
23991
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
23992
|
+
});
|
|
23993
|
+
keys.push.apply(keys, symbols);
|
|
23994
|
+
}
|
|
23995
|
+
|
|
23996
|
+
return keys;
|
|
23997
|
+
}
|
|
23998
|
+
|
|
23999
|
+
function _objectSpread2$2(target) {
|
|
24000
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
24001
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
24002
|
+
|
|
24003
|
+
if (i % 2) {
|
|
24004
|
+
ownKeys$2(Object(source), true).forEach(function (key) {
|
|
24005
|
+
_defineProperty$2(target, key, source[key]);
|
|
24006
|
+
});
|
|
24007
|
+
} else if (Object.getOwnPropertyDescriptors) {
|
|
24008
|
+
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
24009
|
+
} else {
|
|
24010
|
+
ownKeys$2(Object(source)).forEach(function (key) {
|
|
24011
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
24012
|
+
});
|
|
24013
|
+
}
|
|
24014
|
+
}
|
|
24015
|
+
|
|
24016
|
+
return target;
|
|
24017
|
+
}
|
|
24018
|
+
|
|
24019
|
+
function compose$1() {
|
|
24020
|
+
for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
24021
|
+
fns[_key] = arguments[_key];
|
|
24022
|
+
}
|
|
24023
|
+
|
|
24024
|
+
return function (x) {
|
|
24025
|
+
return fns.reduceRight(function (y, f) {
|
|
24026
|
+
return f(y);
|
|
24027
|
+
}, x);
|
|
24028
|
+
};
|
|
24029
|
+
}
|
|
24030
|
+
|
|
24031
|
+
function curry$1(fn) {
|
|
24032
|
+
return function curried() {
|
|
24033
|
+
var _this = this;
|
|
24034
|
+
|
|
24035
|
+
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
24036
|
+
args[_key2] = arguments[_key2];
|
|
24037
|
+
}
|
|
24038
|
+
|
|
24039
|
+
return args.length >= fn.length ? fn.apply(this, args) : function () {
|
|
24040
|
+
for (var _len3 = arguments.length, nextArgs = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
|
|
24041
|
+
nextArgs[_key3] = arguments[_key3];
|
|
24042
|
+
}
|
|
24043
|
+
|
|
24044
|
+
return curried.apply(_this, [].concat(args, nextArgs));
|
|
24045
|
+
};
|
|
24046
|
+
};
|
|
24047
|
+
}
|
|
24048
|
+
|
|
24049
|
+
function isObject$3(value) {
|
|
24050
|
+
return {}.toString.call(value).includes('Object');
|
|
24051
|
+
}
|
|
24052
|
+
|
|
24053
|
+
function isEmpty(obj) {
|
|
24054
|
+
return !Object.keys(obj).length;
|
|
24055
|
+
}
|
|
24056
|
+
|
|
24057
|
+
function isFunction$2(value) {
|
|
24058
|
+
return typeof value === 'function';
|
|
24059
|
+
}
|
|
24060
|
+
|
|
24061
|
+
function hasOwnProperty$1(object, property) {
|
|
24062
|
+
return Object.prototype.hasOwnProperty.call(object, property);
|
|
24063
|
+
}
|
|
24064
|
+
|
|
24065
|
+
function validateChanges(initial, changes) {
|
|
24066
|
+
if (!isObject$3(changes)) errorHandler$1('changeType');
|
|
24067
|
+
if (Object.keys(changes).some(function (field) {
|
|
24068
|
+
return !hasOwnProperty$1(initial, field);
|
|
24069
|
+
})) errorHandler$1('changeField');
|
|
24070
|
+
return changes;
|
|
24071
|
+
}
|
|
24072
|
+
|
|
24073
|
+
function validateSelector(selector) {
|
|
24074
|
+
if (!isFunction$2(selector)) errorHandler$1('selectorType');
|
|
24075
|
+
}
|
|
24076
|
+
|
|
24077
|
+
function validateHandler(handler) {
|
|
24078
|
+
if (!(isFunction$2(handler) || isObject$3(handler))) errorHandler$1('handlerType');
|
|
24079
|
+
if (isObject$3(handler) && Object.values(handler).some(function (_handler) {
|
|
24080
|
+
return !isFunction$2(_handler);
|
|
24081
|
+
})) errorHandler$1('handlersType');
|
|
24082
|
+
}
|
|
24083
|
+
|
|
24084
|
+
function validateInitial(initial) {
|
|
24085
|
+
if (!initial) errorHandler$1('initialIsRequired');
|
|
24086
|
+
if (!isObject$3(initial)) errorHandler$1('initialType');
|
|
24087
|
+
if (isEmpty(initial)) errorHandler$1('initialContent');
|
|
24088
|
+
}
|
|
24089
|
+
|
|
24090
|
+
function throwError$1(errorMessages, type) {
|
|
24091
|
+
throw new Error(errorMessages[type] || errorMessages["default"]);
|
|
24092
|
+
}
|
|
24093
|
+
|
|
24094
|
+
var errorMessages$1 = {
|
|
24095
|
+
initialIsRequired: 'initial state is required',
|
|
24096
|
+
initialType: 'initial state should be an object',
|
|
24097
|
+
initialContent: 'initial state shouldn\'t be an empty object',
|
|
24098
|
+
handlerType: 'handler should be an object or a function',
|
|
24099
|
+
handlersType: 'all handlers should be a functions',
|
|
24100
|
+
selectorType: 'selector should be a function',
|
|
24101
|
+
changeType: 'provided value of changes should be an object',
|
|
24102
|
+
changeField: 'it seams you want to change a field in the state which is not specified in the "initial" state',
|
|
24103
|
+
"default": 'an unknown error accured in `state-local` package'
|
|
24104
|
+
};
|
|
24105
|
+
var errorHandler$1 = curry$1(throwError$1)(errorMessages$1);
|
|
24106
|
+
var validators$1 = {
|
|
24107
|
+
changes: validateChanges,
|
|
24108
|
+
selector: validateSelector,
|
|
24109
|
+
handler: validateHandler,
|
|
24110
|
+
initial: validateInitial
|
|
24111
|
+
};
|
|
24112
|
+
|
|
24113
|
+
function create(initial) {
|
|
24114
|
+
var handler = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
24115
|
+
validators$1.initial(initial);
|
|
24116
|
+
validators$1.handler(handler);
|
|
24117
|
+
var state = {
|
|
24118
|
+
current: initial
|
|
24119
|
+
};
|
|
24120
|
+
var didUpdate = curry$1(didStateUpdate)(state, handler);
|
|
24121
|
+
var update = curry$1(updateState)(state);
|
|
24122
|
+
var validate = curry$1(validators$1.changes)(initial);
|
|
24123
|
+
var getChanges = curry$1(extractChanges)(state);
|
|
24124
|
+
|
|
24125
|
+
function getState() {
|
|
24126
|
+
var selector = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (state) {
|
|
24127
|
+
return state;
|
|
24128
|
+
};
|
|
24129
|
+
validators$1.selector(selector);
|
|
24130
|
+
return selector(state.current);
|
|
24131
|
+
}
|
|
24132
|
+
|
|
24133
|
+
function setState(causedChanges) {
|
|
24134
|
+
compose$1(didUpdate, update, validate, getChanges)(causedChanges);
|
|
24135
|
+
}
|
|
24136
|
+
|
|
24137
|
+
return [getState, setState];
|
|
24138
|
+
}
|
|
24139
|
+
|
|
24140
|
+
function extractChanges(state, causedChanges) {
|
|
24141
|
+
return isFunction$2(causedChanges) ? causedChanges(state.current) : causedChanges;
|
|
24142
|
+
}
|
|
24143
|
+
|
|
24144
|
+
function updateState(state, changes) {
|
|
24145
|
+
state.current = _objectSpread2$2(_objectSpread2$2({}, state.current), changes);
|
|
24146
|
+
return changes;
|
|
24147
|
+
}
|
|
24148
|
+
|
|
24149
|
+
function didStateUpdate(state, handler, changes) {
|
|
24150
|
+
isFunction$2(handler) ? handler(state.current) : Object.keys(changes).forEach(function (field) {
|
|
24151
|
+
var _handler$field;
|
|
24152
|
+
|
|
24153
|
+
return (_handler$field = handler[field]) === null || _handler$field === void 0 ? void 0 : _handler$field.call(handler, state.current[field]);
|
|
24154
|
+
});
|
|
24155
|
+
return changes;
|
|
24156
|
+
}
|
|
24157
|
+
|
|
24158
|
+
var index$1 = {
|
|
24159
|
+
create: create
|
|
24160
|
+
};
|
|
24161
|
+
|
|
24162
|
+
var config$1 = {
|
|
24163
|
+
paths: {
|
|
24164
|
+
vs: 'https://cdn.jsdelivr.net/npm/monaco-editor@0.33.0/min/vs'
|
|
24165
|
+
}
|
|
24166
|
+
};
|
|
24167
|
+
|
|
24168
|
+
function curry(fn) {
|
|
24169
|
+
return function curried() {
|
|
24170
|
+
var _this = this;
|
|
24171
|
+
|
|
24172
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
24173
|
+
args[_key] = arguments[_key];
|
|
24174
|
+
}
|
|
24175
|
+
|
|
24176
|
+
return args.length >= fn.length ? fn.apply(this, args) : function () {
|
|
24177
|
+
for (var _len2 = arguments.length, nextArgs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
24178
|
+
nextArgs[_key2] = arguments[_key2];
|
|
24179
|
+
}
|
|
24180
|
+
|
|
24181
|
+
return curried.apply(_this, [].concat(args, nextArgs));
|
|
24182
|
+
};
|
|
24183
|
+
};
|
|
24184
|
+
}
|
|
24185
|
+
|
|
24186
|
+
function isObject$2(value) {
|
|
24187
|
+
return {}.toString.call(value).includes('Object');
|
|
24188
|
+
}
|
|
24189
|
+
|
|
24190
|
+
/**
|
|
24191
|
+
* validates the configuration object and informs about deprecation
|
|
24192
|
+
* @param {Object} config - the configuration object
|
|
24193
|
+
* @return {Object} config - the validated configuration object
|
|
24194
|
+
*/
|
|
24195
|
+
|
|
24196
|
+
function validateConfig(config) {
|
|
24197
|
+
if (!config) errorHandler('configIsRequired');
|
|
24198
|
+
if (!isObject$2(config)) errorHandler('configType');
|
|
24199
|
+
|
|
24200
|
+
if (config.urls) {
|
|
24201
|
+
informAboutDeprecation();
|
|
24202
|
+
return {
|
|
24203
|
+
paths: {
|
|
24204
|
+
vs: config.urls.monacoBase
|
|
24205
|
+
}
|
|
24206
|
+
};
|
|
24207
|
+
}
|
|
24208
|
+
|
|
24209
|
+
return config;
|
|
24210
|
+
}
|
|
24211
|
+
/**
|
|
24212
|
+
* logs deprecation message
|
|
24213
|
+
*/
|
|
24214
|
+
|
|
24215
|
+
|
|
24216
|
+
function informAboutDeprecation() {
|
|
24217
|
+
console.warn(errorMessages.deprecation);
|
|
24218
|
+
}
|
|
24219
|
+
|
|
24220
|
+
function throwError(errorMessages, type) {
|
|
24221
|
+
throw new Error(errorMessages[type] || errorMessages["default"]);
|
|
24222
|
+
}
|
|
24223
|
+
|
|
24224
|
+
var errorMessages = {
|
|
24225
|
+
configIsRequired: 'the configuration object is required',
|
|
24226
|
+
configType: 'the configuration object should be an object',
|
|
24227
|
+
"default": 'an unknown error accured in `@monaco-editor/loader` package',
|
|
24228
|
+
deprecation: "Deprecation warning!\n You are using deprecated way of configuration.\n\n Instead of using\n monaco.config({ urls: { monacoBase: '...' } })\n use\n monaco.config({ paths: { vs: '...' } })\n\n For more please check the link https://github.com/suren-atoyan/monaco-loader#config\n "
|
|
24229
|
+
};
|
|
24230
|
+
var errorHandler = curry(throwError)(errorMessages);
|
|
24231
|
+
var validators = {
|
|
24232
|
+
config: validateConfig
|
|
24233
|
+
};
|
|
24234
|
+
|
|
24235
|
+
var compose = function compose() {
|
|
24236
|
+
for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
24237
|
+
fns[_key] = arguments[_key];
|
|
24238
|
+
}
|
|
24239
|
+
|
|
24240
|
+
return function (x) {
|
|
24241
|
+
return fns.reduceRight(function (y, f) {
|
|
24242
|
+
return f(y);
|
|
24243
|
+
}, x);
|
|
24244
|
+
};
|
|
24245
|
+
};
|
|
24246
|
+
|
|
24247
|
+
function merge(target, source) {
|
|
24248
|
+
Object.keys(source).forEach(function (key) {
|
|
24249
|
+
if (source[key] instanceof Object) {
|
|
24250
|
+
if (target[key]) {
|
|
24251
|
+
Object.assign(source[key], merge(target[key], source[key]));
|
|
24252
|
+
}
|
|
24253
|
+
}
|
|
24254
|
+
});
|
|
24255
|
+
return _objectSpread2$3(_objectSpread2$3({}, target), source);
|
|
24256
|
+
}
|
|
24257
|
+
|
|
24258
|
+
// The source (has been changed) is https://github.com/facebook/react/issues/5465#issuecomment-157888325
|
|
24259
|
+
var CANCELATION_MESSAGE = {
|
|
24260
|
+
type: 'cancelation',
|
|
24261
|
+
msg: 'operation is manually canceled'
|
|
24262
|
+
};
|
|
24263
|
+
|
|
24264
|
+
function makeCancelable(promise) {
|
|
24265
|
+
var hasCanceled_ = false;
|
|
24266
|
+
var wrappedPromise = new Promise(function (resolve, reject) {
|
|
24267
|
+
promise.then(function (val) {
|
|
24268
|
+
return hasCanceled_ ? reject(CANCELATION_MESSAGE) : resolve(val);
|
|
24269
|
+
});
|
|
24270
|
+
promise["catch"](reject);
|
|
24271
|
+
});
|
|
24272
|
+
return wrappedPromise.cancel = function () {
|
|
24273
|
+
return hasCanceled_ = true;
|
|
24274
|
+
}, wrappedPromise;
|
|
24275
|
+
}
|
|
24276
|
+
|
|
24277
|
+
/** the local state of the module */
|
|
24278
|
+
|
|
24279
|
+
var _state$create = index$1.create({
|
|
24280
|
+
config: config$1,
|
|
24281
|
+
isInitialized: false,
|
|
24282
|
+
resolve: null,
|
|
24283
|
+
reject: null,
|
|
24284
|
+
monaco: null
|
|
24285
|
+
}),
|
|
24286
|
+
_state$create2 = _slicedToArray(_state$create, 2),
|
|
24287
|
+
getState = _state$create2[0],
|
|
24288
|
+
setState = _state$create2[1];
|
|
24289
|
+
/**
|
|
24290
|
+
* set the loader configuration
|
|
24291
|
+
* @param {Object} config - the configuration object
|
|
24292
|
+
*/
|
|
24293
|
+
|
|
24294
|
+
|
|
24295
|
+
function config(globalConfig) {
|
|
24296
|
+
var _validators$config = validators.config(globalConfig),
|
|
24297
|
+
monaco = _validators$config.monaco,
|
|
24298
|
+
config = _objectWithoutProperties$1(_validators$config, ["monaco"]);
|
|
24299
|
+
|
|
24300
|
+
setState(function (state) {
|
|
24301
|
+
return {
|
|
24302
|
+
config: merge(state.config, config),
|
|
24303
|
+
monaco: monaco
|
|
24304
|
+
};
|
|
24305
|
+
});
|
|
24306
|
+
}
|
|
24307
|
+
/**
|
|
24308
|
+
* handles the initialization of the monaco-editor
|
|
24309
|
+
* @return {Promise} - returns an instance of monaco (with a cancelable promise)
|
|
24310
|
+
*/
|
|
24311
|
+
|
|
24312
|
+
|
|
24313
|
+
function init() {
|
|
24314
|
+
var state = getState(function (_ref) {
|
|
24315
|
+
var monaco = _ref.monaco,
|
|
24316
|
+
isInitialized = _ref.isInitialized,
|
|
24317
|
+
resolve = _ref.resolve;
|
|
24318
|
+
return {
|
|
24319
|
+
monaco: monaco,
|
|
24320
|
+
isInitialized: isInitialized,
|
|
24321
|
+
resolve: resolve
|
|
24322
|
+
};
|
|
24323
|
+
});
|
|
24324
|
+
|
|
24325
|
+
if (!state.isInitialized) {
|
|
24326
|
+
setState({
|
|
24327
|
+
isInitialized: true
|
|
24328
|
+
});
|
|
24329
|
+
|
|
24330
|
+
if (state.monaco) {
|
|
24331
|
+
state.resolve(state.monaco);
|
|
24332
|
+
return makeCancelable(wrapperPromise);
|
|
24333
|
+
}
|
|
24334
|
+
|
|
24335
|
+
if (window.monaco && window.monaco.editor) {
|
|
24336
|
+
storeMonacoInstance(window.monaco);
|
|
24337
|
+
state.resolve(window.monaco);
|
|
24338
|
+
return makeCancelable(wrapperPromise);
|
|
24339
|
+
}
|
|
24340
|
+
|
|
24341
|
+
compose(injectScripts, getMonacoLoaderScript)(configureLoader);
|
|
24342
|
+
}
|
|
24343
|
+
|
|
24344
|
+
return makeCancelable(wrapperPromise);
|
|
24345
|
+
}
|
|
24346
|
+
/**
|
|
24347
|
+
* injects provided scripts into the document.body
|
|
24348
|
+
* @param {Object} script - an HTML script element
|
|
24349
|
+
* @return {Object} - the injected HTML script element
|
|
24350
|
+
*/
|
|
24351
|
+
|
|
24352
|
+
|
|
24353
|
+
function injectScripts(script) {
|
|
24354
|
+
return document.body.appendChild(script);
|
|
24355
|
+
}
|
|
24356
|
+
/**
|
|
24357
|
+
* creates an HTML script element with/without provided src
|
|
24358
|
+
* @param {string} [src] - the source path of the script
|
|
24359
|
+
* @return {Object} - the created HTML script element
|
|
24360
|
+
*/
|
|
24361
|
+
|
|
24362
|
+
|
|
24363
|
+
function createScript(src) {
|
|
24364
|
+
var script = document.createElement('script');
|
|
24365
|
+
return src && (script.src = src), script;
|
|
24366
|
+
}
|
|
24367
|
+
/**
|
|
24368
|
+
* creates an HTML script element with the monaco loader src
|
|
24369
|
+
* @return {Object} - the created HTML script element
|
|
24370
|
+
*/
|
|
24371
|
+
|
|
24372
|
+
|
|
24373
|
+
function getMonacoLoaderScript(configureLoader) {
|
|
24374
|
+
var state = getState(function (_ref2) {
|
|
24375
|
+
var config = _ref2.config,
|
|
24376
|
+
reject = _ref2.reject;
|
|
24377
|
+
return {
|
|
24378
|
+
config: config,
|
|
24379
|
+
reject: reject
|
|
24380
|
+
};
|
|
24381
|
+
});
|
|
24382
|
+
var loaderScript = createScript("".concat(state.config.paths.vs, "/loader.js"));
|
|
24383
|
+
|
|
24384
|
+
loaderScript.onload = function () {
|
|
24385
|
+
return configureLoader();
|
|
24386
|
+
};
|
|
24387
|
+
|
|
24388
|
+
loaderScript.onerror = state.reject;
|
|
24389
|
+
return loaderScript;
|
|
24390
|
+
}
|
|
24391
|
+
/**
|
|
24392
|
+
* configures the monaco loader
|
|
24393
|
+
*/
|
|
24394
|
+
|
|
24395
|
+
|
|
24396
|
+
function configureLoader() {
|
|
24397
|
+
var state = getState(function (_ref3) {
|
|
24398
|
+
var config = _ref3.config,
|
|
24399
|
+
resolve = _ref3.resolve,
|
|
24400
|
+
reject = _ref3.reject;
|
|
24401
|
+
return {
|
|
24402
|
+
config: config,
|
|
24403
|
+
resolve: resolve,
|
|
24404
|
+
reject: reject
|
|
24405
|
+
};
|
|
24406
|
+
});
|
|
24407
|
+
var require = window.require;
|
|
24408
|
+
|
|
24409
|
+
require.config(state.config);
|
|
24410
|
+
|
|
24411
|
+
require(['vs/editor/editor.main'], function (monaco) {
|
|
24412
|
+
storeMonacoInstance(monaco);
|
|
24413
|
+
state.resolve(monaco);
|
|
24414
|
+
}, function (error) {
|
|
24415
|
+
state.reject(error);
|
|
24416
|
+
});
|
|
24417
|
+
}
|
|
24418
|
+
/**
|
|
24419
|
+
* store monaco instance in local state
|
|
24420
|
+
*/
|
|
24421
|
+
|
|
24422
|
+
|
|
24423
|
+
function storeMonacoInstance(monaco) {
|
|
24424
|
+
if (!getState().monaco) {
|
|
24425
|
+
setState({
|
|
24426
|
+
monaco: monaco
|
|
24427
|
+
});
|
|
24428
|
+
}
|
|
24429
|
+
}
|
|
24430
|
+
/**
|
|
24431
|
+
* internal helper function
|
|
24432
|
+
* extracts stored monaco instance
|
|
24433
|
+
* @return {Object|null} - the monaco instance
|
|
24434
|
+
*/
|
|
24435
|
+
|
|
24436
|
+
|
|
24437
|
+
function __getMonacoInstance() {
|
|
24438
|
+
return getState(function (_ref4) {
|
|
24439
|
+
var monaco = _ref4.monaco;
|
|
24440
|
+
return monaco;
|
|
24441
|
+
});
|
|
24442
|
+
}
|
|
24443
|
+
|
|
24444
|
+
var wrapperPromise = new Promise(function (resolve, reject) {
|
|
24445
|
+
return setState({
|
|
24446
|
+
resolve: resolve,
|
|
24447
|
+
reject: reject
|
|
24448
|
+
});
|
|
24449
|
+
});
|
|
24450
|
+
var loader = {
|
|
24451
|
+
config: config,
|
|
24452
|
+
init: init,
|
|
24453
|
+
__getMonacoInstance: __getMonacoInstance
|
|
24454
|
+
};
|
|
24455
|
+
|
|
23821
24456
|
const dom$I = new Dom();
|
|
23822
24457
|
let hash$1 = {};
|
|
23823
24458
|
class HtmlUtil {
|
|
@@ -23830,112 +24465,233 @@ class HtmlUtil {
|
|
|
23830
24465
|
if (!viewhtml) {
|
|
23831
24466
|
/*
|
|
23832
24467
|
Note:
|
|
23833
|
-
- viewhtml => non syntax-highlighted.
|
|
23834
|
-
-
|
|
23835
|
-
-
|
|
24468
|
+
- viewhtml => non syntax-highlighted.
|
|
24469
|
+
- viewhtmlmonaco => syntax-highlighted.
|
|
24470
|
+
- viewhtmlexternal => external use.
|
|
23836
24471
|
*/
|
|
23837
24472
|
const html = `<div class="is-modal viewhtml">
|
|
23838
24473
|
<div class="is-modal-content">
|
|
23839
24474
|
<textarea class="tabSupport" style="width:100%;height:calc(100% - 50px);border:none;margin:0;box-sizing:border-box;"></textarea>
|
|
23840
|
-
<button title="${util.out('Enlarge')}" class="input-html-larger" style="width:35px;height:35px;position:absolute;right:20px;top:0;background:transparent;"><svg class="is-icon-flex" style="width:19px;height:19px;"><use xlink:href="#ion-arrow-expand"></use></svg></button>
|
|
23841
24475
|
<div class="is-modal-footer" style="border-top:1px solid ${this.builder.styleSeparatorColor};width:100%;height:50px;position:absolute;left:0;bottom:0;overflow:hidden;text-align:right">
|
|
23842
24476
|
<button title="${util.out('Cancel')}" class="input-cancel classic-secondary">${util.out('Cancel')}</button>
|
|
23843
24477
|
<button title="${util.out('Ok')}" class="input-ok classic-primary">${util.out('Ok')}</button>
|
|
23844
24478
|
</div>
|
|
23845
24479
|
</div>
|
|
23846
24480
|
</div>
|
|
23847
|
-
|
|
23848
|
-
<
|
|
23849
|
-
|
|
23850
|
-
|
|
24481
|
+
|
|
24482
|
+
<style>
|
|
24483
|
+
#_cbhtml .input-code-editor *,
|
|
24484
|
+
.is-ui .input-code-editor * {
|
|
24485
|
+
font-family: Menlo, Monaco, "Courier New", monospace;
|
|
24486
|
+
}
|
|
24487
|
+
#_cbhtml .input-code-editor textarea,
|
|
24488
|
+
.is-ui .input-code-editor textarea{
|
|
24489
|
+
margin:0;
|
|
24490
|
+
padding:0;
|
|
24491
|
+
}
|
|
24492
|
+
</style>
|
|
24493
|
+
|
|
24494
|
+
<div class="is-modal viewhtmlmonaco">
|
|
24495
|
+
<div class="is-modal-content" style="max-width: 55vw;padding:0">
|
|
23851
24496
|
<textarea style="position:absolute;display:none;"></textarea>
|
|
23852
|
-
<
|
|
23853
|
-
<div class="is-modal-footer" style="border-top:1px solid ${this.builder.styleSeparatorColor};
|
|
24497
|
+
<div class="input-code-editor" style="width:100%;height:65vh;"></div>
|
|
24498
|
+
<div class="is-modal-footer" style="display:flex;justify-content:flex-end;border-top:1px solid ${this.builder.styleSeparatorColor};">
|
|
23854
24499
|
<button title="${util.out('Cancel')}" class="input-cancel classic-secondary">${util.out('Cancel')}</button>
|
|
23855
24500
|
<button title="${util.out('Ok')}" class="input-ok classic-primary">${util.out('Ok')}</button>
|
|
23856
24501
|
</div>
|
|
23857
24502
|
</div>
|
|
23858
24503
|
</div>
|
|
23859
24504
|
|
|
23860
|
-
<div class="is-modal
|
|
23861
|
-
<div class="is-modal-content">
|
|
23862
|
-
<
|
|
23863
|
-
|
|
23864
|
-
|
|
23865
|
-
|
|
23866
|
-
|
|
23867
|
-
<div class="is-modal-content">
|
|
23868
|
-
<button title="${util.out('Enlarge')}" class="input-html-larger" style="width:35px;height:35px;position:absolute;right:20px;top:0;background:transparent;"><svg class="is-icon-flex" style="width:19px;height:19px;"><use xlink:href="#ion-arrow-expand"></use></svg></button>
|
|
23869
|
-
<iframe id="ifrHtml" style="width:100%;height:100%;border: none;" src="about:blank"></iframe>
|
|
24505
|
+
<div class="is-modal viewhtmlexternal">
|
|
24506
|
+
<div class="is-modal-content" style="max-width: 55vw;padding:0">
|
|
24507
|
+
<div class="input-code-editor" style="width:100%;height:65vh;"></div>
|
|
24508
|
+
<div class="is-modal-footer" style="display:flex;justify-content:flex-end;border-top:1px solid ${this.builder.styleSeparatorColor};">
|
|
24509
|
+
<button title="${util.out('Cancel')}" class="input-cancel classic-secondary">${util.out('Cancel')}</button>
|
|
24510
|
+
<button title="${util.out('Ok')}" class="input-ok classic-primary">${util.out('Ok')}</button>
|
|
24511
|
+
</div>
|
|
23870
24512
|
</div>
|
|
23871
24513
|
</div>
|
|
23872
24514
|
|
|
23873
24515
|
`;
|
|
23874
24516
|
dom$I.appendHtml(builderStuff, html);
|
|
23875
24517
|
viewhtml = builderStuff.querySelector('.viewhtml');
|
|
23876
|
-
let
|
|
23877
|
-
let
|
|
23878
|
-
let elm = viewhtml.querySelector('.input-
|
|
24518
|
+
let viewhtmlmonaco = builderStuff.querySelector('.viewhtmlmonaco');
|
|
24519
|
+
let viewhtmlexternal = builderStuff.querySelector('.viewhtmlexternal');
|
|
24520
|
+
let elm = viewhtml.querySelector('.input-ok');
|
|
23879
24521
|
dom$I.addEventListener(elm, 'click', () => {
|
|
23880
|
-
|
|
23881
|
-
// let elms = document.querySelectorAll('[data-source-active]');
|
|
23882
|
-
// Array.prototype.forEach.call(elms, (elm) => {
|
|
23883
|
-
// elm.removeAttribute('data-source-active');
|
|
23884
|
-
// elm.removeAttribute('data-source-ok');
|
|
23885
|
-
// elm.removeAttribute('data-source-cancel');
|
|
23886
|
-
// });
|
|
23887
|
-
|
|
23888
|
-
textarea.setAttribute('data-source-active', '1');
|
|
23889
|
-
textarea.setAttribute('data-source-ok', '.viewhtml .input-ok');
|
|
23890
|
-
textarea.setAttribute('data-source-cancel', '.viewhtml .input-cancel');
|
|
23891
|
-
this.viewHtmlLarger();
|
|
24522
|
+
this.applyHtml(viewhtml);
|
|
23892
24523
|
});
|
|
23893
|
-
elm =
|
|
24524
|
+
elm = viewhtml.querySelector('.input-cancel');
|
|
23894
24525
|
dom$I.addEventListener(elm, 'click', () => {
|
|
23895
|
-
|
|
23896
|
-
dom$I.removeClass(viewhtmlformatted, 'is-modal-full');
|
|
23897
|
-
} else {
|
|
23898
|
-
dom$I.addClass(viewhtmlformatted, 'is-modal-full');
|
|
23899
|
-
}
|
|
24526
|
+
util.hideModal(viewhtml);
|
|
23900
24527
|
});
|
|
23901
|
-
elm =
|
|
24528
|
+
elm = viewhtmlmonaco.querySelector('.input-ok');
|
|
23902
24529
|
dom$I.addEventListener(elm, 'click', () => {
|
|
23903
|
-
|
|
23904
|
-
|
|
23905
|
-
|
|
23906
|
-
|
|
23907
|
-
|
|
24530
|
+
this.applyHtml(viewhtmlmonaco);
|
|
24531
|
+
});
|
|
24532
|
+
elm = viewhtmlmonaco.querySelector('.input-cancel');
|
|
24533
|
+
dom$I.addEventListener(elm, 'click', () => {
|
|
24534
|
+
util.hideModal(viewhtmlmonaco);
|
|
24535
|
+
});
|
|
24536
|
+
elm = viewhtmlexternal.querySelector('.input-ok');
|
|
24537
|
+
dom$I.addEventListener(elm, 'click', () => {
|
|
24538
|
+
const source = document.querySelector('textarea[data-source-active]');
|
|
24539
|
+
const selectorOk = source.getAttribute('data-source-ok');
|
|
24540
|
+
source.removeAttribute('data-source-active');
|
|
24541
|
+
source.removeAttribute('data-source-ok');
|
|
24542
|
+
source.removeAttribute('data-source-cancel');
|
|
24543
|
+
document.querySelector(selectorOk).click();
|
|
24544
|
+
util.hideModal(viewhtmlexternal);
|
|
24545
|
+
});
|
|
24546
|
+
elm = viewhtmlexternal.querySelector('.input-cancel');
|
|
24547
|
+
dom$I.addEventListener(elm, 'click', () => {
|
|
24548
|
+
const source = document.querySelector('textarea[data-source-active]');
|
|
24549
|
+
const selectorCancel = source.getAttribute('data-source-cancel');
|
|
24550
|
+
source.removeAttribute('data-source-active');
|
|
24551
|
+
source.removeAttribute('data-source-ok');
|
|
24552
|
+
source.removeAttribute('data-source-cancel');
|
|
24553
|
+
document.querySelector(selectorCancel).click();
|
|
24554
|
+
util.hideModal(viewhtmlexternal);
|
|
23908
24555
|
});
|
|
23909
24556
|
}
|
|
23910
24557
|
}
|
|
23911
24558
|
|
|
23912
|
-
|
|
24559
|
+
applyHtml(modal) {
|
|
23913
24560
|
const util = this.builder.util;
|
|
23914
|
-
|
|
23915
|
-
|
|
23916
|
-
|
|
23917
|
-
let
|
|
23918
|
-
|
|
24561
|
+
let mode = this.builder.codeEditorMode;
|
|
24562
|
+
let area = this.builder.codeEditorArea;
|
|
24563
|
+
this.builder.uo.saveForUndo();
|
|
24564
|
+
let textarea = modal.querySelector('textarea');
|
|
24565
|
+
let html = textarea.value;
|
|
24566
|
+
|
|
24567
|
+
if (mode === 'code') {
|
|
24568
|
+
let codeblock = this.builder.activeCodeBlock; //this.builder.renderCustomCodeBlock($block, html);
|
|
24569
|
+
|
|
24570
|
+
codeblock.setAttribute('data-html', encodeURIComponent(html)); // => important
|
|
24571
|
+
|
|
24572
|
+
html = html.replace(/{id}/g, util.makeId());
|
|
24573
|
+
|
|
24574
|
+
for (let i = 1; i <= 20; i++) {
|
|
24575
|
+
html = html.replace('[%HTML' + i + '%]', codeblock.getAttribute('data-html-' + i) === undefined ? '' : decodeURIComponent(codeblock.getAttribute('data-html-' + i))); //render editable area
|
|
24576
|
+
} //codeblock.innerHTML = html;
|
|
24577
|
+
|
|
24578
|
+
|
|
24579
|
+
codeblock.innerHTML = ''; // Use createContextualFragment() to make embedded script executable
|
|
24580
|
+
// https://ghinda.net/article/script-tags/
|
|
24581
|
+
|
|
24582
|
+
let range = document.createRange();
|
|
24583
|
+
range.setStart(codeblock, 0);
|
|
24584
|
+
codeblock.appendChild(range.createContextualFragment(html));
|
|
24585
|
+
let builderActive = document.querySelector('.builder-active');
|
|
24586
|
+
if (builderActive) this.builder.applyBehaviorOn(builderActive); //Trigger Change event
|
|
24587
|
+
|
|
24588
|
+
this.builder.opts.onChange(); //Trigger Render event
|
|
23919
24589
|
|
|
23920
|
-
|
|
23921
|
-
|
|
23922
|
-
|
|
24590
|
+
this.builder.opts.onRender();
|
|
24591
|
+
util.hideModal(modal);
|
|
24592
|
+
util.hideControls();
|
|
24593
|
+
return;
|
|
24594
|
+
}
|
|
24595
|
+
|
|
24596
|
+
html = this.fromViewToActual(html);
|
|
24597
|
+
|
|
24598
|
+
if (mode === 'cell') {
|
|
24599
|
+
const cell = util.cellSelected();
|
|
24600
|
+
cell.innerHTML = html;
|
|
24601
|
+
let builderActive = document.querySelector('.builder-active');
|
|
24602
|
+
if (builderActive) this.builder.applyBehaviorOn(builderActive); //Trigger Change event
|
|
24603
|
+
|
|
24604
|
+
this.builder.opts.onChange(); //Trigger Render event
|
|
24605
|
+
|
|
24606
|
+
this.builder.opts.onRender();
|
|
24607
|
+
}
|
|
24608
|
+
|
|
24609
|
+
if (mode === 'row') {
|
|
24610
|
+
let row;
|
|
24611
|
+
let cell = util.cellSelected();
|
|
24612
|
+
|
|
24613
|
+
if (cell) {
|
|
24614
|
+
row = cell.parentNode;
|
|
24615
|
+
} else {
|
|
24616
|
+
row = util.rowSelected();
|
|
24617
|
+
}
|
|
24618
|
+
|
|
24619
|
+
if (!row) return;
|
|
24620
|
+
row.innerHTML = html;
|
|
24621
|
+
let builderActive = document.querySelector('.builder-active');
|
|
24622
|
+
if (builderActive) this.builder.applyBehaviorOn(builderActive); //Trigger Change event
|
|
24623
|
+
|
|
24624
|
+
this.builder.opts.onChange(); //Trigger Render event
|
|
24625
|
+
|
|
24626
|
+
this.builder.opts.onRender();
|
|
24627
|
+
}
|
|
24628
|
+
|
|
24629
|
+
if (mode === 'full') {
|
|
24630
|
+
// area.innerHTML = html;
|
|
24631
|
+
area.innerHTML = ''; // Use createContextualFragment() to make embedded script executable
|
|
24632
|
+
// https://ghinda.net/article/script-tags/
|
|
23923
24633
|
|
|
23924
|
-
|
|
24634
|
+
let range = document.createRange();
|
|
24635
|
+
range.setStart(area, 0);
|
|
24636
|
+
area.appendChild(range.createContextualFragment(html));
|
|
24637
|
+
let builderActive = document.querySelector('.builder-active');
|
|
24638
|
+
if (builderActive) this.builder.applyBehaviorOn(builderActive); //Trigger Change event
|
|
24639
|
+
|
|
24640
|
+
this.builder.opts.onChange(); //Trigger Render event
|
|
24641
|
+
|
|
24642
|
+
this.builder.opts.onRender();
|
|
24643
|
+
util.clearActiveCell();
|
|
24644
|
+
}
|
|
24645
|
+
|
|
24646
|
+
util.clearControls(); // NEW
|
|
24647
|
+
|
|
24648
|
+
util.hideModal(modal);
|
|
23925
24649
|
}
|
|
23926
24650
|
|
|
23927
|
-
|
|
24651
|
+
viewHtmlExternal() {
|
|
24652
|
+
const source = document.querySelector('textarea[data-source-active]');
|
|
23928
24653
|
const util = this.builder.util;
|
|
23929
24654
|
const builderStuff = this.builder.builderStuff;
|
|
23930
|
-
const
|
|
23931
|
-
let
|
|
23932
|
-
|
|
24655
|
+
const viewhtmlexternal = builderStuff.querySelector('.viewhtmlexternal');
|
|
24656
|
+
let codeEditor = viewhtmlexternal.querySelector('.input-code-editor');
|
|
24657
|
+
|
|
24658
|
+
if (!codeEditor.querySelector('.monaco-editor')) {
|
|
24659
|
+
// First time code editor load
|
|
24660
|
+
loader.init().then(monaco => {
|
|
24661
|
+
this.builder.monaco = monaco;
|
|
24662
|
+
if (!codeEditor.getAttribute('data-mode-id')) this.builder.codeEditorExternal = monaco.editor.create(codeEditor, {
|
|
24663
|
+
value: '',
|
|
24664
|
+
minimap: {
|
|
24665
|
+
enabled: false
|
|
24666
|
+
},
|
|
24667
|
+
automaticLayout: true,
|
|
24668
|
+
contextmenu: false,
|
|
24669
|
+
fontSize: 13,
|
|
24670
|
+
scrollbar: {
|
|
24671
|
+
useShadows: false,
|
|
24672
|
+
vertical: 'visible',
|
|
24673
|
+
horizontal: 'visible',
|
|
24674
|
+
horizontalScrollbarSize: 12,
|
|
24675
|
+
verticalScrollbarSize: 12
|
|
24676
|
+
},
|
|
24677
|
+
language: 'html',
|
|
24678
|
+
theme: this.builder.styleDark || this.builder.styleColoredDark ? 'vs-dark' : ''
|
|
24679
|
+
});
|
|
24680
|
+
this.builder.codeEditorExternal.onKeyUp(() => {
|
|
24681
|
+
const source = document.querySelector('textarea[data-source-active]');
|
|
24682
|
+
source.value = this.builder.codeEditorExternal.getModel().getValue();
|
|
24683
|
+
});
|
|
24684
|
+
});
|
|
24685
|
+
setTimeout(() => {
|
|
24686
|
+
this.viewHtmlExternal();
|
|
24687
|
+
}, 100);
|
|
24688
|
+
return;
|
|
24689
|
+
}
|
|
23933
24690
|
|
|
23934
|
-
|
|
23935
|
-
|
|
23936
|
-
|
|
23937
|
-
|
|
23938
|
-
util.showModal(viewhtmllarger, true, null, false);
|
|
24691
|
+
util.showModal(viewhtmlexternal, true, null, false); // code editor
|
|
24692
|
+
|
|
24693
|
+
const model = this.builder.monaco.editor.createModel(source.value, 'html');
|
|
24694
|
+
this.builder.codeEditorExternal.setModel(model);
|
|
23939
24695
|
}
|
|
23940
24696
|
|
|
23941
24697
|
view(mode, area) {
|
|
@@ -23944,13 +24700,46 @@ class HtmlUtil {
|
|
|
23944
24700
|
let viewhtml;
|
|
23945
24701
|
|
|
23946
24702
|
if (this.builder.opts.htmlSyntaxHighlighting) {
|
|
23947
|
-
viewhtml = builderStuff.querySelector('.
|
|
24703
|
+
viewhtml = builderStuff.querySelector('.viewhtmlmonaco');
|
|
24704
|
+
let codeEditor = viewhtml.querySelector('.input-code-editor');
|
|
24705
|
+
|
|
24706
|
+
if (!codeEditor.querySelector('.monaco-editor')) {
|
|
24707
|
+
// First time code editor load
|
|
24708
|
+
loader.init().then(monaco => {
|
|
24709
|
+
this.builder.monaco = monaco;
|
|
24710
|
+
if (!codeEditor.getAttribute('data-mode-id')) this.builder.codeEditor = monaco.editor.create(codeEditor, {
|
|
24711
|
+
value: '',
|
|
24712
|
+
minimap: {
|
|
24713
|
+
enabled: false
|
|
24714
|
+
},
|
|
24715
|
+
automaticLayout: true,
|
|
24716
|
+
contextmenu: false,
|
|
24717
|
+
fontSize: 13,
|
|
24718
|
+
scrollbar: {
|
|
24719
|
+
useShadows: false,
|
|
24720
|
+
vertical: 'visible',
|
|
24721
|
+
horizontal: 'visible',
|
|
24722
|
+
horizontalScrollbarSize: 12,
|
|
24723
|
+
verticalScrollbarSize: 12
|
|
24724
|
+
},
|
|
24725
|
+
language: 'html',
|
|
24726
|
+
theme: this.builder.styleDark || this.builder.styleColoredDark ? 'vs-dark' : ''
|
|
24727
|
+
});
|
|
24728
|
+
let textarea = viewhtml.querySelector('textarea');
|
|
24729
|
+
this.builder.codeEditor.onKeyUp(() => {
|
|
24730
|
+
textarea.value = this.builder.codeEditor.getModel().getValue();
|
|
24731
|
+
});
|
|
24732
|
+
});
|
|
24733
|
+
setTimeout(() => {
|
|
24734
|
+
this.view(mode, area);
|
|
24735
|
+
}, 100);
|
|
24736
|
+
return;
|
|
24737
|
+
}
|
|
23948
24738
|
} else {
|
|
23949
24739
|
viewhtml = builderStuff.querySelector('.viewhtml');
|
|
23950
24740
|
}
|
|
23951
24741
|
|
|
23952
|
-
|
|
23953
|
-
<button title="${util.out('Ok')}" class="input-ok classic-primary">${util.out('Ok')}</button>`;
|
|
24742
|
+
let textarea = viewhtml.querySelector('textarea');
|
|
23954
24743
|
util.showModal(viewhtml, true);
|
|
23955
24744
|
|
|
23956
24745
|
if (mode === 'cell') {
|
|
@@ -24018,81 +24807,10 @@ class HtmlUtil {
|
|
|
24018
24807
|
this.builder.cleanHtmlFormatting = false;
|
|
24019
24808
|
}
|
|
24020
24809
|
|
|
24021
|
-
let elm = viewhtml.querySelector('.input-ok');
|
|
24022
|
-
dom$I.addEventListener(elm, 'click', () => {
|
|
24023
|
-
this.builder.uo.saveForUndo();
|
|
24024
|
-
let textarea = viewhtml.querySelector('textarea');
|
|
24025
|
-
var html = textarea.value;
|
|
24026
|
-
html = this.fromViewToActual(html);
|
|
24027
|
-
|
|
24028
|
-
if (mode === 'cell') {
|
|
24029
|
-
const cell = util.cellSelected();
|
|
24030
|
-
cell.innerHTML = html;
|
|
24031
|
-
let builderActive = document.querySelector('.builder-active');
|
|
24032
|
-
if (builderActive) this.builder.applyBehaviorOn(builderActive); //Trigger Change event
|
|
24033
|
-
|
|
24034
|
-
this.builder.opts.onChange(); //Trigger Render event
|
|
24035
|
-
|
|
24036
|
-
this.builder.opts.onRender();
|
|
24037
|
-
}
|
|
24038
|
-
|
|
24039
|
-
if (mode === 'row') {
|
|
24040
|
-
const cell = util.cellSelected();
|
|
24041
|
-
const row = cell.parentNode;
|
|
24042
|
-
row.innerHTML = html;
|
|
24043
|
-
let builderActive = document.querySelector('.builder-active');
|
|
24044
|
-
if (builderActive) this.builder.applyBehaviorOn(builderActive); //Trigger Change event
|
|
24045
|
-
|
|
24046
|
-
this.builder.opts.onChange(); //Trigger Render event
|
|
24047
|
-
|
|
24048
|
-
this.builder.opts.onRender();
|
|
24049
|
-
}
|
|
24050
|
-
|
|
24051
|
-
if (mode === 'full') {
|
|
24052
|
-
// area.innerHTML = html;
|
|
24053
|
-
area.innerHTML = ''; // Use createContextualFragment() to make embedded script executable
|
|
24054
|
-
// https://ghinda.net/article/script-tags/
|
|
24055
|
-
|
|
24056
|
-
var range = document.createRange();
|
|
24057
|
-
range.setStart(area, 0);
|
|
24058
|
-
area.appendChild(range.createContextualFragment(html));
|
|
24059
|
-
let builderActive = document.querySelector('.builder-active');
|
|
24060
|
-
if (builderActive) this.builder.applyBehaviorOn(builderActive); //Trigger Change event
|
|
24061
|
-
|
|
24062
|
-
this.builder.opts.onChange(); //Trigger Render event
|
|
24063
|
-
|
|
24064
|
-
this.builder.opts.onRender();
|
|
24065
|
-
util.clearActiveCell();
|
|
24066
|
-
}
|
|
24067
|
-
|
|
24068
|
-
util.clearControls(); // NEW
|
|
24069
|
-
|
|
24070
|
-
util.hideModal(viewhtml);
|
|
24071
|
-
});
|
|
24072
|
-
elm = viewhtml.querySelector('.input-cancel');
|
|
24073
|
-
dom$I.addEventListener(elm, 'click', () => {
|
|
24074
|
-
util.hideModal(viewhtml);
|
|
24075
|
-
});
|
|
24076
|
-
|
|
24077
24810
|
if (this.builder.opts.htmlSyntaxHighlighting) {
|
|
24078
|
-
|
|
24079
|
-
|
|
24080
|
-
|
|
24081
|
-
// elm.removeAttribute('data-source-active');
|
|
24082
|
-
// elm.removeAttribute('data-source-ok');
|
|
24083
|
-
// elm.removeAttribute('data-source-cancel');
|
|
24084
|
-
// });
|
|
24085
|
-
|
|
24086
|
-
textarea.setAttribute('data-source-active', '1');
|
|
24087
|
-
textarea.setAttribute('data-source-ok', '.viewhtmlformatted .input-ok');
|
|
24088
|
-
textarea.setAttribute('data-source-cancel', '.viewhtmlformatted .input-cancel');
|
|
24089
|
-
let iframe = viewhtml.querySelector('iframe');
|
|
24090
|
-
iframe.outerHTML = '<iframe id="ifrHtmlFormatted" style="width:100%;height:100%;border: none;" src="about:blank"></iframe>'; //clear
|
|
24091
|
-
|
|
24092
|
-
var doc = viewhtml.querySelector('iframe').contentWindow.document;
|
|
24093
|
-
doc.open();
|
|
24094
|
-
doc.write(this.getIframeHtml());
|
|
24095
|
-
doc.close();
|
|
24811
|
+
// code editor
|
|
24812
|
+
const model = this.builder.monaco.editor.createModel(textarea.value, 'html');
|
|
24813
|
+
this.builder.codeEditor.setModel(model);
|
|
24096
24814
|
} //Hide popup
|
|
24097
24815
|
|
|
24098
24816
|
|
|
@@ -24100,6 +24818,8 @@ class HtmlUtil {
|
|
|
24100
24818
|
columnMore.style.display = '';
|
|
24101
24819
|
let rowMore = builderStuff.querySelector('.is-pop.rowmore');
|
|
24102
24820
|
rowMore.style.display = '';
|
|
24821
|
+
this.builder.codeEditorMode = mode;
|
|
24822
|
+
this.builder.codeEditorArea = area;
|
|
24103
24823
|
}
|
|
24104
24824
|
|
|
24105
24825
|
fromViewToActual(html) {
|
|
@@ -24537,291 +25257,6 @@ class HtmlUtil {
|
|
|
24537
25257
|
return beautify(html);
|
|
24538
25258
|
}
|
|
24539
25259
|
|
|
24540
|
-
getIframeHtml() {
|
|
24541
|
-
return `
|
|
24542
|
-
<!DOCTYPE HTML>
|
|
24543
|
-
<html>
|
|
24544
|
-
<head>
|
|
24545
|
-
<meta charset="utf-8">
|
|
24546
|
-
<title>Fonts</title>
|
|
24547
|
-
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
24548
|
-
<meta name="description" content="">
|
|
24549
|
-
<link href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.48.4/codemirror.css" rel="stylesheet" type="text/css" />
|
|
24550
|
-
|
|
24551
|
-
<style>
|
|
24552
|
-
html, body {height:100%}
|
|
24553
|
-
body {margin:0;overflow:hidden;}
|
|
24554
|
-
|
|
24555
|
-
button {
|
|
24556
|
-
width: 51px;
|
|
24557
|
-
height: 45px;
|
|
24558
|
-
line-height:1;
|
|
24559
|
-
display: inline-block;
|
|
24560
|
-
box-sizing:border-box;
|
|
24561
|
-
margin: 0;
|
|
24562
|
-
padding: 0;
|
|
24563
|
-
cursor: pointer;
|
|
24564
|
-
background-color: ${this.builder.styleModalBackground};
|
|
24565
|
-
color: ${this.builder.styleModalColor};
|
|
24566
|
-
border: 1px solid transparent;
|
|
24567
|
-
font-family: sans-serif;
|
|
24568
|
-
letter-spacing: 1px;
|
|
24569
|
-
font-size:12px;
|
|
24570
|
-
font-weight:normal;
|
|
24571
|
-
// text-transform:uppercase;
|
|
24572
|
-
text-align:center;
|
|
24573
|
-
position:relative;
|
|
24574
|
-
border-radius: 0;
|
|
24575
|
-
transition: all ease 0.3s;
|
|
24576
|
-
user-select: none;
|
|
24577
|
-
-moz-user-select: none;
|
|
24578
|
-
-khtml-user-select: none;
|
|
24579
|
-
-webkit-user-select: none;
|
|
24580
|
-
-o-user-select: none;
|
|
24581
|
-
}
|
|
24582
|
-
button.classic-primary {display:inline-block;width:auto;height:50px;padding-left:30px;padding-right:30px;min-width:135px;
|
|
24583
|
-
background-color: ${this.builder.styleButtonClassicBackground};
|
|
24584
|
-
color: ${this.builder.styleButtonClassicColor};
|
|
24585
|
-
}
|
|
24586
|
-
button.classic-secondary {display:inline-block;width:auto;height:50px;padding-left:30px;padding-right:30px;
|
|
24587
|
-
background:transparent;
|
|
24588
|
-
}
|
|
24589
|
-
button.classic-primary:hover {
|
|
24590
|
-
background-color: ${this.builder.styleButtonClassicBackgroundHover};
|
|
24591
|
-
}
|
|
24592
|
-
button:focus {outline:none;}
|
|
24593
|
-
textarea {font-family: courier, monospace;font-size: 17px;line-height: 2;letter-spacing: 1px;padding:8px 16px;box-sizing:border-box;border:1px solid rgb(199, 199, 199);}
|
|
24594
|
-
textarea:focus {outline:none}
|
|
24595
|
-
|
|
24596
|
-
#code {display:none;}
|
|
24597
|
-
.CodeMirror {
|
|
24598
|
-
font-family: courier, monospace;
|
|
24599
|
-
font-size: 15px;
|
|
24600
|
-
line-height:1.9;
|
|
24601
|
-
width:100%;height:100%;
|
|
24602
|
-
}
|
|
24603
|
-
|
|
24604
|
-
/* adjustment => for colored & dark */
|
|
24605
|
-
.colored .CodeMirror{
|
|
24606
|
-
background:#f5f5f5;
|
|
24607
|
-
}
|
|
24608
|
-
.colored .CodeMirror-gutters{
|
|
24609
|
-
background:#ececec;
|
|
24610
|
-
}
|
|
24611
|
-
|
|
24612
|
-
.colored-dark .CodeMirror{
|
|
24613
|
-
background:#f5f5f5;
|
|
24614
|
-
}
|
|
24615
|
-
.colored-dark .CodeMirror-gutters{
|
|
24616
|
-
background:#ececec;
|
|
24617
|
-
}
|
|
24618
|
-
|
|
24619
|
-
.dark .CodeMirror{
|
|
24620
|
-
background:#f5f5f5;
|
|
24621
|
-
}
|
|
24622
|
-
.dark .CodeMirror-gutters{
|
|
24623
|
-
background:#ececec;
|
|
24624
|
-
}
|
|
24625
|
-
|
|
24626
|
-
/* base16-light => not used */
|
|
24627
|
-
.cm-s-base16-light.CodeMirror{
|
|
24628
|
-
background:#eaeaea;//#f5f5f5;
|
|
24629
|
-
color:#202020
|
|
24630
|
-
}
|
|
24631
|
-
.cm-s-base16-light div.CodeMirror-selected{background:#e0e0e0}.cm-s-base16-light .CodeMirror-line::selection,.cm-s-base16-light .CodeMirror-line>span::selection,.cm-s-base16-light .CodeMirror-line>span>span::selection{background:#e0e0e0}.cm-s-base16-light .CodeMirror-line::-moz-selection,.cm-s-base16-light .CodeMirror-line>span::-moz-selection,.cm-s-base16-light .CodeMirror-line>span>span::-moz-selection{background:#e0e0e0}
|
|
24632
|
-
.cm-s-base16-light .CodeMirror-gutters{
|
|
24633
|
-
background:#dcdcdc; //#f5f5f5;
|
|
24634
|
-
border-right:0
|
|
24635
|
-
}
|
|
24636
|
-
.cm-s-base16-light .CodeMirror-guttermarker{color:#ac4142}.cm-s-base16-light .CodeMirror-guttermarker-subtle{color:#b0b0b0}
|
|
24637
|
-
.cm-s-base16-light .CodeMirror-linenumber{
|
|
24638
|
-
color:#989898;//#b0b0b0
|
|
24639
|
-
}
|
|
24640
|
-
.cm-s-base16-light .CodeMirror-cursor{border-left:1px solid #505050}.cm-s-base16-light span.cm-comment{color:#8f5536}.cm-s-base16-light span.cm-atom{color:#aa759f}.cm-s-base16-light span.cm-number{color:#aa759f}.cm-s-base16-light span.cm-attribute,.cm-s-base16-light span.cm-property{color:#90a959}.cm-s-base16-light span.cm-keyword{color:#ac4142}
|
|
24641
|
-
.cm-s-base16-light span.cm-string{color:#c37f20}
|
|
24642
|
-
.cm-s-base16-light span.cm-variable{color:#90a959}.cm-s-base16-light span.cm-variable-2{color:#6a9fb5}.cm-s-base16-light span.cm-def{color:#d28445}.cm-s-base16-light span.cm-bracket{color:#202020}.cm-s-base16-light span.cm-tag{color:#ac4142}.cm-s-base16-light span.cm-link{color:#aa759f}.cm-s-base16-light span.cm-error{background:#ac4142;color:#505050}.cm-s-base16-light .CodeMirror-activeline-background{background:#dddcdc}.cm-s-base16-light .CodeMirror-matchingbracket{color:#f5f5f5!important;background-color:#6a9fb5!important}
|
|
24643
|
-
|
|
24644
|
-
/* Port of TextMate's Blackboard theme => not used */
|
|
24645
|
-
|
|
24646
|
-
.cm-s-blackboard.CodeMirror { background: #262626; color: #F8F8F8; }
|
|
24647
|
-
.cm-s-blackboard div.CodeMirror-selected { background: #253B76; }
|
|
24648
|
-
.cm-s-blackboard .CodeMirror-line::selection, .cm-s-blackboard .CodeMirror-line > span::selection, .cm-s-blackboard .CodeMirror-line > span > span::selection { background: rgba(37, 59, 118, .99); }
|
|
24649
|
-
.cm-s-blackboard .CodeMirror-line::-moz-selection, .cm-s-blackboard .CodeMirror-line > span::-moz-selection, .cm-s-blackboard .CodeMirror-line > span > span::-moz-selection { background: rgba(37, 59, 118, .99); }
|
|
24650
|
-
.cm-s-blackboard .CodeMirror-gutters { background: #323232; border-right: 0; }
|
|
24651
|
-
.cm-s-blackboard .CodeMirror-guttermarker { color: #FBDE2D; }
|
|
24652
|
-
.cm-s-blackboard .CodeMirror-guttermarker-subtle { color: #888; }
|
|
24653
|
-
.cm-s-blackboard .CodeMirror-linenumber { color: #888; }
|
|
24654
|
-
.cm-s-blackboard .CodeMirror-cursor { border-left: 1px solid #A7A7A7; }
|
|
24655
|
-
|
|
24656
|
-
.cm-s-blackboard .cm-keyword { color: #FBDE2D; }
|
|
24657
|
-
.cm-s-blackboard .cm-atom { color: #D8FA3C; }
|
|
24658
|
-
.cm-s-blackboard .cm-number { color: #D8FA3C; }
|
|
24659
|
-
.cm-s-blackboard .cm-def { color: #8DA6CE; }
|
|
24660
|
-
.cm-s-blackboard .cm-variable { color: #FF6400; }
|
|
24661
|
-
.cm-s-blackboard .cm-operator { color: #FBDE2D; }
|
|
24662
|
-
.cm-s-blackboard .cm-comment { color: #AEAEAE; }
|
|
24663
|
-
.cm-s-blackboard .cm-string { color: #61CE3C; }
|
|
24664
|
-
.cm-s-blackboard .cm-string-2 { color: #61CE3C; }
|
|
24665
|
-
.cm-s-blackboard .cm-meta { color: #D8FA3C; }
|
|
24666
|
-
.cm-s-blackboard .cm-builtin { color: #8DA6CE; }
|
|
24667
|
-
.cm-s-blackboard .cm-tag { color: #8DA6CE; }
|
|
24668
|
-
.cm-s-blackboard .cm-attribute { color: #8DA6CE; }
|
|
24669
|
-
.cm-s-blackboard .cm-header { color: #FF6400; }
|
|
24670
|
-
.cm-s-blackboard .cm-hr { color: #AEAEAE; }
|
|
24671
|
-
.cm-s-blackboard .cm-link { color: #8DA6CE; }
|
|
24672
|
-
.cm-s-blackboard .cm-error { background: #9D1E15; color: #F8F8F8; }
|
|
24673
|
-
|
|
24674
|
-
.cm-s-blackboard .CodeMirror-activeline-background { background: #3C3636; }
|
|
24675
|
-
.cm-s-blackboard .CodeMirror-matchingbracket { outline:1px solid grey;color:white !important; }
|
|
24676
|
-
|
|
24677
|
-
|
|
24678
|
-
/* Scrollbar for modal */
|
|
24679
|
-
|
|
24680
|
-
.dark * {
|
|
24681
|
-
scrollbar-width: thin;
|
|
24682
|
-
scrollbar-color: rgba(255, 255, 255, 0.3) auto;
|
|
24683
|
-
}
|
|
24684
|
-
.dark *::-webkit-scrollbar {
|
|
24685
|
-
width: 12px;
|
|
24686
|
-
}
|
|
24687
|
-
.dark *::-webkit-scrollbar-track {
|
|
24688
|
-
background: transparent;
|
|
24689
|
-
}
|
|
24690
|
-
.dark *::-webkit-scrollbar-thumb {
|
|
24691
|
-
background-color:rgba(255, 255, 255, 0.3);
|
|
24692
|
-
}
|
|
24693
|
-
|
|
24694
|
-
.colored-dark * {
|
|
24695
|
-
scrollbar-width: thin;
|
|
24696
|
-
scrollbar-color: rgb(100, 100, 100) auto;
|
|
24697
|
-
}
|
|
24698
|
-
.colored-dark *::-webkit-scrollbar {
|
|
24699
|
-
width: 12px;
|
|
24700
|
-
}
|
|
24701
|
-
.colored-dark *::-webkit-scrollbar-track {
|
|
24702
|
-
background: transparent;
|
|
24703
|
-
}
|
|
24704
|
-
.colored-dark *::-webkit-scrollbar-thumb {
|
|
24705
|
-
background-color:rgb(100, 100, 100);
|
|
24706
|
-
}
|
|
24707
|
-
|
|
24708
|
-
.light * {
|
|
24709
|
-
scrollbar-width: thin;
|
|
24710
|
-
scrollbar-color: rgba(0, 0, 0, 0.4) auto;
|
|
24711
|
-
}
|
|
24712
|
-
.light *::-webkit-scrollbar {
|
|
24713
|
-
width: 12px;
|
|
24714
|
-
}
|
|
24715
|
-
.light *::-webkit-scrollbar-track {
|
|
24716
|
-
background: transparent;
|
|
24717
|
-
}
|
|
24718
|
-
.light *::-webkit-scrollbar-thumb {
|
|
24719
|
-
background-color: rgba(0, 0, 0, 0.4);
|
|
24720
|
-
}
|
|
24721
|
-
</style>
|
|
24722
|
-
</head>
|
|
24723
|
-
<body${this.builder.styleDark ? ' class="dark"' : ''}${this.builder.styleColored ? ' class="colored"' : ''}${this.builder.styleColoredDark ? ' class="colored-dark"' : ''}${this.builder.styleLight ? ' class="light"' : ''}>
|
|
24724
|
-
|
|
24725
|
-
<div style="position:absolute;top:0;left:0;width:100%;height:100%;border:none;border-bottom:50px solid transparent;box-sizing: border-box;">
|
|
24726
|
-
<textarea id="code"></textarea>
|
|
24727
|
-
</div>
|
|
24728
|
-
<div style="width:100%;height:50px;position:absolute;left:0;border-top:1px solid ${this.builder.styleSeparatorColor};bottom:0;overflow:hidden;text-align:right">
|
|
24729
|
-
<button title="${this.builder.out('Cancel')}" class="input-cancel classic-secondary">${this.builder.out('Cancel')}</button>
|
|
24730
|
-
<button title="${this.builder.out('Ok')}" class="input-ok classic-primary">${this.builder.out('Ok')}</button>
|
|
24731
|
-
</div>
|
|
24732
|
-
|
|
24733
|
-
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.48.4/codemirror.js" type="text/javascript"></script>
|
|
24734
|
-
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.48.4/mode/xml/xml.js" type="text/javascript"></script>
|
|
24735
|
-
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.48.4/mode/javascript/javascript.js" type="text/javascript"></script>
|
|
24736
|
-
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.48.4/mode/css/css.js" type="text/javascript"></script>
|
|
24737
|
-
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.48.4/mode/htmlmixed/htmlmixed.js" type="text/javascript"></script>
|
|
24738
|
-
<script type="text/javascript">
|
|
24739
|
-
|
|
24740
|
-
var source = parent.document.querySelector('textarea[data-source-active]');
|
|
24741
|
-
var selectorOk = source.getAttribute('data-source-ok');
|
|
24742
|
-
var selectorCancel = source.getAttribute('data-source-cancel');
|
|
24743
|
-
|
|
24744
|
-
var html = source.value;
|
|
24745
|
-
var myTextArea = document.querySelector('#code');
|
|
24746
|
-
myTextArea.value = html;
|
|
24747
|
-
|
|
24748
|
-
var htmlEditor = CodeMirror.fromTextArea(myTextArea, {
|
|
24749
|
-
value: html,
|
|
24750
|
-
mode: "htmlmixed",
|
|
24751
|
-
lineWrapping: true,
|
|
24752
|
-
lineNumbers: true,
|
|
24753
|
-
tabMode: "indent",
|
|
24754
|
-
});
|
|
24755
|
-
|
|
24756
|
-
${this.builder.styleDark ? 'htmlEditor.setOption("theme", "blackboard");' : ''}
|
|
24757
|
-
/*
|
|
24758
|
-
${this.builder.styleDark ? 'htmlEditor.setOption("theme", "base16-light");' : ''}
|
|
24759
|
-
|
|
24760
|
-
${this.builder.styleColored ? 'htmlEditor.setOption("theme", "blackboard");' : ''}
|
|
24761
|
-
*/
|
|
24762
|
-
|
|
24763
|
-
htmlEditor.on("change", function (cm, change) {
|
|
24764
|
-
myTextArea.value = cm.getValue();
|
|
24765
|
-
});
|
|
24766
|
-
|
|
24767
|
-
let elm = document.querySelector('.input-ok');
|
|
24768
|
-
elm.addEventListener('click', function(e){
|
|
24769
|
-
|
|
24770
|
-
myTextArea.value = htmlEditor.getValue();
|
|
24771
|
-
|
|
24772
|
-
var html = myTextArea.value;
|
|
24773
|
-
source.value = html;
|
|
24774
|
-
|
|
24775
|
-
source.removeAttribute('data-source-active');
|
|
24776
|
-
source.removeAttribute('data-source-ok');
|
|
24777
|
-
source.removeAttribute('data-source-cancel');
|
|
24778
|
-
|
|
24779
|
-
var modal = parent.document.querySelector('.viewhtmllarger');
|
|
24780
|
-
if(modal.className.indexOf('active')!==-1) {
|
|
24781
|
-
modal.className = modal.className.replace('active', '');
|
|
24782
|
-
} else {
|
|
24783
|
-
modal = parent.document.querySelector('.viewhtmlformatted');
|
|
24784
|
-
modal.className = modal.className.replace('active', '');
|
|
24785
|
-
}
|
|
24786
|
-
|
|
24787
|
-
modal = parent.document.querySelector('.viewhtmlnormal');
|
|
24788
|
-
if(modal.className.indexOf('active')!==-1) {
|
|
24789
|
-
modal.className = modal.className.replace('active', '');
|
|
24790
|
-
}
|
|
24791
|
-
|
|
24792
|
-
parent.document.querySelector(selectorOk).click();
|
|
24793
|
-
});
|
|
24794
|
-
|
|
24795
|
-
elm = document.querySelector('.input-cancel');
|
|
24796
|
-
elm.addEventListener('click', function(e){
|
|
24797
|
-
source.removeAttribute('data-source-active');
|
|
24798
|
-
source.removeAttribute('data-source-ok');
|
|
24799
|
-
source.removeAttribute('data-source-cancel');
|
|
24800
|
-
|
|
24801
|
-
var modal = parent.document.querySelector('.viewhtmllarger');
|
|
24802
|
-
if(modal.className.indexOf('active')!==-1) {
|
|
24803
|
-
modal.className = modal.className.replace('active', '');
|
|
24804
|
-
} else {
|
|
24805
|
-
modal = parent.document.querySelector('.viewhtmlformatted');
|
|
24806
|
-
modal.className = modal.className.replace('active', '');
|
|
24807
|
-
}
|
|
24808
|
-
|
|
24809
|
-
modal = parent.document.querySelector('.viewhtmlnormal');
|
|
24810
|
-
if(modal.className.indexOf('active')!==-1) {
|
|
24811
|
-
modal.className = modal.className.replace('active', '');
|
|
24812
|
-
}
|
|
24813
|
-
|
|
24814
|
-
parent.document.querySelector(selectorCancel).click();
|
|
24815
|
-
});
|
|
24816
|
-
|
|
24817
|
-
</script>
|
|
24818
|
-
|
|
24819
|
-
</body>
|
|
24820
|
-
</html>
|
|
24821
|
-
|
|
24822
|
-
`;
|
|
24823
|
-
}
|
|
24824
|
-
|
|
24825
25260
|
}
|
|
24826
25261
|
|
|
24827
25262
|
const dom$H = new Dom();
|
|
@@ -27138,18 +27573,38 @@ class Grid {
|
|
|
27138
27573
|
removeRow() {
|
|
27139
27574
|
// let builder = this.builder;
|
|
27140
27575
|
// let columnTool = this.columnTool;
|
|
27141
|
-
let util = this.util;
|
|
27142
|
-
|
|
27143
|
-
|
|
27144
|
-
|
|
27576
|
+
let util = this.util; // const cell = util.cellSelected();
|
|
27577
|
+
// if(!cell) return;
|
|
27578
|
+
// const row = cell.parentNode;
|
|
27579
|
+
|
|
27580
|
+
let row;
|
|
27581
|
+
let cell = util.cellSelected();
|
|
27582
|
+
|
|
27583
|
+
if (cell) {
|
|
27584
|
+
row = cell.parentNode;
|
|
27585
|
+
} else {
|
|
27586
|
+
row = util.rowSelected();
|
|
27587
|
+
}
|
|
27588
|
+
|
|
27589
|
+
if (!row) return; //Change to row selection
|
|
27145
27590
|
|
|
27146
27591
|
dom$E.removeClass(row, 'row-outline');
|
|
27147
27592
|
this.columnTool.hide(); //Hide Column tool
|
|
27148
27593
|
|
|
27149
27594
|
util.confirm(util.out('Are you sure you want to delete this block?'), ok => {
|
|
27150
|
-
const cell = util.cellSelected();
|
|
27151
|
-
if
|
|
27152
|
-
const row = cell.parentNode;
|
|
27595
|
+
// const cell = util.cellSelected();
|
|
27596
|
+
// if(!cell) return;
|
|
27597
|
+
// const row = cell.parentNode;
|
|
27598
|
+
let row;
|
|
27599
|
+
let cell = util.cellSelected();
|
|
27600
|
+
|
|
27601
|
+
if (cell) {
|
|
27602
|
+
row = cell.parentNode;
|
|
27603
|
+
} else {
|
|
27604
|
+
row = util.rowSelected();
|
|
27605
|
+
}
|
|
27606
|
+
|
|
27607
|
+
if (!row) return;
|
|
27153
27608
|
|
|
27154
27609
|
if (ok) {
|
|
27155
27610
|
this.builder.uo.saveForUndo();
|
|
@@ -27163,10 +27618,20 @@ class Grid {
|
|
|
27163
27618
|
moveRowUp() {
|
|
27164
27619
|
// let builder = this.builder;
|
|
27165
27620
|
let columnTool = this.columnTool;
|
|
27166
|
-
let util = this.util;
|
|
27167
|
-
|
|
27168
|
-
|
|
27169
|
-
|
|
27621
|
+
let util = this.util; // const cell = util.cellSelected();
|
|
27622
|
+
// if(!cell) return;
|
|
27623
|
+
// let row = cell.parentNode;
|
|
27624
|
+
|
|
27625
|
+
let row;
|
|
27626
|
+
let cell = util.cellSelected();
|
|
27627
|
+
|
|
27628
|
+
if (cell) {
|
|
27629
|
+
row = cell.parentNode;
|
|
27630
|
+
} else {
|
|
27631
|
+
row = util.rowSelected();
|
|
27632
|
+
}
|
|
27633
|
+
|
|
27634
|
+
if (!row) return; //Change to row selection
|
|
27170
27635
|
|
|
27171
27636
|
dom$E.removeClass(row, 'row-outline');
|
|
27172
27637
|
columnTool.hide(); //Hide Column tool
|
|
@@ -27200,10 +27665,20 @@ class Grid {
|
|
|
27200
27665
|
moveRowDown() {
|
|
27201
27666
|
// let builder = this.builder;
|
|
27202
27667
|
let columnTool = this.columnTool;
|
|
27203
|
-
let util = this.util;
|
|
27204
|
-
|
|
27205
|
-
|
|
27206
|
-
|
|
27668
|
+
let util = this.util; // const cell = util.cellSelected();
|
|
27669
|
+
// if(!cell) return;
|
|
27670
|
+
// let row = cell.parentNode;
|
|
27671
|
+
|
|
27672
|
+
let row;
|
|
27673
|
+
let cell = util.cellSelected();
|
|
27674
|
+
|
|
27675
|
+
if (cell) {
|
|
27676
|
+
row = cell.parentNode;
|
|
27677
|
+
} else {
|
|
27678
|
+
row = util.rowSelected();
|
|
27679
|
+
}
|
|
27680
|
+
|
|
27681
|
+
if (!row) return; //Change to row selection
|
|
27207
27682
|
|
|
27208
27683
|
dom$E.removeClass(row, 'row-outline');
|
|
27209
27684
|
columnTool.hide(); //Hide Column tool
|
|
@@ -27237,10 +27712,20 @@ class Grid {
|
|
|
27237
27712
|
duplicateRow() {
|
|
27238
27713
|
let builder = this.builder;
|
|
27239
27714
|
let columnTool = this.columnTool;
|
|
27240
|
-
let util = this.util;
|
|
27241
|
-
|
|
27242
|
-
|
|
27243
|
-
|
|
27715
|
+
let util = this.util; // const cell = util.cellSelected();
|
|
27716
|
+
// if(!cell) return;
|
|
27717
|
+
// let row = cell.parentNode;
|
|
27718
|
+
|
|
27719
|
+
let row;
|
|
27720
|
+
let cell = util.cellSelected();
|
|
27721
|
+
|
|
27722
|
+
if (cell) {
|
|
27723
|
+
row = cell.parentNode;
|
|
27724
|
+
} else {
|
|
27725
|
+
row = util.rowSelected();
|
|
27726
|
+
}
|
|
27727
|
+
|
|
27728
|
+
if (!row) return; //Change to row selection
|
|
27244
27729
|
|
|
27245
27730
|
dom$E.removeClass(row, 'row-outline');
|
|
27246
27731
|
columnTool.hide(); //Hide Column tool
|
|
@@ -58676,8 +59161,6 @@ class ButtonEditor {
|
|
|
58676
59161
|
this.getVisibleBgColor(item, color => {
|
|
58677
59162
|
btnBgColor.style.backgroundColor = color;
|
|
58678
59163
|
activeButton.setAttribute('data-bg', color); //new inline
|
|
58679
|
-
|
|
58680
|
-
activeButton.style.backgroundColor = color; //new inline
|
|
58681
59164
|
});
|
|
58682
59165
|
}
|
|
58683
59166
|
|
|
@@ -58685,7 +59168,6 @@ class ButtonEditor {
|
|
|
58685
59168
|
this.getVisibleTextColor(item, color => {
|
|
58686
59169
|
btnTextColor.style.backgroundColor = color;
|
|
58687
59170
|
currColor = color;
|
|
58688
|
-
activeButton.style.color = color; //new inline
|
|
58689
59171
|
});
|
|
58690
59172
|
}
|
|
58691
59173
|
});
|
|
@@ -58698,7 +59180,8 @@ class ButtonEditor {
|
|
|
58698
59180
|
} // NEW: inline color
|
|
58699
59181
|
|
|
58700
59182
|
|
|
58701
|
-
if (activeButton.style.backgroundColor) btnBgColor.style.backgroundColor = activeButton.style.backgroundColor;
|
|
59183
|
+
if (activeButton.style.backgroundColor) btnBgColor.style.backgroundColor = activeButton.getAttribute('data-bg'); //activeButton.style.backgroundColor;
|
|
59184
|
+
|
|
58702
59185
|
if (activeButton.getAttribute('data-hover-bg')) btnHoverBgColor.style.backgroundColor = activeButton.getAttribute('data-hover-bg');
|
|
58703
59186
|
if (activeButton.style.color) btnTextColor.style.backgroundColor = activeButton.style.color;
|
|
58704
59187
|
let btn;
|
|
@@ -59015,6 +59498,8 @@ class ButtonEditor {
|
|
|
59015
59498
|
link.removeAttribute('data-hover-bgcolor');
|
|
59016
59499
|
link.removeAttribute('data-hover-color');
|
|
59017
59500
|
link.removeAttribute('data-hover-bordercolor');
|
|
59501
|
+
link.setAttribute('onmouseover', 'if(this.getAttribute(\'data-hover-bg\'))this.style.backgroundColor=this.getAttribute(\'data-hover-bg\');');
|
|
59502
|
+
link.setAttribute('onmouseout', 'if(this.getAttribute(\'data-bg\'))this.style.backgroundColor=this.getAttribute(\'data-bg\');else this.style.backgroundColor=\'\'');
|
|
59018
59503
|
}
|
|
59019
59504
|
|
|
59020
59505
|
cleanupOldClasses(link) {
|
|
@@ -60258,74 +60743,16 @@ class Code {
|
|
|
60258
60743
|
let viewhtml;
|
|
60259
60744
|
|
|
60260
60745
|
if (this.builder.opts.htmlSyntaxHighlighting) {
|
|
60261
|
-
viewhtml = this.builderStuff.querySelector('.
|
|
60746
|
+
viewhtml = this.builderStuff.querySelector('.viewhtmlmonaco');
|
|
60262
60747
|
} else {
|
|
60263
60748
|
viewhtml = this.builderStuff.querySelector('.viewhtml');
|
|
60264
60749
|
}
|
|
60265
60750
|
|
|
60266
|
-
viewhtml.querySelector('.is-modal-footer').innerHTML = `<button title="${util.out('Cancel')}" class="input-cancel classic-secondary">${util.out('Cancel')}</button>
|
|
60267
|
-
<button title="${util.out('Ok')}" class="input-ok classic-primary">${util.out('Ok')}</button>`;
|
|
60268
|
-
util.showModal(viewhtml, true);
|
|
60269
60751
|
let textarea = viewhtml.querySelector('textarea');
|
|
60270
60752
|
let beautify = JsBeautify.html;
|
|
60271
60753
|
html = beautify(html);
|
|
60272
60754
|
textarea.value = html;
|
|
60273
|
-
|
|
60274
|
-
dom$u.addEventListener(elm, 'click', () => {
|
|
60275
|
-
//Save for Undo
|
|
60276
|
-
this.builder.uo.saveForUndo();
|
|
60277
|
-
let textarea = viewhtml.querySelector('textarea');
|
|
60278
|
-
var html = textarea.value; //this.builder.renderCustomCodeBlock($block, html);
|
|
60279
|
-
|
|
60280
|
-
codeblock.setAttribute('data-html', encodeURIComponent(html)); // => important
|
|
60281
|
-
|
|
60282
|
-
html = html.replace(/{id}/g, this.util.makeId());
|
|
60283
|
-
|
|
60284
|
-
for (var i = 1; i <= 20; i++) {
|
|
60285
|
-
html = html.replace('[%HTML' + i + '%]', codeblock.getAttribute('data-html-' + i) === undefined ? '' : decodeURIComponent(codeblock.getAttribute('data-html-' + i))); //render editable area
|
|
60286
|
-
} //codeblock.innerHTML = html;
|
|
60287
|
-
|
|
60288
|
-
|
|
60289
|
-
codeblock.innerHTML = ''; // Use createContextualFragment() to make embedded script executable
|
|
60290
|
-
// https://ghinda.net/article/script-tags/
|
|
60291
|
-
|
|
60292
|
-
var range = document.createRange();
|
|
60293
|
-
range.setStart(codeblock, 0);
|
|
60294
|
-
codeblock.appendChild(range.createContextualFragment(html));
|
|
60295
|
-
let builderActive = document.querySelector('.builder-active');
|
|
60296
|
-
if (builderActive) this.builder.applyBehaviorOn(builderActive); //Trigger Change event
|
|
60297
|
-
|
|
60298
|
-
this.builder.opts.onChange(); //Trigger Render event
|
|
60299
|
-
|
|
60300
|
-
this.builder.opts.onRender();
|
|
60301
|
-
util.hideModal(viewhtml);
|
|
60302
|
-
util.hideControls();
|
|
60303
|
-
});
|
|
60304
|
-
elm = viewhtml.querySelector('.input-cancel');
|
|
60305
|
-
dom$u.addEventListener(elm, 'click', () => {
|
|
60306
|
-
util.hideModal(viewhtml);
|
|
60307
|
-
});
|
|
60308
|
-
|
|
60309
|
-
if (this.builder.opts.htmlSyntaxHighlighting) {
|
|
60310
|
-
let textarea = viewhtml.querySelector('textarea'); // Used by html dialog (syntaxhighlighting)
|
|
60311
|
-
// let elms = document.querySelectorAll('[data-source-active]');
|
|
60312
|
-
// Array.prototype.forEach.call(elms, (elm) => {
|
|
60313
|
-
// elm.removeAttribute('data-source-active');
|
|
60314
|
-
// elm.removeAttribute('data-source-ok');
|
|
60315
|
-
// elm.removeAttribute('data-source-cancel');
|
|
60316
|
-
// });
|
|
60317
|
-
|
|
60318
|
-
textarea.setAttribute('data-source-active', '1');
|
|
60319
|
-
textarea.setAttribute('data-source-ok', '.viewhtmlformatted .input-ok');
|
|
60320
|
-
textarea.setAttribute('data-source-cancel', '.viewhtmlformatted .input-cancel');
|
|
60321
|
-
let iframe = viewhtml.querySelector('iframe');
|
|
60322
|
-
iframe.outerHTML = '<iframe id="ifrHtmlFormatted" style="width:100%;height:100%;border: none;" src="about:blank"></iframe>'; //clear
|
|
60323
|
-
|
|
60324
|
-
var doc = viewhtml.querySelector('iframe').contentWindow.document;
|
|
60325
|
-
doc.open();
|
|
60326
|
-
doc.write(this.htmlUtil.getIframeHtml());
|
|
60327
|
-
doc.close();
|
|
60328
|
-
}
|
|
60755
|
+
this.htmlUtil.view('code');
|
|
60329
60756
|
});
|
|
60330
60757
|
}
|
|
60331
60758
|
|
|
@@ -61634,8 +62061,18 @@ class RowTool {
|
|
|
61634
62061
|
});
|
|
61635
62062
|
elm = rowMore.querySelector('.row-html');
|
|
61636
62063
|
if (elm) dom$o.addEventListener(elm, 'click', () => {
|
|
61637
|
-
const cell = util.cellSelected();
|
|
61638
|
-
if
|
|
62064
|
+
// const cell = util.cellSelected();
|
|
62065
|
+
// if(!cell) return;
|
|
62066
|
+
let row;
|
|
62067
|
+
let cell = util.cellSelected();
|
|
62068
|
+
|
|
62069
|
+
if (cell) {
|
|
62070
|
+
row = cell.parentNode;
|
|
62071
|
+
} else {
|
|
62072
|
+
row = util.rowSelected();
|
|
62073
|
+
}
|
|
62074
|
+
|
|
62075
|
+
if (!row) return;
|
|
61639
62076
|
htmlutil.view('row');
|
|
61640
62077
|
});
|
|
61641
62078
|
}
|
|
@@ -61724,9 +62161,16 @@ class RowTool {
|
|
|
61724
62161
|
});
|
|
61725
62162
|
elm = rowtool.querySelector('.row-more');
|
|
61726
62163
|
if (elm) dom$o.addEventListener(elm, 'click', () => {
|
|
62164
|
+
let row;
|
|
61727
62165
|
let cell = util.cellSelected();
|
|
61728
|
-
|
|
61729
|
-
|
|
62166
|
+
|
|
62167
|
+
if (cell) {
|
|
62168
|
+
row = cell.parentNode;
|
|
62169
|
+
} else {
|
|
62170
|
+
row = util.rowSelected();
|
|
62171
|
+
}
|
|
62172
|
+
|
|
62173
|
+
if (!row) return; //Change to row selection
|
|
61730
62174
|
|
|
61731
62175
|
dom$o.removeClass(row, 'row-outline'); //Hide Column tool
|
|
61732
62176
|
|
|
@@ -61759,7 +62203,7 @@ class RowTool {
|
|
|
61759
62203
|
let btnRowHtml = rowMore.querySelector('.row-html');
|
|
61760
62204
|
let btnRowDuplicate = rowMore.querySelector('.row-duplicate');
|
|
61761
62205
|
|
|
61762
|
-
if (
|
|
62206
|
+
if (row.querySelector('[data-html]')) {
|
|
61763
62207
|
if (btnRowHtml) btnRowHtml.style.display = 'none';
|
|
61764
62208
|
if (btnRowDuplicate) btnRowDuplicate.style.display = 'none';
|
|
61765
62209
|
} else {
|
|
@@ -78084,12 +78528,7 @@ class ContentBuilder {
|
|
|
78084
78528
|
|
|
78085
78529
|
viewHtmlNormal() {
|
|
78086
78530
|
const htmlutil = new HtmlUtil(this);
|
|
78087
|
-
htmlutil.
|
|
78088
|
-
}
|
|
78089
|
-
|
|
78090
|
-
viewHtmlLarger() {
|
|
78091
|
-
const htmlutil = new HtmlUtil(this);
|
|
78092
|
-
htmlutil.viewHtmlLarger();
|
|
78531
|
+
htmlutil.viewHtmlExternal();
|
|
78093
78532
|
}
|
|
78094
78533
|
|
|
78095
78534
|
readHtml(content, view, multiple) {
|