Remove the old form editor
[MAILPOET-2625]
This commit is contained in:
committed by
Jack Kitterhing
parent
ec42ef4eeb
commit
fe84b9f9fb
@ -1,647 +0,0 @@
|
|||||||
@import '../../../../node_modules/codemirror/lib/codemirror';
|
|
||||||
@import '../../../../node_modules/codemirror/theme/neo';
|
|
||||||
|
|
||||||
$icons: '../../img/form_editor_icons.png';
|
|
||||||
$handle_icon: '../../img/handle.png';
|
|
||||||
|
|
||||||
#mailpoet_form_name {
|
|
||||||
font-size: 23px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_history {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_editor {
|
|
||||||
background-color: #fff;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
box-shadow: 0 0 5px rgba(0, 0, 0, .2), inset 0 0 20px rgba(0, 0, 0, .1);
|
|
||||||
padding: 20px;
|
|
||||||
position: relative;
|
|
||||||
width: 300px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_editor:before,
|
|
||||||
#mailpoet_form_editor:after {
|
|
||||||
background: transparent;
|
|
||||||
bottom: 12px;
|
|
||||||
box-shadow: 0 6px 12px rgba(0, 0, 0, .3);
|
|
||||||
content: ' ';
|
|
||||||
height: 10px;
|
|
||||||
left: 12px;
|
|
||||||
position: absolute;
|
|
||||||
transform: skew(-5deg) rotate(-5deg);
|
|
||||||
width: 40%;
|
|
||||||
z-index: -1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_editor:after {
|
|
||||||
left: auto;
|
|
||||||
right: 12px;
|
|
||||||
transform: skew(5deg) rotate(5deg);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Warnings in blocks */
|
|
||||||
.mailpoet_warning {
|
|
||||||
color: #900;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.block_placeholder {
|
|
||||||
border: 0 none;
|
|
||||||
font-weight: bold;
|
|
||||||
height: 0;
|
|
||||||
line-height: 30px;
|
|
||||||
margin: 0 auto;
|
|
||||||
overflow: hidden;
|
|
||||||
text-align: center;
|
|
||||||
text-indent: -9999px;
|
|
||||||
width: 298px;
|
|
||||||
z-index: 9500;
|
|
||||||
}
|
|
||||||
|
|
||||||
.block_placeholder.active {
|
|
||||||
/* border:1px dashed #dfdfdf; */
|
|
||||||
/* background-color:#f5f5f5; */
|
|
||||||
background-color: #4cb7e1;
|
|
||||||
display: block;
|
|
||||||
height: 30px;
|
|
||||||
overflow: auto;
|
|
||||||
text-indent: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.block_placeholder.hover {
|
|
||||||
background-color: #0074a2;
|
|
||||||
border-color: #0074a2;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Widget: checkbox, radio */
|
|
||||||
.mailpoet_radio,
|
|
||||||
.mailpoet_checkbox {
|
|
||||||
margin: -2px 5px 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* MailPoet Form wrapper */
|
|
||||||
#mailpoet_form_wrapper {
|
|
||||||
margin: 20px 0 0;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* MailPoet Form container */
|
|
||||||
#mailpoet_form_container {
|
|
||||||
margin: 0;
|
|
||||||
width: 340px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_editor.loading,
|
|
||||||
#mailpoet_form_toolbar.loading {
|
|
||||||
background: url('loading.gif') no-repeat center center #fcfcfc;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar.loading {
|
|
||||||
border: 1px solid #dfdfdf;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar.loading #mailpoet_toolbar_fields {
|
|
||||||
visibility: hidden;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Tabs : content/images/styles/themes */
|
|
||||||
#wysija-add-field {
|
|
||||||
float: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar {
|
|
||||||
position: absolute;
|
|
||||||
width: 400px;
|
|
||||||
z-index: 999;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar .mailpoet_form_toolbar_tabs {
|
|
||||||
border-bottom: 1px solid #dfdfdf;
|
|
||||||
line-height: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar .add_custom_field {
|
|
||||||
padding: 15px 0 5px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar .mailpoet_form_toolbar_tabs li,
|
|
||||||
#mailpoet_form_toolbar .mailpoet_form_toolbar_tabs a {
|
|
||||||
display: inline-block;
|
|
||||||
*display: inline;
|
|
||||||
*float: left;
|
|
||||||
height: 30px;
|
|
||||||
line-height: 30px;
|
|
||||||
margin: 0;
|
|
||||||
outline: 0 none;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar .mailpoet_form_toolbar_tabs li {
|
|
||||||
margin: 0 0 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar .mailpoet_form_toolbar_tabs a {
|
|
||||||
background: linear-gradient(center top, #f9f9f9, #f5f5f5);
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
border: 1px solid #dfdfdf;
|
|
||||||
border-radius: 3px 3px 0 0;
|
|
||||||
box-shadow: 0 1px 0 #fff inset;
|
|
||||||
color: #a6a6a6;
|
|
||||||
font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;
|
|
||||||
outline: 0 none;
|
|
||||||
padding: 0 7px;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar .mailpoet_form_toolbar_tabs a:hover {
|
|
||||||
background-color: #eee;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar .mailpoet_form_toolbar_tabs a.selected {
|
|
||||||
background: #fcfcfc;
|
|
||||||
border-bottom: 0 none;
|
|
||||||
color: #000;
|
|
||||||
filter: none;
|
|
||||||
padding-bottom: 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar .mailpoet_form_toolbar_tabs .last a,
|
|
||||||
.wysija_params {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar .mailpoet_form_toolbar_tabs,
|
|
||||||
#mailpoet_form_toolbar #mailpoet_toolbar_fields {
|
|
||||||
margin: 0;
|
|
||||||
position: relative;
|
|
||||||
z-index: 9998;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* edit form name */
|
|
||||||
#mailpoet_form_name_input {
|
|
||||||
vertical-align: bottom;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* wysija widgets */
|
|
||||||
.mailpoet_form_widget {
|
|
||||||
height: 25px;
|
|
||||||
line-height: 25px;
|
|
||||||
width: 298px;
|
|
||||||
z-index: 9999 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_toolbar_section {
|
|
||||||
background: none repeat scroll 0 0 #fff;
|
|
||||||
border: 1px solid #e5e5e5;
|
|
||||||
box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
|
|
||||||
cursor: pointer;
|
|
||||||
margin-bottom: 0;
|
|
||||||
max-height: 2000px;
|
|
||||||
min-width: 255px;
|
|
||||||
overflow: hidden;
|
|
||||||
position: relative;
|
|
||||||
transition: max-height .5s ease-in-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_toolbar_section > div {
|
|
||||||
height: 100%;
|
|
||||||
min-width: 255px;
|
|
||||||
overflow: auto;
|
|
||||||
padding: 10px 20px 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_toolbar_section h3 {
|
|
||||||
margin: 10px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_toolbar_section.closed {
|
|
||||||
max-height: 38px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_toolbar_section .mailpoet_toggle {
|
|
||||||
height: 38px;
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
width: 27px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_toolbar_section .mailpoet_toggle:focus {
|
|
||||||
box-shadow: none !important;
|
|
||||||
outline: 0 none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_toolbar_section .mailpoet_toggle:before {
|
|
||||||
content: '\f142';
|
|
||||||
display: inline-block;
|
|
||||||
font: 400 20px / 1 dashicons;
|
|
||||||
padding: 8px 10px;
|
|
||||||
position: relative;
|
|
||||||
right: 12px;
|
|
||||||
speak: none;
|
|
||||||
text-decoration: none !important;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_toolbar_section.closed .mailpoet_toggle:before {
|
|
||||||
content: '\f140';
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_styles {
|
|
||||||
margin: 10px;
|
|
||||||
max-width: 318px;
|
|
||||||
min-height: 300px;
|
|
||||||
resize: vertical;
|
|
||||||
width: 318px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar a.mailpoet_form_field,
|
|
||||||
.mailpoet_form_widget {
|
|
||||||
background: linear-gradient(center 0, #f9f9f9, #ececec);
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
border: 1px solid #dfdfdf;
|
|
||||||
border-radius: 3px;
|
|
||||||
box-shadow: 0 1px 0 #fff inset;
|
|
||||||
color: #222;
|
|
||||||
cursor: move;
|
|
||||||
display: block;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: bold;
|
|
||||||
height: 25px;
|
|
||||||
line-height: 25px;
|
|
||||||
padding: 0 7px;
|
|
||||||
text-shadow: 0 1px 0 #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_form_toolbar a.mailpoet_form_field.disabled {
|
|
||||||
color: #ccc;
|
|
||||||
cursor: pointer;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_field_edit {
|
|
||||||
bottom: 13px;
|
|
||||||
position: absolute;
|
|
||||||
right: 27px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_field_delete {
|
|
||||||
bottom: 13px;
|
|
||||||
position: absolute;
|
|
||||||
right: 7px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* toolbar: fields */
|
|
||||||
#mailpoet_toolbar_fields li {
|
|
||||||
padding: 0 0 10px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_toolbar_fields li.notice {
|
|
||||||
background: none !important;
|
|
||||||
border: 0 none !important;
|
|
||||||
font-size: 11px;
|
|
||||||
font-style: italic;
|
|
||||||
margin: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* blocks */
|
|
||||||
.mailpoet_form_block {
|
|
||||||
background-color: #fff;
|
|
||||||
border: 0 none;
|
|
||||||
display: inline-table;
|
|
||||||
display: block;
|
|
||||||
height: 1%;
|
|
||||||
margin: 0;
|
|
||||||
padding: 10px 18px;
|
|
||||||
position: relative;
|
|
||||||
z-index: 98;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block.highlighted {
|
|
||||||
border: 1px solid #5897fb;
|
|
||||||
padding: 9px 17px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block img {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Widget styles */
|
|
||||||
.mailpoet_form_block p {
|
|
||||||
margin: 5px 0;
|
|
||||||
word-wrap: break-word;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block.dragging {
|
|
||||||
pointer-events: none;
|
|
||||||
z-index: 99000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block:after {
|
|
||||||
clear: both;
|
|
||||||
content: '.';
|
|
||||||
display: block;
|
|
||||||
height: 0;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block.hover {
|
|
||||||
border: 1px dashed #bbb;
|
|
||||||
margin: 0;
|
|
||||||
padding: 9px 17px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block.static {
|
|
||||||
background-color: #999;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* controls */
|
|
||||||
.mailpoet_form_block .wysija_controls {
|
|
||||||
background: linear-gradient(center 0, #eee, #bbb);
|
|
||||||
background-color: #dfdfdf;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
border-radius: 2px;
|
|
||||||
height: 20px;
|
|
||||||
left: -1px;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
top: -22px;
|
|
||||||
width: 298px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block .wysija_controls li {
|
|
||||||
float: left;
|
|
||||||
height: 20px;
|
|
||||||
width: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block .wysija_controls a {
|
|
||||||
color: #000;
|
|
||||||
cursor: pointer;
|
|
||||||
float: left;
|
|
||||||
font-size: 120%;
|
|
||||||
font-weight: bold;
|
|
||||||
height: 20px;
|
|
||||||
line-height: 20px;
|
|
||||||
text-align: center;
|
|
||||||
width: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block .wysija_controls a.remove {
|
|
||||||
margin: 0 0 0 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block .handle_container,
|
|
||||||
.mailpoet_form_block .handle_container a {
|
|
||||||
float: none;
|
|
||||||
width: 40px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_block .handle_container {
|
|
||||||
left: 140px;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* controls & icons */
|
|
||||||
.wysija_controls a span,
|
|
||||||
.wysija_gallery .wysija_tools a span,
|
|
||||||
.wysija_image .wysija_tools a span,
|
|
||||||
.wysija_text .wysija_tools a span,
|
|
||||||
#mailpoet_toolbar_fields a span {
|
|
||||||
display: block;
|
|
||||||
height: 20px;
|
|
||||||
width: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* toolbar: full width button */
|
|
||||||
/* color picker in control bars */
|
|
||||||
.wysija_controls span input {
|
|
||||||
color: transparent;
|
|
||||||
margin: 2px 0 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* left alignment button */
|
|
||||||
.alignment-left span {
|
|
||||||
background: url($icons) no-repeat 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.alignment-left.active span,
|
|
||||||
.alignment-left:hover span {
|
|
||||||
background: url($icons) no-repeat 0 -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* center alignment button */
|
|
||||||
.alignment-center span {
|
|
||||||
background: url($icons) no-repeat -20px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.alignment-center.active span,
|
|
||||||
.alignment-center:hover span {
|
|
||||||
background: url($icons) no-repeat -20px -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* right alignment button */
|
|
||||||
.alignment-right span {
|
|
||||||
background: url($icons) no-repeat -40px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.alignment-right.active span,
|
|
||||||
.alignment-right:hover span {
|
|
||||||
background: url($icons) no-repeat -40px -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* linking */
|
|
||||||
.add-link span {
|
|
||||||
background: url($icons) no-repeat -60px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.add-link.active span,
|
|
||||||
.add-link:hover span {
|
|
||||||
background: url($icons) no-repeat -60px -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.remove-link span {
|
|
||||||
background: url($icons) no-repeat -80px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.remove-link.active span,
|
|
||||||
.remove-link:hover span {
|
|
||||||
background: url($icons) no-repeat -80px -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* block controls */
|
|
||||||
.remove span,
|
|
||||||
.delete span {
|
|
||||||
background: url($icons) no-repeat -100px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.remove.active span,
|
|
||||||
.remove:hover span,
|
|
||||||
.delete.active span,
|
|
||||||
.delete:hover span {
|
|
||||||
background: url($icons) no-repeat -100px -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.handle span {
|
|
||||||
background: url($handle_icon) no-repeat;
|
|
||||||
cursor: move;
|
|
||||||
width: 40px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.duplicate span {
|
|
||||||
background: url($icons) no-repeat -140px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.duplicate.active span,
|
|
||||||
.duplicate:hover span {
|
|
||||||
background: url($icons) no-repeat -140px -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.settings span {
|
|
||||||
background: url($icons) no-repeat -160px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.settings.active span,
|
|
||||||
.settings:hover span {
|
|
||||||
background: url($icons) no-repeat -160px -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-plus span {
|
|
||||||
background: url($icons) no-repeat -200px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-plus.active span,
|
|
||||||
.icon-plus:hover span {
|
|
||||||
background: url($icons) no-repeat -200px -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-minus span {
|
|
||||||
background: url($icons) no-repeat -220px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-minus.active span,
|
|
||||||
.icon-minus:hover span {
|
|
||||||
background: url($icons) no-repeat -220px -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* wysija options */
|
|
||||||
.wysija_options {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* wysija block settings */
|
|
||||||
.wysija_settings {
|
|
||||||
position: absolute;
|
|
||||||
z-index: 1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.wysija_settings a {
|
|
||||||
background: linear-gradient(center 0, #f9f9f9, #ececec);
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
border: 1px solid #dfdfdf;
|
|
||||||
border-radius: 3px;
|
|
||||||
box-shadow: 0 1px 0 #fff inset;
|
|
||||||
color: #222;
|
|
||||||
cursor: pointer;
|
|
||||||
display: block;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: normal;
|
|
||||||
padding: 5px 5px 3px 27px;
|
|
||||||
text-decoration: none;
|
|
||||||
text-shadow: 0 1px 0 #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.wysija_settings a span {
|
|
||||||
height: 20px;
|
|
||||||
left: 5px;
|
|
||||||
position: absolute;
|
|
||||||
top: 3px;
|
|
||||||
width: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* labels */
|
|
||||||
.mailpoet_form_block label {
|
|
||||||
display: block;
|
|
||||||
margin: 0 5px 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* form settings: success message */
|
|
||||||
#mailpoet_on_success textarea,
|
|
||||||
#mailpoet_on_success select {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mailpoet_on_success textarea {
|
|
||||||
height: 50px;
|
|
||||||
min-height: 50px;
|
|
||||||
resize: vertical;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* make sure textareas within the form editor are not resizeable */
|
|
||||||
.mailpoet_form_block textarea {
|
|
||||||
resize: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* remove click events from inputs within form editor */
|
|
||||||
.mailpoet_form_block input,
|
|
||||||
.mailpoet_form_block textarea {
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* form export */
|
|
||||||
#mailpoet_form_export textarea {
|
|
||||||
display: none;
|
|
||||||
font-size: 85%;
|
|
||||||
height: 150px;
|
|
||||||
min-height: 150px;
|
|
||||||
resize: vertical;
|
|
||||||
width: 340px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Styling for WP 3.8 and higher */
|
|
||||||
.mailpoet_form_field_edit,
|
|
||||||
.mailpoet_form_field_delete {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_field_edit:hover .dashicons-admin-generic:before,
|
|
||||||
.mailpoet_form_field_delete:hover .dashicons-dismiss:before,
|
|
||||||
.settings:hover .dashicons-admin-generic:before {
|
|
||||||
color: #2ea2cc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_field_edit span,
|
|
||||||
.mailpoet_form_field_delete span {
|
|
||||||
background: none !important;
|
|
||||||
color: #999;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_field_delete span:before {
|
|
||||||
font-size: 21px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Code Mirror */
|
|
||||||
.CodeMirror {
|
|
||||||
border: 1px solid #eee;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Settings */
|
|
||||||
#mailpoet_form_segments.parsley-error + span .select2-selection {
|
|
||||||
border: 1px solid #b94a48;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_field_settings_text {
|
|
||||||
min-height: 100px;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
@ -85,9 +85,3 @@ $gutenberg-control-border-color-focus: #007cba;
|
|||||||
margin: 8px 0;
|
margin: 8px 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Styles for old editor link
|
|
||||||
.mailpoet_old_form_editor_link,
|
|
||||||
#mailpoet_form_edit_old_editor_fallback_link {
|
|
||||||
padding: 16px;
|
|
||||||
}
|
|
||||||
|
@ -9,7 +9,6 @@
|
|||||||
@import 'components/common';
|
@import 'components/common';
|
||||||
@import 'components/modal';
|
@import 'components/modal';
|
||||||
@import 'components/notice';
|
@import 'components/notice';
|
||||||
@import 'components/formEditorLegacy';
|
|
||||||
@import 'components/listing';
|
@import 'components/listing';
|
||||||
@import 'components/listing/newsletters';
|
@import 'components/listing/newsletters';
|
||||||
@import 'components/box';
|
@import 'components/box';
|
||||||
|
12
assets/js/lib/prototype.min.js
vendored
12
assets/js/lib/prototype.min.js
vendored
File diff suppressed because one or more lines are too long
2
assets/js/lib/scriptaculous.min.js
vendored
2
assets/js/lib/scriptaculous.min.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@ -1,9 +0,0 @@
|
|||||||
// Initialize Editor dependencies that have side effect (meaning they
|
|
||||||
// not only define module but also modify/register something on load).
|
|
||||||
|
|
||||||
// This is to avoid undefined import order & messy WebPack config.
|
|
||||||
// Code can be gradually refactored to avoid side effects completely.
|
|
||||||
|
|
||||||
import 'form_editor_legacy/form_editor.js'; // side effect - calls document.observe()
|
|
||||||
import 'codemirror'; // side effect - has to be loaded here, used in 'editor.html'
|
|
||||||
import 'codemirror/mode/css/css'; // side effect - has to be loaded here, used in 'editor.html'
|
|
@ -63,12 +63,6 @@ class FormEditor {
|
|||||||
'custom_fields' => $this->customFieldsResponseBuilder->buildBatch($customFields),
|
'custom_fields' => $this->customFieldsResponseBuilder->buildBatch($customFields),
|
||||||
];
|
];
|
||||||
|
|
||||||
if (isset($_GET['legacy']) && (int)$_GET['legacy']) {
|
$this->pageRenderer->displayPage('form/editor.html', $data);
|
||||||
$data['date_types'] = $dateTypes;
|
|
||||||
$this->pageRenderer->displayPage('form/editor_legacy.html', $data);
|
|
||||||
} else {
|
|
||||||
$this->pageRenderer->displayPage('form/editor.html', $data);
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,752 +0,0 @@
|
|||||||
<% extends 'layout.html' %>
|
|
||||||
|
|
||||||
<% block title %>
|
|
||||||
<h1 class="title">
|
|
||||||
<%= __('Form') %>
|
|
||||||
<a class="page-title-action" href="?page=mailpoet-forms#/" data-automation-id="mailpoet_form_go_back"><%= __('Back') %></a>
|
|
||||||
</h1>
|
|
||||||
<h2>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
placeholder="<%= __('Click here to change the name') %>"
|
|
||||||
id="mailpoet_form_name"
|
|
||||||
data-automation-id="mailpoet_form_name_input"
|
|
||||||
value="<%= form.name %>"
|
|
||||||
/>
|
|
||||||
</h2>
|
|
||||||
<% endblock %>
|
|
||||||
|
|
||||||
<% block content %>
|
|
||||||
<div id="mailpoet_form_wrapper" class="clearfix">
|
|
||||||
<!-- Form Editor Container -->
|
|
||||||
<div id="mailpoet_form_container">
|
|
||||||
<!-- Form Editor -->
|
|
||||||
<div id="mailpoet_form_editor">
|
|
||||||
<div id="mailpoet_form_body"></div>
|
|
||||||
<p id="block_placeholder" class="block_placeholder"></p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="submit">
|
|
||||||
<a
|
|
||||||
id="mailpoet_form_save"
|
|
||||||
href="javascript:;"
|
|
||||||
class="button button-primary"
|
|
||||||
data-automation-id="save_form"
|
|
||||||
><%= __('Save') %></a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Form Editor: Toolbar -->
|
|
||||||
<div id="mailpoet_form_toolbar" style="visibility:hidden;">
|
|
||||||
<div class="mailpoet_toolbar_section closed" data-section="settings">
|
|
||||||
<a href="javascript:;" class="mailpoet_toggle"><br /></a>
|
|
||||||
<h3><%= __('Settings') %></h3>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<!-- Form settings -->
|
|
||||||
<form id="mailpoet_form_settings" action="" method="POST">
|
|
||||||
<input
|
|
||||||
type="hidden"
|
|
||||||
id="mailpoet_form_id"
|
|
||||||
value="<%= form.id | default(0) %>"
|
|
||||||
/>
|
|
||||||
<div id="mailpoet_settings_segment_selection">
|
|
||||||
<!-- Form settings: list selection -->
|
|
||||||
<p>
|
|
||||||
<strong><%= __('This form adds the subscribers to these lists:') %></strong>
|
|
||||||
</p>
|
|
||||||
<select
|
|
||||||
id="mailpoet_form_segments"
|
|
||||||
name="segments"
|
|
||||||
data-placeholder="<%= __('Please select a list') %>"
|
|
||||||
multiple
|
|
||||||
data-parsley-required-message="<%= __('Please select a list.') %>"
|
|
||||||
required
|
|
||||||
>
|
|
||||||
<% for segment in segments %>
|
|
||||||
<option value="<%= segment.id %>"><%= segment.name %> (<%= segment.subscribers %>)</option>
|
|
||||||
<% endfor %>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="mailpoet_on_success">
|
|
||||||
<!-- Form settings: after submit -->
|
|
||||||
<p>
|
|
||||||
<label><strong><%= __('After submit...') %></strong></label>
|
|
||||||
<label>
|
|
||||||
<input class="mailpoet_radio"
|
|
||||||
type="radio"
|
|
||||||
name="on_success"
|
|
||||||
value="message"
|
|
||||||
<% if(form.settings.on_success is empty or form.settings.on_success == 'message') %>
|
|
||||||
checked="checked"
|
|
||||||
<% endif %>
|
|
||||||
/><%= __('Show message') %>
|
|
||||||
</label>
|
|
||||||
|
|
||||||
<label>
|
|
||||||
<input class="mailpoet_radio"
|
|
||||||
type="radio"
|
|
||||||
name="on_success"
|
|
||||||
value="page"
|
|
||||||
<% if(form.settings.on_success == 'page') %>
|
|
||||||
checked="checked"
|
|
||||||
<% endif %>
|
|
||||||
/><%= __('Go to Page') %>
|
|
||||||
</label>
|
|
||||||
</p>
|
|
||||||
<!-- default success message -->
|
|
||||||
<% if form.settings.success_message %>
|
|
||||||
<% set success_message = form.settings.success_message %>
|
|
||||||
<% else %>
|
|
||||||
<% set success_message = __('Check your inbox to confirm your subscription.') %>
|
|
||||||
<% endif %>
|
|
||||||
|
|
||||||
<p
|
|
||||||
id="mailpoet_on_success_message"
|
|
||||||
class="mailpoet_on_success_option"
|
|
||||||
>
|
|
||||||
<textarea name="success_message"><%= success_message %></textarea>
|
|
||||||
</p>
|
|
||||||
<p
|
|
||||||
id="mailpoet_on_success_page"
|
|
||||||
class="mailpoet_on_success_option"
|
|
||||||
>
|
|
||||||
<select name="success_page">
|
|
||||||
<% for page in pages %>
|
|
||||||
<option value="<%= page.id %>"
|
|
||||||
<%- if form.settings.success_page == page.id %>
|
|
||||||
<%=- ' selected="selected"' %>
|
|
||||||
<%- endif %>><%= page.title %></option>
|
|
||||||
<% endfor %>
|
|
||||||
</select>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Toolbar: Shortcodes / Export -->
|
|
||||||
<div class="mailpoet_toolbar_section closed" data-section="shortcodes">
|
|
||||||
<a href="javascript:;" class="mailpoet_toggle"><br /></a>
|
|
||||||
<h3><%= __('Form Placement') %></h3>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<!-- Form export links -->
|
|
||||||
<p>
|
|
||||||
<%= __('Add this form to your sidebar or footer on the [link]Widgets page[/link].')
|
|
||||||
|replaceLinkTags('widgets.php', {'target': '_blank'})
|
|
||||||
|raw
|
|
||||||
%>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= __('Copy and paste this [link]shortcode[/link] on to a post or page.')
|
|
||||||
|replaceLinkTags('javascript:;', {'class': 'mailpoet_form_export_toggle', 'data-type': 'shortcode'})
|
|
||||||
|raw
|
|
||||||
%>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= __('%sPHP%s and %siFrame%s versions are also available.')
|
|
||||||
|format(
|
|
||||||
'<a href="javascript:;" class="mailpoet_form_export_toggle" data-type="php">',
|
|
||||||
'</a>',
|
|
||||||
'<a href="javascript:;" class="mailpoet_form_export_toggle" data-type="iframe">',
|
|
||||||
'</a>'
|
|
||||||
)
|
|
||||||
|raw
|
|
||||||
%>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<!-- Form export -->
|
|
||||||
<div id="mailpoet_form_export"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Toolbar: Fields -->
|
|
||||||
<div class="mailpoet_toolbar_section closed" data-section="fields">
|
|
||||||
<a href="javascript:;" class="mailpoet_toggle"><br /></a>
|
|
||||||
<h3><%= __('Fields') %></h3>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<ul id="mailpoet_toolbar_fields">
|
|
||||||
</ul>
|
|
||||||
<p class="mailpoet_align_center">
|
|
||||||
<a id="mailpoet_form_add_field" class="button button-primary" href="javascript:;" style="width:100%;"><%= __('Add New Field') %></a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Toolbar: Styles -->
|
|
||||||
<div class="mailpoet_toolbar_section closed" data-section="styles">
|
|
||||||
<a href="javascript:;" class="mailpoet_toggle"><br /></a>
|
|
||||||
<h3><%= __('Styles') %></h3>
|
|
||||||
<div>
|
|
||||||
<textarea id="mailpoet_form_styles"><%= styles %></textarea>
|
|
||||||
<br />
|
|
||||||
<p class="mailpoet_align_center">
|
|
||||||
<a
|
|
||||||
id="mailpoet_form_preview"
|
|
||||||
href="javascript:;"
|
|
||||||
class="button button-primary"
|
|
||||||
style="width:100%;"
|
|
||||||
><%= __('Preview') %></a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="help">
|
|
||||||
<%= __('<strong>Tip:</strong> read our [link]GDPR guide[/link] to make sure your form follows the privacy directive of the European Union.')
|
|
||||||
|replaceLinkTags('https://kb.mailpoet.com/article/246-guide-to-conform-to-gdpr?utm_source=plugin&utm_medium=formeditor&utm_campaign=helpdocs', {'target': '_blank', id: 'mailpoet_helper_link', 'data-beacon-article': '5a9e8cdd04286374f7089a8c'})
|
|
||||||
|raw
|
|
||||||
%>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<!-- End | Form Editor: Toolbar -->
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Form Editor: History -->
|
|
||||||
<div id="mailpoet_form_history"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<%= javascript(
|
|
||||||
'lib/prototype.min.js',
|
|
||||||
'lib/scriptaculous.min.js',
|
|
||||||
'form_editor_legacy.js'
|
|
||||||
)%>
|
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
function encodeHtmlValue(str) {
|
|
||||||
return str.replace(/&/g, '&').replace(/>/g, '>').replace(/</g, '<').replace(/"/g, '"');
|
|
||||||
}
|
|
||||||
var mailpoet_segments = <%= json_encode(segments) %>;
|
|
||||||
|
|
||||||
var mailpoet_default_fields = [
|
|
||||||
{
|
|
||||||
id: 'divider',
|
|
||||||
name: "<%= __('Divider') %>",
|
|
||||||
type: 'divider',
|
|
||||||
multiple: true,
|
|
||||||
readonly: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "first_name",
|
|
||||||
name: "<%= __('First name') %>",
|
|
||||||
type: 'text',
|
|
||||||
params: {
|
|
||||||
label: "<%= __('First name') %>"
|
|
||||||
},
|
|
||||||
readonly: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "last_name",
|
|
||||||
name: "<%= __('Last name') %>",
|
|
||||||
type: 'text',
|
|
||||||
params: {
|
|
||||||
label: "<%= __('Last name') %>"
|
|
||||||
},
|
|
||||||
readonly: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "segments",
|
|
||||||
name: "<%= __('List selection') %>",
|
|
||||||
type: 'segment',
|
|
||||||
params: {
|
|
||||||
label: "<%= __('Select list(s):') %>"
|
|
||||||
},
|
|
||||||
readonly: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 'html',
|
|
||||||
name: "<%= __('Custom text or HTML') %>",
|
|
||||||
type: 'html',
|
|
||||||
params: {
|
|
||||||
text: "<%= __('Subscribe to our newsletter and join [mailpoet_subscribers_count] other subscribers.') %>"
|
|
||||||
},
|
|
||||||
multiple: true,
|
|
||||||
readonly: true
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
jQuery(function($) {
|
|
||||||
function mailpoet_form_toggle_segments() {
|
|
||||||
// hide list selection if a list widget has been dragged into the editor
|
|
||||||
$('mailpoet_settings_segment_selection')[
|
|
||||||
(WysijaForm.hasSegmentSelection())
|
|
||||||
? 'hide' : 'show'
|
|
||||||
]();
|
|
||||||
}
|
|
||||||
|
|
||||||
function mailpoet_form_fields() {
|
|
||||||
// form editor: default fields
|
|
||||||
var template = Handlebars.compile($('#form_template_fields').html());
|
|
||||||
|
|
||||||
return MailPoet.Ajax.post({
|
|
||||||
api_version: window.mailpoet_api_version,
|
|
||||||
endpoint: 'customFields',
|
|
||||||
action: 'getAll',
|
|
||||||
}).done(function(response) {
|
|
||||||
// render toolbar
|
|
||||||
jQuery('#mailpoet_toolbar_fields').html(template({
|
|
||||||
fields: $.merge(
|
|
||||||
$.merge([], mailpoet_default_fields),
|
|
||||||
response.data
|
|
||||||
)
|
|
||||||
}));
|
|
||||||
|
|
||||||
setTimeout(function() {
|
|
||||||
WysijaForm.init();
|
|
||||||
}, 1);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
window.mailpoet_form_fields = mailpoet_form_fields;
|
|
||||||
|
|
||||||
// enable code mirror editor on styles textarea
|
|
||||||
MailPoet.CodeEditor = CodeMirror.fromTextArea(
|
|
||||||
document.getElementById('mailpoet_form_styles'),
|
|
||||||
{
|
|
||||||
lineNumbers: true,
|
|
||||||
tabMode: "indent",
|
|
||||||
matchBrackets: true,
|
|
||||||
theme: 'neo',
|
|
||||||
mode: 'css'
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
// toolbar sections
|
|
||||||
$(document).on(
|
|
||||||
'click',
|
|
||||||
'.mailpoet_toolbar_section.closed',
|
|
||||||
mailpoet_toolbar_tab
|
|
||||||
);
|
|
||||||
|
|
||||||
function mailpoet_toolbar_tab(tab, callback) {
|
|
||||||
var section = null;
|
|
||||||
|
|
||||||
if($.type(tab) === 'string') {
|
|
||||||
section = $('.mailpoet_toolbar_section[data-section="'+tab+'"]');
|
|
||||||
} else {
|
|
||||||
section = $(this);
|
|
||||||
}
|
|
||||||
|
|
||||||
var current_section = $('.mailpoet_toolbar_section:not(.closed)');
|
|
||||||
|
|
||||||
if(current_section.data('section') === section.data('section')) {
|
|
||||||
if(callback !== undefined && $.type(callback) === 'function') {
|
|
||||||
callback();
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
// close currently opened section
|
|
||||||
$('.mailpoet_toolbar_section:not(.closed)').addClass('closed');
|
|
||||||
|
|
||||||
// open selected section after a mini delay
|
|
||||||
setTimeout(function() {
|
|
||||||
$(section).removeClass('closed');
|
|
||||||
if(callback !== undefined && $.type(callback) === 'function') {
|
|
||||||
setTimeout(function() {
|
|
||||||
callback();
|
|
||||||
}, 151);
|
|
||||||
}
|
|
||||||
}.bind(this), 150);
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// toolbar: open default section
|
|
||||||
mailpoet_toolbar_tab('settings');
|
|
||||||
|
|
||||||
// form: edit name (in place editor)
|
|
||||||
$('#mailpoet_form_edit_name').on('click', function() {
|
|
||||||
mailpoet_edit_form_name();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#mailpoet_form_name_input').on('keypress', function(e) {
|
|
||||||
if(e.which === 13) {
|
|
||||||
mailpoet_edit_form_name();
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
function mailpoet_edit_form_name() {
|
|
||||||
var is_editing = $('#mailpoet_form_name')
|
|
||||||
.data('mailpoet_editing') || false;
|
|
||||||
|
|
||||||
if(!is_editing) {
|
|
||||||
// set input value and show
|
|
||||||
$('#mailpoet_form_name_input')
|
|
||||||
.val($('#mailpoet_form_name').text())
|
|
||||||
.show();
|
|
||||||
|
|
||||||
// set editing mode
|
|
||||||
$('#mailpoet_form_name').data('mailpoet_editing', true);
|
|
||||||
|
|
||||||
// hide form name
|
|
||||||
$('#mailpoet_form_name').hide();
|
|
||||||
|
|
||||||
// focus on text input
|
|
||||||
$('#mailpoet_form_name_input').focus();
|
|
||||||
|
|
||||||
// set edit name label
|
|
||||||
$('#mailpoet_form_edit_name').html("<%= __('Save') %>");
|
|
||||||
} else {
|
|
||||||
var current_value = $('#mailpoet_form_name').html(),
|
|
||||||
new_value = $('#mailpoet_form_name_input').val();
|
|
||||||
|
|
||||||
// hide text input
|
|
||||||
$('#mailpoet_form_name_input').hide();
|
|
||||||
|
|
||||||
// set value
|
|
||||||
$('#mailpoet_form_name').text(new_value);
|
|
||||||
|
|
||||||
// set editing mode
|
|
||||||
$('#mailpoet_form_name').data('mailpoet_editing', false);
|
|
||||||
|
|
||||||
// show form name
|
|
||||||
$('#mailpoet_form_name').show();
|
|
||||||
|
|
||||||
// set edit name label
|
|
||||||
$('#mailpoet_form_edit_name').text("<%= __('Edit name') %>");
|
|
||||||
|
|
||||||
// save change if necessary
|
|
||||||
if(new_value !== '' && current_value !== new_value) {
|
|
||||||
MailPoet.Ajax.post({
|
|
||||||
api_version: window.mailpoet_api_version,
|
|
||||||
endpoint: 'forms',
|
|
||||||
action: 'save',
|
|
||||||
data: {
|
|
||||||
id: $('#mailpoet_form_id').val(),
|
|
||||||
name: new_value
|
|
||||||
}
|
|
||||||
}).done(function(response) {
|
|
||||||
MailPoet.Notice.success(
|
|
||||||
"<%= __('The form name was successfully updated!') | escape('js') %>"
|
|
||||||
);
|
|
||||||
}).fail(function(response) {
|
|
||||||
if (response.errors.length > 0) {
|
|
||||||
MailPoet.Notice.error(
|
|
||||||
response.errors.map(function(error) { return error.message; }),
|
|
||||||
{ scroll: true }
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// on dom loaded
|
|
||||||
$(function() {
|
|
||||||
// load form
|
|
||||||
WysijaForm.load(<%= json_encode(form) | raw %>);
|
|
||||||
|
|
||||||
// save form
|
|
||||||
$('#mailpoet_form_save').on('click', function() {
|
|
||||||
mailpoet_form_save();
|
|
||||||
mailpoet_form_export();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
// edit name
|
|
||||||
$('#mailpoet_form_name').on('keyup', function(e) {
|
|
||||||
if(e.which === 13) {
|
|
||||||
$('#mailpoet_form_save').trigger('click');
|
|
||||||
this.blur();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// preview form
|
|
||||||
$(document).on('click', '#mailpoet_form_preview', function() {
|
|
||||||
mailpoet_form_preview();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
function mailpoet_form_preview() {
|
|
||||||
MailPoet.Ajax.post({
|
|
||||||
api_version: window.mailpoet_api_version,
|
|
||||||
endpoint: 'forms',
|
|
||||||
action: 'previewEditor',
|
|
||||||
data: WysijaForm.save()
|
|
||||||
}).done(function(response) {
|
|
||||||
MailPoet.Modal.popup({
|
|
||||||
title: "<%= __('Form preview') %>",
|
|
||||||
template: $('#mailpoet_form_preview_template').html(),
|
|
||||||
data: response.data
|
|
||||||
});
|
|
||||||
}).fail(function(response) {
|
|
||||||
if (response.errors.length > 0) {
|
|
||||||
MailPoet.Notice.error(
|
|
||||||
response.errors.map(function(error) { return error.message; }),
|
|
||||||
{ scroll: true }
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function mailpoet_form_save(callback) {
|
|
||||||
var form = WysijaForm.save();
|
|
||||||
form.id = $('#mailpoet_form_id').val();
|
|
||||||
|
|
||||||
// reset error messages
|
|
||||||
$('#mailpoet_form_settings').parsley().reset();
|
|
||||||
|
|
||||||
// validate segments to subscribe to
|
|
||||||
if(WysijaForm.hasSegmentSelection()) {
|
|
||||||
// validate segment selection in form
|
|
||||||
if(WysijaForm.isSegmentSelectionValid() === false) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// check if the form is valid
|
|
||||||
if($('#mailpoet_form_settings').parsley().isValid() === false) {
|
|
||||||
// refresh settings and trigger validation
|
|
||||||
mailpoet_toolbar_tab('settings', function() {
|
|
||||||
$('#mailpoet_form_settings').parsley().validate();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
// save form
|
|
||||||
MailPoet.Ajax.post({
|
|
||||||
api_version: window.mailpoet_api_version,
|
|
||||||
endpoint: 'forms',
|
|
||||||
action: 'saveEditor',
|
|
||||||
data: form
|
|
||||||
}).done(function(response) {
|
|
||||||
if(callback !== false) {
|
|
||||||
var message = null;
|
|
||||||
|
|
||||||
if(response.meta.is_widget === true) {
|
|
||||||
message = "<%= __('Saved! The changes are now active in your widget.') | escape('js') %>";
|
|
||||||
} else {
|
|
||||||
message = "<%= __('Saved! Add this form to %1$sa widget%2$s.') | format("<a href='widgets.php' target='_blank'>", '</a>') | raw | escape('js') %>";
|
|
||||||
}
|
|
||||||
|
|
||||||
if(message !== null) {
|
|
||||||
MailPoet.Notice.hide();
|
|
||||||
MailPoet.Notice.success(message, {
|
|
||||||
scroll: true,
|
|
||||||
static: (response.meta.is_widget === false)
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
MailPoet.trackEvent('Forms > Add New', {
|
|
||||||
'MailPoet Free version': window.mailpoet_version
|
|
||||||
});
|
|
||||||
|
|
||||||
// if there is a callback, call it!
|
|
||||||
if(callback !== undefined) {
|
|
||||||
callback();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}).fail(function(response) {
|
|
||||||
if (response.errors.length > 0) {
|
|
||||||
MailPoet.Notice.error(
|
|
||||||
response.errors.map(function(error) { return error.message; }),
|
|
||||||
{ scroll: true }
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
window.mailpoet_form_save = mailpoet_form_save;
|
|
||||||
|
|
||||||
// toolbar: on success toggle
|
|
||||||
$(document).on('change', 'input[name="on_success"]', toggleOnSuccessOptions);
|
|
||||||
toggleOnSuccessOptions();
|
|
||||||
|
|
||||||
function toggleOnSuccessOptions() {
|
|
||||||
// hide all options
|
|
||||||
$('.mailpoet_on_success_option').hide();
|
|
||||||
|
|
||||||
// display selected option
|
|
||||||
var value = $('input[name="on_success"]:checked').val();
|
|
||||||
$('#mailpoet_on_success_'+value).show();
|
|
||||||
}
|
|
||||||
|
|
||||||
function mailpoet_form_export() {
|
|
||||||
var template = Handlebars.compile($('#form_template_exports').html());
|
|
||||||
MailPoet.Ajax.post({
|
|
||||||
api_version: window.mailpoet_api_version,
|
|
||||||
endpoint: 'forms',
|
|
||||||
action: 'exportsEditor',
|
|
||||||
data: {
|
|
||||||
id: $('#mailpoet_form_id').val()
|
|
||||||
}
|
|
||||||
}).done(function(response) {
|
|
||||||
$('#mailpoet_form_export').html(template({ exports: response.data }));
|
|
||||||
}).fail(function(response) {
|
|
||||||
if (response.errors.length > 0) {
|
|
||||||
MailPoet.Notice.error(
|
|
||||||
response.errors.map(function(error) { return error.message; }),
|
|
||||||
{ scroll: true }
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
mailpoet_form_export();
|
|
||||||
|
|
||||||
$(document).on('click', '.mailpoet_form_export_toggle', function() {
|
|
||||||
var type = $(this).data('type');
|
|
||||||
$('.mailpoet_form_export_output').hide();
|
|
||||||
$('#mailpoet_form_export_' + type).show();
|
|
||||||
MailPoet.trackEvent('Forms > Embed', {
|
|
||||||
'Embed type': type,
|
|
||||||
'MailPoet Free version': window.mailpoet_version
|
|
||||||
});
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
// add new field
|
|
||||||
$(document).on('click', '#mailpoet_form_add_field', function() {
|
|
||||||
// open popup
|
|
||||||
MailPoet.Modal.popup({
|
|
||||||
title: "<%= __('Add new field') %>",
|
|
||||||
minWidth: "500px",
|
|
||||||
template: $('#form_template_field_form').html()
|
|
||||||
});
|
|
||||||
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
// edit field
|
|
||||||
$(document).on('click', '.mailpoet_form_field_edit', function() {
|
|
||||||
var id = $(this).data('id');
|
|
||||||
|
|
||||||
MailPoet.Ajax.post({
|
|
||||||
api_version: window.mailpoet_api_version,
|
|
||||||
endpoint: 'customFields',
|
|
||||||
action: 'get',
|
|
||||||
data: {
|
|
||||||
id: id
|
|
||||||
}
|
|
||||||
}).done(function(response) {
|
|
||||||
MailPoet.Modal.popup({
|
|
||||||
title: "<%= __('Edit field') %>",
|
|
||||||
template: $('#form_template_field_form').html(),
|
|
||||||
minWidth: "500px",
|
|
||||||
data: response.data
|
|
||||||
});
|
|
||||||
}).fail(function(response) {
|
|
||||||
if (response.errors.length > 0) {
|
|
||||||
MailPoet.Notice.error(
|
|
||||||
response.errors.map(function(error) { return error.message; }),
|
|
||||||
{ scroll: true }
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// delete field
|
|
||||||
$(document).on('click', '.mailpoet_form_field_delete', function() {
|
|
||||||
var id = $(this).data('id');
|
|
||||||
var item = $(this).parent();
|
|
||||||
var name = $(this).siblings('.mailpoet_form_field').attr('wysija_name');
|
|
||||||
var type = $(this).siblings('.mailpoet_form_field').attr('wysija_type');
|
|
||||||
|
|
||||||
if(window.confirm(
|
|
||||||
"<%= __('This field will be deleted for all your subscribers. Are you sure?') %>"
|
|
||||||
)) {
|
|
||||||
MailPoet.Ajax.post({
|
|
||||||
api_version: window.mailpoet_api_version,
|
|
||||||
endpoint: 'customFields',
|
|
||||||
action: 'delete',
|
|
||||||
data: {
|
|
||||||
id: id
|
|
||||||
}
|
|
||||||
}).done(function(response) {
|
|
||||||
item.remove();
|
|
||||||
|
|
||||||
WysijaForm.removeBlock(id, function() {
|
|
||||||
mailpoet_form_save(false);
|
|
||||||
});
|
|
||||||
|
|
||||||
mailpoet_form_fields();
|
|
||||||
MailPoet.Notice.success(
|
|
||||||
"<%= __('Removed custom field %$1s') | escape('js') %>".replace('%$1s', '"' + encodeHtmlValue(name) + '"')
|
|
||||||
);
|
|
||||||
|
|
||||||
MailPoet.trackEvent('Forms > Delete custom field', {
|
|
||||||
'Field type': type,
|
|
||||||
'MailPoet Free version': window.mailpoet_version
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// undo button
|
|
||||||
$(document).on('click', '#mailpoet_form_undo', function() {
|
|
||||||
// pop last element off the history
|
|
||||||
WysijaHistory.dequeue();
|
|
||||||
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
// get form fields
|
|
||||||
mailpoet_form_fields();
|
|
||||||
|
|
||||||
// toolbar: segment selection
|
|
||||||
var selected_segments = <%= form.settings.segments | json_encode | raw %>;
|
|
||||||
|
|
||||||
// enable select2 for segment selection
|
|
||||||
var select2 = $('#mailpoet_form_segments').select2({
|
|
||||||
width:'100%',
|
|
||||||
templateResult: function(item) {
|
|
||||||
if(item.element && item.element.selected) {
|
|
||||||
return null;
|
|
||||||
} else {
|
|
||||||
return item.text;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
var hasRemoved = false;
|
|
||||||
select2.on('select2:unselecting', function(e) {
|
|
||||||
hasRemoved = true;
|
|
||||||
});
|
|
||||||
select2.on('select2:opening', function(e) {
|
|
||||||
if(hasRemoved === true) {
|
|
||||||
hasRemoved = false;
|
|
||||||
e.preventDefault();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// set selected values
|
|
||||||
$('#mailpoet_form_segments')
|
|
||||||
.val(<%= form.settings.segments | json_encode | raw %>)
|
|
||||||
.trigger('change');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<% endblock %>
|
|
||||||
|
|
||||||
<% block templates %>
|
|
||||||
<!-- toolbar templates -->
|
|
||||||
<%= partial('form_template_fields', 'form/templatesLegacy/toolbar/fields.hbs') %>
|
|
||||||
<%= partial('form_template_exports', 'form/templatesLegacy/toolbar/exports.hbs') %>
|
|
||||||
|
|
||||||
<!-- block templates -->
|
|
||||||
<%= partial('form_template_block', 'form/templatesLegacy/blocks/container.hbs') %>
|
|
||||||
<%= partial('form_template_divider', 'form/templatesLegacy/blocks/divider.hbs') %>
|
|
||||||
<%= partial('form_template_text', 'form/templatesLegacy/blocks/text.hbs') %>
|
|
||||||
<%= partial('form_template_submit', 'form/templatesLegacy/blocks/submit.hbs') %>
|
|
||||||
<%= partial('form_template_segment', 'form/templatesLegacy/blocks/segment.hbs') %>
|
|
||||||
<%= partial('form_template_radio', 'form/templatesLegacy/blocks/radio.hbs') %>
|
|
||||||
<%= partial('form_template_select', 'form/templatesLegacy/blocks/select.hbs') %>
|
|
||||||
<%= partial('form_template_checkbox', 'form/templatesLegacy/blocks/checkbox.hbs') %>
|
|
||||||
<%= partial('form_template_textarea', 'form/templatesLegacy/blocks/textarea.hbs') %>
|
|
||||||
<%= partial('form_template_html', 'form/templatesLegacy/blocks/html.hbs') %>
|
|
||||||
|
|
||||||
<!-- custom field settings and templates -->
|
|
||||||
<% include 'form/custom_fields_legacy.html' %>
|
|
||||||
|
|
||||||
<!-- form preview -->
|
|
||||||
<%= partial('mailpoet_form_preview_template',
|
|
||||||
'form/templatesLegacy/preview.hbs'
|
|
||||||
) %>
|
|
||||||
<% endblock %>
|
|
||||||
|
|
||||||
<% block translations %>
|
|
||||||
<%= localize({
|
|
||||||
'editFieldSettings': __('Edit field settings'),
|
|
||||||
}) %>
|
|
||||||
<% endblock %>
|
|
@ -1,10 +0,0 @@
|
|||||||
{{#if params.label}}
|
|
||||||
<p>
|
|
||||||
<label>{{ params.label }}{{#if params.required}} *{{/if}}</label>
|
|
||||||
</p>
|
|
||||||
{{/if}}
|
|
||||||
{{#each params.values}}
|
|
||||||
<p>
|
|
||||||
<label><input class="mailpoet_checkbox" type="checkbox" value="1" {{#if is_checked}}checked="checked"{{/if}} disabled="disabled" />{{ value }}</label>
|
|
||||||
</p>
|
|
||||||
{{/each}}
|
|
@ -1,20 +0,0 @@
|
|||||||
<div class="mailpoet_form_block"
|
|
||||||
wysija_type="{{ type }}"
|
|
||||||
{{#if id}}wysija_id="{{ id }}"{{/if}}
|
|
||||||
wysija_name="{{ name }}"
|
|
||||||
wysija_unique="{{ unique }}"
|
|
||||||
wysija_static="{{#ifCond static '==' 1}}1{{else}}0{{/ifCond}}"
|
|
||||||
wysija_params="{{#if params}}{{ json_encode params }}{{/if}}">
|
|
||||||
{{#ifCond type '!==' 'divider'}}
|
|
||||||
<div class="wysija_settings" style="display:none;">
|
|
||||||
<a class="settings" href="javascript:;"><span></span><%= __('Edit display') %></a>
|
|
||||||
</div>
|
|
||||||
{{/ifCond}}
|
|
||||||
<ul class="wysija_controls clearfix" style="display: none;">
|
|
||||||
<li class="handle_container"><a class="handle" href="javascript:;"><span></span></a></li>
|
|
||||||
{{#ifCond static '==' '0'}}
|
|
||||||
<li><a class="remove" href="javascript:;"><span></span></a></li>
|
|
||||||
{{/ifCond}}
|
|
||||||
</ul>
|
|
||||||
{{{ template }}}
|
|
||||||
</div>
|
|
@ -1 +0,0 @@
|
|||||||
<hr />
|
|
@ -1,7 +0,0 @@
|
|||||||
{{#if params.text}}
|
|
||||||
{{#ifCond params.nl2br '==' '1'}}
|
|
||||||
{{{ nl2br params.text }}}
|
|
||||||
{{else}}
|
|
||||||
{{{ params.text }}}
|
|
||||||
{{/ifCond}}
|
|
||||||
{{/if}}
|
|
@ -1,10 +0,0 @@
|
|||||||
{{#if params.label}}
|
|
||||||
<p>
|
|
||||||
<label>{{ params.label }}{{#if params.required}} *{{/if}}</label>
|
|
||||||
</p>
|
|
||||||
{{/if}}
|
|
||||||
{{#each params.values}}
|
|
||||||
<p>
|
|
||||||
<label><input class="mailpoet_radio" type="radio" value="1" {{#if is_checked}}checked="checked"{{/if}} disabled="disabled" />{{ value }}</label>
|
|
||||||
</p>
|
|
||||||
{{/each}}
|
|
@ -1,7 +0,0 @@
|
|||||||
{{#if params.label}}<p>{{ params.label }}</p>{{/if}}
|
|
||||||
{{#unless params.values}}<p class="mailpoet_error"><%= __('Please select at least one list') %></p>{{/unless}}
|
|
||||||
{{#each params.values}}
|
|
||||||
<p>
|
|
||||||
<input class="mailpoet_checkbox" type="checkbox" {{#if is_checked}}checked="checked"{{/if}} disabled="disabled" />{{ name }}
|
|
||||||
</p>
|
|
||||||
{{/each}}
|
|
@ -1,17 +0,0 @@
|
|||||||
{{#unless params.label_within}}
|
|
||||||
{{#if params.label}}
|
|
||||||
<p>
|
|
||||||
<label>{{ params.label }}{{#if params.required}} *{{/if}}</label>
|
|
||||||
</p>
|
|
||||||
{{/if}}
|
|
||||||
{{/unless}}
|
|
||||||
<select>
|
|
||||||
{{#if params.label_within}}
|
|
||||||
<option value="">{{ params.label }}{{#if params.required}} *{{/if}}</option>
|
|
||||||
{{else}}
|
|
||||||
{{#unless params.required}}<option value="">-</option>{{/unless}}
|
|
||||||
{{/if}}
|
|
||||||
{{#each params.values}}
|
|
||||||
<option {{#if is_checked}}selected="selected"{{/if}}>{{ value }}</option>
|
|
||||||
{{/each}}
|
|
||||||
</select>
|
|
@ -1 +0,0 @@
|
|||||||
<input type="submit" value="{{ params.label }}" class="button" />
|
|
@ -1,2 +0,0 @@
|
|||||||
{{#unless params.label_within}}<label>{{ params.label }}{{#if params.required}} *{{/if}}</label>{{/unless}}
|
|
||||||
<input type="text" disabled="disabled" value="" placeholder="{{#if params.label_within}}{{ params.label }}{{#if params.required}} *{{/if}}{{/if}}" />
|
|
@ -1,4 +0,0 @@
|
|||||||
<p>
|
|
||||||
{{#unless params.label_within}}<label>{{ params.label }}{{#if params.required}} *{{/if}}</label>{{/unless}}
|
|
||||||
<textarea placeholder="{{#if params.label_within}}{{ params.label }}{{#if params.required}} *{{/if}}{{/if}}" disabled="disabled" rows="{{#if params.lines}}{{ params.lines }}{{else}}1{{/if}}">{{ params.text }}</textarea>
|
|
||||||
</p>
|
|
@ -1,11 +0,0 @@
|
|||||||
<style type="text/css" id="mailpoet_form_preview_styles">
|
|
||||||
.mailpoet_hp_email_label { display: none; }
|
|
||||||
{{{ css }}}
|
|
||||||
</style>
|
|
||||||
<div class="mailpoet_form">
|
|
||||||
<div class="mailpoet_message">
|
|
||||||
<p class="mailpoet_validate_success"><%= __('This is what the success message looks like.') %></p>
|
|
||||||
<p class="mailpoet_validate_error"><%= __('This is what the error message looks like.') %></p>
|
|
||||||
</div>
|
|
||||||
{{{ html }}}
|
|
||||||
</div>
|
|
@ -1,3 +0,0 @@
|
|||||||
{{#each exports}}
|
|
||||||
<textarea class="mailpoet_form_export_output" id="mailpoet_form_export_{{ @key }}" onClick="this.focus();this.select();" readonly="readonly">{{ this }}</textarea>
|
|
||||||
{{/each}}
|
|
@ -1,27 +0,0 @@
|
|||||||
{{#each fields}}
|
|
||||||
<li>
|
|
||||||
<a class="mailpoet_form_field"
|
|
||||||
wysija_name="{{ name }}"
|
|
||||||
{{#if id }}wysija_id="{{ id }}"{{/if}}
|
|
||||||
wysija_unique="{{#if multiple}}0{{else}}1{{/if}}"
|
|
||||||
wysija_type="{{ type }}"
|
|
||||||
{{#if params}}wysija_params="{{ json_encode params }}"{{/if}}>
|
|
||||||
{{ name }}
|
|
||||||
</a>
|
|
||||||
|
|
||||||
{{#unless readonly}}
|
|
||||||
<a class="mailpoet_form_field_edit settings"
|
|
||||||
title="<%= __('Edit field') %>"
|
|
||||||
href="javascript:;"
|
|
||||||
data-id="{{ id }}">
|
|
||||||
<span class="dashicons dashicons-admin-generic"></span>
|
|
||||||
</a>
|
|
||||||
<a class="mailpoet_form_field_delete delete"
|
|
||||||
title="<%= __('Delete field') %>"
|
|
||||||
href="javascript:;"
|
|
||||||
data-id="{{ id }}">
|
|
||||||
<span class="dashicons dashicons-dismiss"></span>
|
|
||||||
</a>
|
|
||||||
{{/unless}}
|
|
||||||
</li>
|
|
||||||
{{/each}}
|
|
@ -209,7 +209,6 @@ const adminConfig = {
|
|||||||
'common/check_spf_record.jsx',
|
'common/check_spf_record.jsx',
|
||||||
],
|
],
|
||||||
admin: 'webpack_admin_index.jsx',
|
admin: 'webpack_admin_index.jsx',
|
||||||
form_editor_legacy: 'form_editor_legacy/webpack_index.jsx',
|
|
||||||
newsletter_editor: 'newsletter_editor/webpack_index.jsx',
|
newsletter_editor: 'newsletter_editor/webpack_index.jsx',
|
||||||
},
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
@ -247,12 +246,12 @@ const adminConfig = {
|
|||||||
|
|
||||||
// add admin/form_editor_legacy/newsletter_editor shared modules
|
// add admin/form_editor_legacy/newsletter_editor shared modules
|
||||||
const filteredChunks = chunks.filter((chunk) => {
|
const filteredChunks = chunks.filter((chunk) => {
|
||||||
return ['admin', 'form_editor_legacy', 'newsletter_editor'].includes(chunk.name);
|
return ['admin', 'newsletter_editor'].includes(chunk.name);
|
||||||
});
|
});
|
||||||
return filteredChunks.length > 1;
|
return filteredChunks.length > 1;
|
||||||
},
|
},
|
||||||
enforce: true,
|
enforce: true,
|
||||||
chunks: (chunk) => ['admin_vendor', 'admin', 'form_editor_legacy', 'newsletter_editor'].includes(chunk.name),
|
chunks: (chunk) => ['admin_vendor', 'admin', 'newsletter_editor'].includes(chunk.name),
|
||||||
priority: 0,
|
priority: 0,
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user