Add form template selection page

[MAILPOET-2987]
This commit is contained in:
Pavel Dohnal
2020-06-22 10:49:25 +02:00
committed by Veljko V
parent 0d6d48d26d
commit 5498554c8c
3 changed files with 193 additions and 11 deletions

View File

@ -6,6 +6,7 @@ use MailPoet\AdminPages\PageRenderer;
use MailPoet\API\JSON\ResponseBuilders\CustomFieldsResponseBuilder;
use MailPoet\Config\Localizer;
use MailPoet\CustomFields\CustomFieldsRepository;
use MailPoet\Features\FeaturesController;
use MailPoet\Form\Block;
use MailPoet\Form\FormFactory;
use MailPoet\Form\Renderer as FormRenderer;
@ -43,6 +44,9 @@ class FormEditor {
/** @var Localizer */
private $localizer;
/** @var FeaturesController */
private $flagsController;
public function __construct(
PageRenderer $pageRenderer,
CustomFieldsRepository $customFieldsRepository,
@ -51,6 +55,7 @@ class FormEditor {
Block\Date $dateBlock,
WPFunctions $wp,
FormFactory $formsFactory,
FeaturesController $flagsController,
Localizer $localizer
) {
$this->pageRenderer = $pageRenderer;
@ -61,21 +66,18 @@ class FormEditor {
$this->wp = $wp;
$this->formsFactory = $formsFactory;
$this->localizer = $localizer;
$this->flagsController = $flagsController;
}
public function render() {
$id = (isset($_GET['id']) ? (int)$_GET['id'] : 0);
if (isset($_GET['action']) && $_GET['action'] === 'create') {
$form = $this->formsFactory->createEmptyForm();
$this->wp->wpSafeRedirect(
$this->wp->getSiteUrl(null,
'/wp-admin/admin.php?page=mailpoet-form-editor&id=' . $form->id()
)
);
exit;
if (!isset($_GET['id']) && !isset($_GET['action'])) {
$this->renderTemplateSelection();
return;
}
$form = Form::findOne($id);
if ($_GET['action'] === 'create') {
$this->createEmptyForm();
}
$form = Form::findOne((int)$_GET['id']);
if ($form instanceof Form) {
$form = $form->asArray();
}
@ -110,6 +112,147 @@ class FormEditor {
$this->pageRenderer->displayPage('form/editor.html', $data);
}
private function renderTemplateSelection() {
$templates = [
[
'id' => 'my-fancy-template1',
'name' => 'My First Form',
'body' => [
[
'type' => 'columns',
'body' =>
[
[
'type' => 'column',
'params' => ['class_name' => '', 'vertical_alignment' => '', 'width' => '50'],
'body' => [
[
'type' => 'text',
'params' => ['label' => 'Email', 'class_name' => '', 'required' => '1'],
'id' => 'email',
'name' => 'Email',
'styles' => ['full_width' => '1']
],
[
'type' => 'text',
'params' => ['label' => 'First name', 'class_name' => ''],
'id' => 'first_name',
'name' => 'First name',
'styles' => ['full_width' => '1'],
],
]
],
[
'type' => 'column',
'params' => ['class_name' => '', 'vertical_alignment' => '', 'width' => '50'],
'body' => [
[
'type' => 'paragraph',
'id' => 'paragraph',
'params' => [
'content' => 'Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.',
'drop_cap' => '0',
'align' => 'left',
'font_size' => '',
'text_color' => '',
'background_color' => '',
'class_name' => '',
],
],
],
],
],
'params' => [
'vertical_alignment' => '',
'class_name' => '',
'text_color' => '',
'background_color' => '',
],
],
[
'type' => 'submit',
'params' => ['label' => 'Subscribe!', 'class_name' => ''],
'id' => 'submit',
'name' => 'Submit',
'styles' => [
'full_width' => '0',
'bold' => '0',
'background_color' => '#ff6900',
'font_size' => '36',
'font_color' => '#313131',
'border_size' => '1',
'border_radius' => '8',
'border_color' => '#f78da7',
'padding' => '5',
],
],
],
'settings' => [
'segments' => ['3'],
'on_success' => 'message',
'success_message' => 'Check your inbox or spam folder to confirm your subscription.',
'success_page' => '5',
'segments_selected_by' => 'admin',
'alignment' => 'left',
'place_form_bellow_all_pages' => '',
'place_form_bellow_all_posts' => '',
'place_popup_form_on_all_pages' => '1',
'place_popup_form_on_all_posts' => '1',
'popup_form_delay' => '15',
'place_fixed_bar_form_on_all_pages' => '',
'place_fixed_bar_form_on_all_posts' => '',
'fixed_bar_form_delay' => '15',
'fixed_bar_form_position' => 'top',
'place_slide_in_form_on_all_pages' => '',
'place_slide_in_form_on_all_posts' => '',
'slide_in_form_delay' => '15',
'slide_in_form_position' => 'right',
'border_radius' => '0',
'border_size' => '0',
'form_padding' => '20',
'input_padding' => '5',
'below_post_styles' => ['width' => ['unit' => 'percent', 'value' => '100']],
'slide_in_styles' => ['width' => ['unit' => 'pixel', 'value' => '560']],
'fixed_bar_styles' => ['width' => ['unit' => 'percent', 'value' => '100']],
'popup_styles' => ['width' => ['unit' => 'pixel', 'value' => '560']],
'other_styles' => ['width' => ['unit' => 'percent', 'value' => '100']],
],
'styles' => '
/* form */.mailpoet_form {}
/* columns */.mailpoet_column_with_background { padding: 10px;}/* space between columns */.mailpoet_form_column:not(:first-child) { margin-left: 20px;}
/* input wrapper (label + input) */.mailpoet_paragraph { line-height:20px; margin-bottom: 20px;}
/* labels */.mailpoet_segment_label,.mailpoet_text_label,.mailpoet_textarea_label,.mailpoet_select_label,.mailpoet_radio_label,.mailpoet_checkbox_label,.mailpoet_list_label,.mailpoet_date_label { display:block; font-weight: normal;}
/* inputs */.mailpoet_text,.mailpoet_textarea,.mailpoet_select,.mailpoet_date_month,.mailpoet_date_day,.mailpoet_date_year,.mailpoet_date { display:block;}
.mailpoet_text,.mailpoet_textarea { width: 200px;}
.mailpoet_checkbox {}
.mailpoet_submit {}
.mailpoet_divider {}
.mailpoet_message {}
.mailpoet_form_loading { width: 30px; text-align: center; line-height: normal;}
.mailpoet_form_loading > span { width: 5px; height: 5px; background-color: #5b5b5b;}
',
],
];
if (empty($templates) || !$this->flagsController->isSupported(FeaturesController::TEMPLATES_SELECTION)) {
$this->createEmptyForm();
}
$data = [
'templates' => $templates,
];
$this->pageRenderer->displayPage('form/template_selection.html', $data);
}
private function createEmptyForm() {
$form = $this->formsFactory->createEmptyForm();
$this->wp->wpSafeRedirect(
$this->wp->getSiteUrl(null,
'/wp-admin/admin.php?page=mailpoet-form-editor&id=' . $form->id()
)
);
exit;
}
private function getPreviewPageUrl() {
$mailpoetPage = Pages::getDefaultMailPoetPage();
if (!$mailpoetPage) {

View File

@ -9,11 +9,13 @@ class FeaturesController {
// Define features below in the following form:
// const FEATURE_NAME_OF_FEATURE = 'name-of-feature';
const NEW_DEFAULT_LIST_NAME = 'new-default-list-name';
const TEMPLATES_SELECTION = 'templates-selection';
// Define feature defaults in the array below in the following form:
// self::FEATURE_NAME_OF_FEATURE => true,
private $defaults = [
self::NEW_DEFAULT_LIST_NAME => false,
self::TEMPLATES_SELECTION => false,
];
/** @var array */

View File

@ -0,0 +1,37 @@
<% extends 'layout.html' %>
<% block after_css %>
<%= stylesheet('mailpoet-form-editor.css') %>
<% endblock %>
<% block container %>
<script type="text/javascript">
var mailpoet_beacon_articles = [
'5e43d3ec2c7d3a7e9ae79da9',
];
</script>
<div class="block-editor-templates">
<div id="mailpoet_form_edit_templates">
</div>
</div>
<script>
<% autoescape 'js' %>
var mailpoet_templates = <%= json_encode(templates) %>;
<% endautoescape %>
</script>
<style id="mailpoet-form-editor-form-styles"></style>
<% endblock %>
<% block translations %>
<%= localize({
'xyz': __('ABC'),
}) %>
<% endblock %>
<% block after_javascript %>
<%= javascript('form_editor.js')%>
<% endblock %>