Skip to content

Fix Message Active Toggle #4009

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: dev
Choose a base branch
from
Open

Fix Message Active Toggle #4009

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
461f231
extract context switcher markup to template
tn3rb Aug 25, 2022
8a801c5
remove unnecessary wrapper
tn3rb Aug 25, 2022
c2556bc
tweak some styles
tn3rb Aug 25, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
165 changes: 60 additions & 105 deletions admin_pages/messages/Messages_Admin_Page.core.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,8 +58,6 @@ class Messages_Admin_Page extends EE_Admin_Page

protected $_current_message_meta_box_object;

protected $_context_switcher;

protected $_shortcodes = [];

protected $_active_messengers = [];
Expand Down Expand Up @@ -1800,18 +1798,6 @@ protected function _edit_message_template()
. '</a>';


// setup context switcher
$this->_set_context_switcher(
$message_template_group,
[
'page' => 'espresso_messages',
'action' => 'edit_message_template',
'id' => $GRP_ID,
'evt_id' => $EVT_ID,
'context' => $context,
'extra' => $preview_button,
]
);


// main box
Expand All @@ -1825,15 +1811,27 @@ protected function _edit_message_template()


$this->_template_args['before_admin_page_content'] = '<div class="ee-msg-admin-header">';
$this->_template_args['before_admin_page_content'] .= $this->headerFormStart();
$this->_template_args['before_admin_page_content'] .= $this->add_active_context_element(
$message_template_group,
$context,
$context_label
);
$this->_template_args['before_admin_page_content'] .= $this->add_context_switcher();
$this->_template_args['before_admin_page_content'] .= $this->add_context_switcher(
$message_template_group,
[
'page' => 'espresso_messages',
'action' => 'edit_message_template',
'id' => $GRP_ID,
'evt_id' => $EVT_ID,
'context' => $context,
'extra' => $preview_button,
]
);
$this->_template_args['before_admin_page_content'] .= $this->formEnd();
$this->_template_args['before_admin_page_content'] .= '</div>';
$this->_template_args['before_admin_page_content'] .= $this->_add_form_element_before();
$this->_template_args['after_admin_page_content'] = $this->_add_form_element_after();
$this->_template_args['before_admin_page_content'] .= $this->editMessageFormStart();
$this->_template_args['after_admin_page_content'] = $this->formEnd();

$this->_template_path = $this->_template_args['GRP_ID']
? EE_MSG_TEMPLATE_PATH . 'ee_msg_details_main_edit_meta_box.template.php'
Expand Down Expand Up @@ -1868,12 +1866,6 @@ public function filter_tinymce_init($mceInit, $editor_id)
}


public function add_context_switcher()
{
return $this->_context_switcher;
}


/**
* Adds the activation/deactivation toggle for the message template context.
*
Expand All @@ -1890,20 +1882,42 @@ protected function add_active_context_element(
EE_Message_Template_Group $message_template_group,
$context,
$context_label
) {
$template_args = [
'context' => $context,
'nonce' => wp_create_nonce('activate_' . $context . '_toggle_nonce'),
'is_active' => $message_template_group->is_context_active($context),
'on_off_action' => $message_template_group->is_context_active($context)
? 'context-off'
: 'context-on',
'context_label' => str_replace(['(', ')'], '', $context_label),
'message_template_group_id' => $message_template_group->ID(),
];
): string {
return EEH_Template::display_template(
EE_MSG_TEMPLATE_PATH . 'ee_msg_editor_active_context_element.template.php',
$template_args,
[
'context' => $context,
'nonce' => wp_create_nonce('activate_' . $context . '_toggle_nonce'),
'is_active' => $message_template_group->is_context_active($context),
'on_off_action' => $message_template_group->is_context_active($context)
? 'context-off'
: 'context-on',
'context_label' => str_replace(['(', ')'], '', $context_label),
'message_template_group_id' => $message_template_group->ID(),
],
true
);
}


/**
* sets up a context switcher for edit forms
*
* @access protected
* @param EE_Message_Template_Group $template_group_object the template group object being displayed on the form
* @param array $args various things the context switcher needs.
* @throws EE_Error
*/
protected function add_context_switcher(EE_Message_Template_Group $template_group_object, array $args): string
{
return EEH_Template::display_template(
EE_MSG_TEMPLATE_PATH . 'ee_msg_editor_context_switcher.template.php',
[
'args' => $args,
'context_details' => $template_group_object->contexts_config(),
'context_label' => $template_group_object->context_label(),
'context_templates' => $template_group_object->context_templates(),
],
true
);
}
Expand Down Expand Up @@ -1985,15 +1999,21 @@ public function toggle_context_template()
}


public function _add_form_element_before()
public function headerFormStart(): string
{
$action = esc_url_raw(EE_MSG_ADMIN_URL);
return "<form method='get' action='$action' id='ee-msg-context-switcher-frm'>";
}


public function editMessageFormStart(): string
{
return '<form method="post" action="'
. $this->_template_args['edit_message_template_form_url']
. '" id="ee-msg-edit-frm">';
$action = $this->_template_args['edit_message_template_form_url'];
return "<form method ='post' action='$action' id='ee-msg-edit-frm'>";
}


public function _add_form_element_after()
public function formEnd(): string
{
return '</form>';
}
Expand Down Expand Up @@ -2646,71 +2666,6 @@ protected function _set_message_template_group()
$this->_variation = $this->_message_template_group->get_template_pack_variation();
}


/**
* sets up a context switcher for edit forms
*
* @access protected
* @param EE_Message_Template_Group $template_group_object the template group object being displayed on the form
* @param array $args various things the context switcher needs.
* @throws EE_Error
*/
protected function _set_context_switcher(EE_Message_Template_Group $template_group_object, $args)
{
$context_details = $template_group_object->contexts_config();
$context_label = $template_group_object->context_label();
ob_start();
?>
<div class="ee-msg-switcher-container">
<form method="get" action="<?php echo esc_url_raw(EE_MSG_ADMIN_URL); ?>" id="ee-msg-context-switcher-frm">
<?php
foreach ($args as $name => $value) {
if ($name === 'context' || empty($value) || $name === 'extra') {
continue;
}
?>
<input type="hidden"
name="<?php echo esc_attr($name); ?>"
value="<?php echo esc_attr($value); ?>"
/>
<?php
}
// setup nonce_url
wp_nonce_field($args['action'] . '_nonce', $args['action'] . '_nonce', false);
$id = 'ee-' . sanitize_key($context_label['label']) . '-select';
?>
<label for='<?php echo esc_attr($id); ?>' class='screen-reader-text'>
<?php esc_html_e('message context options', 'event_espresso'); ?>
</label>
<select id="<?php echo esc_attr($id); ?>" name="context">
<?php
$context_templates = $template_group_object->context_templates();
if (is_array($context_templates)) :
foreach ($context_templates as $context => $template_fields) :
$checked = ($context === $args['context']) ? 'selected' : '';
?>
<option value="<?php echo esc_attr($context); ?>" <?php echo esc_attr($checked); ?>>
<?php echo esc_html($context_details[ $context ]['label']); ?>
</option>
<?php endforeach;
endif; ?>
</select>
<?php $button_text = sprintf(
esc_html__('Switch %s', 'event_espresso'),
ucwords($context_label['label'])
); ?>
<input class='button--secondary'
id="submit-msg-context-switcher-sbmt"
type="submit"
value="<?php echo esc_attr($button_text); ?>"
/>
</form>
<?php echo wp_kses($args['extra'], AllowedTags::getWithFormTags()); ?>
</div> <!-- end .ee-msg-switcher-container -->
<?php $this->_context_switcher = ob_get_clean();
}


/**
* @param bool $new
* @throws EE_Error
Expand Down
86 changes: 54 additions & 32 deletions admin_pages/messages/assets/ee_message_admin.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,16 +59,70 @@
padding-block: 1rem;
}

#ee-msg-context-switcher-frm {
display: flex;
flex-flow: row wrap;
width: 100%;
--ee-active-control-container-width: 42rem;
}

/** context toggle **/
/*.context-active-control-container {*/
.activate_context_on_off_toggle_container {
align-items: center;
background: white;
box-sizing: border-box;
display: flex;
flex-flow: row wrap;
padding: 1rem;
width: 100%;
--ee-switch-size: 1.5rem;
--ee-switch-size-btn: calc(var(--ee-switch-size) * .75);
--ee-switch-size-width: calc(var(--ee-switch-size) * 2);
}

.activate_context_on_off_toggle_container .ee-switch {
width: calc(100% - 36px);
}


.activate_context_on_off_toggle_container .spinner {
margin: 0;
}


.activate_context_on_off_toggle_container .ee-on-off-toggle-label {
margin-inline-end: 1rem;
}

.activate_context_on_off_toggle_container #ee-on-off-toggle-primary_attendee {
display: none;
}


.ee-msg-switcher-container {
align-items: center;
box-sizing: border-box;
display: flex;
flex-flow: row wrap;
margin: 0;
width: 100%;
}

.ee-msg-switcher-container select {
width: 16rem;
}


@media screen and (min-width: 1367px) {
.activate_context_on_off_toggle_container {
width: clamp(300px, var(--ee-active-control-container-width), 100%);
}
.ee-msg-switcher-container {
width: clamp(300px, calc(100% - var(--ee-active-control-container-width)), 100%);
}
}

#mtp_valid_shortcodes .shortcode-field-table {
margin-top: 12px;
}
Expand All @@ -78,10 +132,6 @@
overflow: auto;
}

#ee-msg-context-switcher-frm {
display: flex;
flex-flow: row wrap;
}
#ee-recipient-select {
width: 15rem;
}
Expand Down Expand Up @@ -426,34 +476,6 @@ h4 + .ee-messages-shortcodes-chooser-wrap {
width: calc(100% - (5rem - 4px) - var(--ee-button-height));
}

/** context toggle **/
.context-active-control-container {
align-items: center;
background: white;
display: flex;
/* grid-area: msg-header-1; */
padding: 1rem 0 1rem 1rem;
width: 40rem;
--ee-switch-size: 1.5rem;
--ee-switch-size-btn: calc(var(--ee-switch-size) * .75);
--ee-switch-size-width: calc(var(--ee-switch-size) * 2);
}
.context-active-control-container .spinner {
margin: 0;
margin-inline: 1rem;
}
.activate_context_on_off_toggle_container {
align-items: center;
display: flex;
width: 100%;
}
.activate_context_on_off_toggle_container .ee-on-off-toggle-label {
/* width: 24rem; */
margin-inline-end: 1rem;
}
.activate_context_on_off_toggle_container #ee-on-off-toggle-primary_attendee {
display: none;
}

.espresso-admin.wp-core-ui .messages .mce-statusbar.mce-container.mce-panel.mce-stack-layout-item {
border-block-end-width: 2px !important;
Expand Down
8 changes: 4 additions & 4 deletions admin_pages/messages/assets/ee_message_editor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ jQuery(document).ready(function($) {
switchLabel = status === 'on'
? $('.js-data .ee-active-message').html()
: $('.js-data .ee-inactive-message').html();
$( '.context-active-control-container .spinner' ).addClass( 'is-active' );
$( '.activate_context_on_off_toggle_container .spinner' ).addClass( 'is-active' );

$.ajax({
type: "POST",
Expand All @@ -65,7 +65,7 @@ jQuery(document).ready(function($) {
where: '#ajax-notices-container',
what: 'clear'
};
$( '.context-active-control-container .spinner' ).removeClass( 'is-active' );
$( '.activate_context_on_off_toggle_container .spinner' ).removeClass( 'is-active' );
if (ct.indexOf('html') > -1) {
event.preventDefault();
MessageEditorHelper.display_content(response, setup.where, setup.what);
Expand All @@ -84,7 +84,7 @@ jQuery(document).ready(function($) {
},
error: function()
{
$( '.context-active-control-container .spinner' ).removeClass( 'is-active' );
$( '.activate_context_on_off_toggle_container .spinner' ).removeClass( 'is-active' );
event.preventDefault();
MessageEditorHelper.handle_ajax_errors(eei18n.server_error, setup.where);
}
Expand Down Expand Up @@ -146,7 +146,7 @@ jQuery(document).ready(function($) {
/**
* Context Template Activation/Deactivation
*/
$('.activate_context_on_off_toggle_container').on('click', '.ee-on-off-toggle', function(e){
$('.activate_context_on_off_toggle_container').on('click', '.ee-switch__input', function(e){
var context = $(this).attr('id').replace('ee-on-off-toggle-', ''),
status = $(this).prop('checked') ? 'on' : 'off',
message_template_group_id = $(this).data('grpid');
Expand Down
Loading