| 1 |
<?php namespace TierPricingTable\Addons\GlobalTieredPricing\CPT\Form; |
| 2 |
|
| 3 |
/** |
| 4 |
* A short banner above the rule form: the steps of making a rule, each linking to its tab, and how |
| 5 |
* rules resolve against each other. Every user sees it until they dismiss it; the dismissal is |
| 6 |
* stored per user. |
| 7 |
*/ |
| 8 |
class Guide { |
| 9 |
|
| 10 |
const USER_META = 'tpt_rule_guide_dismissed'; |
| 11 |
|
| 12 |
const AJAX_ACTION = 'tpt_dismiss_rule_guide'; |
| 13 |
|
| 14 |
const DOCS_URL = 'https://tiered-pricing.com/documentation/user/#global-pricing-rules'; |
| 15 |
|
| 16 |
public function __construct() { |
| 17 |
add_action( 'wp_ajax_' . self::AJAX_ACTION, array( $this, 'dismiss' ) ); |
| 18 |
} |
| 19 |
|
| 20 |
public static function isDismissed(): bool { |
| 21 |
return (bool) get_user_meta( get_current_user_id(), self::USER_META, true ); |
| 22 |
} |
| 23 |
|
| 24 |
public function dismiss() { |
| 25 |
check_ajax_referer( self::AJAX_ACTION, 'nonce' ); |
| 26 |
|
| 27 |
update_user_meta( get_current_user_id(), self::USER_META, 1 ); |
| 28 |
|
| 29 |
wp_send_json_success(); |
| 30 |
} |
| 31 |
|
| 32 |
public function render() { |
| 33 |
if ( self::isDismissed() ) { |
| 34 |
return; |
| 35 |
} |
| 36 |
|
| 37 |
$tab = function ( string $id, string $text ): string { |
| 38 |
return '<a href="#" data-tab="' . esc_attr( $id ) . '">' . esc_html( $text ) . '</a>'; |
| 39 |
}; |
| 40 |
?> |
| 41 |
<div class="tpt-rule-guide" data-nonce="<?php echo esc_attr( wp_create_nonce( self::AJAX_ACTION ) ); ?>"> |
| 42 |
<div class="tpt-rule-guide__head"> |
| 43 |
<strong><?php esc_html_e( 'Making a pricing rule', 'tier-pricing-table' ); ?></strong> |
| 44 |
<button type="button" class="tpt-rule-guide__close tpt-rule-guide__dismiss" aria-label="<?php esc_attr_e( 'Dismiss', 'tier-pricing-table' ); ?>">×</button> |
| 45 |
</div> |
| 46 |
|
| 47 |
<ol class="tpt-rule-guide__steps"> |
| 48 |
<li> |
| 49 |
<?php |
| 50 |
printf( |
| 51 |
/* translators: 1: link "Pricing", 2: link "Quantity limits" */ |
| 52 |
esc_html__( 'Set the prices, tiers or quantity limits on the %1$s and %2$s tabs.', 'tier-pricing-table' ), |
| 53 |
wp_kses_post( $tab( 'pricing', __( 'Pricing', 'tier-pricing-table' ) ) ), |
| 54 |
wp_kses_post( $tab( 'quantity', __( 'Quantity limits', 'tier-pricing-table' ) ) ) |
| 55 |
); |
| 56 |
?> |
| 57 |
</li> |
| 58 |
<li> |
| 59 |
<?php |
| 60 |
printf( |
| 61 |
/* translators: 1: link "products", 2: link "customers" */ |
| 62 |
esc_html__( 'Choose the %1$s and %2$s it covers. An empty list covers all of them.', 'tier-pricing-table' ), |
| 63 |
wp_kses_post( $tab( 'products-and-categories', __( 'products', 'tier-pricing-table' ) ) ), |
| 64 |
wp_kses_post( $tab( 'user-and-roles', __( 'customers', 'tier-pricing-table' ) ) ) |
| 65 |
); |
| 66 |
?> |
| 67 |
</li> |
| 68 |
<li> |
| 69 |
<?php |
| 70 |
printf( |
| 71 |
/* translators: %s: link "Priority Settings" */ |
| 72 |
esc_html__( 'Decide how it meets product-level pricing on the %s tab.', 'tier-pricing-table' ), |
| 73 |
wp_kses_post( $tab( 'settings', __( 'Priority Settings', 'tier-pricing-table' ) ) ) |
| 74 |
); |
| 75 |
?> |
| 76 |
</li> |
| 77 |
<li> |
| 78 |
<?php |
| 79 |
printf( |
| 80 |
/* translators: %s: link "Rule status box" */ |
| 81 |
esc_html__( 'Publish, then use "Test this rule" in the %s to see what a customer pays.', 'tier-pricing-table' ), |
| 82 |
'<a href="#" data-scroll="#tpt-rule-status-box">' . esc_html__( 'Rule status box', 'tier-pricing-table' ) . '</a>' |
| 83 |
); |
| 84 |
?> |
| 85 |
</li> |
| 86 |
</ol> |
| 87 |
|
| 88 |
<p class="tpt-rule-guide__foot"> |
| 89 |
<?php esc_html_e( 'When several rules match the same product and customer, the rule with the lowest priority number is applied. The Rule status box lists the rules that override the one you are editing.', 'tier-pricing-table' ); ?> |
| 90 |
<span class="tpt-rule-guide__links"> |
| 91 |
<a href="<?php echo esc_url( self::DOCS_URL ); ?>" target="_blank" rel="noopener"><?php esc_html_e( 'Read the guide', 'tier-pricing-table' ); ?></a> |
| 92 |
<span aria-hidden="true">·</span> |
| 93 |
<a href="#" class="tpt-rule-guide__dismiss"><?php esc_html_e( 'Don\'t show again', 'tier-pricing-table' ); ?></a> |
| 94 |
</span> |
| 95 |
</p> |
| 96 |
</div> |
| 97 |
<style> |
| 98 |
.tpt-rule-guide { |
| 99 |
position: relative; |
| 100 |
margin: 16px 0 0; |
| 101 |
padding: 12px 44px 12px 16px; |
| 102 |
border: 1px solid #c3c4c7; |
| 103 |
border-left: 4px solid var(--wp-admin-theme-color, #2271b1); |
| 104 |
border-radius: 3px; |
| 105 |
background: #fff; |
| 106 |
box-shadow: 0 1px 1px rgba(0, 0, 0, .04); |
| 107 |
} |
| 108 |
|
| 109 |
.tpt-rule-guide__head strong { |
| 110 |
font-size: 14px; |
| 111 |
} |
| 112 |
|
| 113 |
.tpt-rule-guide__close { |
| 114 |
position: absolute; |
| 115 |
top: 6px; |
| 116 |
right: 6px; |
| 117 |
width: 30px; |
| 118 |
height: 30px; |
| 119 |
padding: 0; |
| 120 |
border: 0; |
| 121 |
background: none; |
| 122 |
color: #787c82; |
| 123 |
font-size: 20px; |
| 124 |
line-height: 1; |
| 125 |
cursor: pointer; |
| 126 |
} |
| 127 |
|
| 128 |
.tpt-rule-guide__close:hover { |
| 129 |
color: #d63638; |
| 130 |
} |
| 131 |
|
| 132 |
.tpt-rule-guide__steps { |
| 133 |
display: grid; |
| 134 |
grid-template-columns: repeat(4, minmax(0, 1fr)); |
| 135 |
gap: 6px 20px; |
| 136 |
margin: 8px 0 0; |
| 137 |
padding: 0; |
| 138 |
list-style: none; |
| 139 |
counter-reset: tpt-rule-guide; |
| 140 |
} |
| 141 |
|
| 142 |
.tpt-rule-guide__steps li { |
| 143 |
position: relative; |
| 144 |
margin: 0; |
| 145 |
padding-left: 26px; |
| 146 |
line-height: 1.5; |
| 147 |
} |
| 148 |
|
| 149 |
.tpt-rule-guide__steps li::before { |
| 150 |
content: counter(tpt-rule-guide); |
| 151 |
counter-increment: tpt-rule-guide; |
| 152 |
position: absolute; |
| 153 |
left: 0; |
| 154 |
top: 1px; |
| 155 |
width: 18px; |
| 156 |
height: 18px; |
| 157 |
border-radius: 50%; |
| 158 |
background: var(--wp-admin-theme-color, #2271b1); |
| 159 |
color: #fff; |
| 160 |
font-size: 11px; |
| 161 |
font-weight: 600; |
| 162 |
line-height: 18px; |
| 163 |
text-align: center; |
| 164 |
} |
| 165 |
|
| 166 |
.tpt-rule-guide__foot { |
| 167 |
margin: 10px 0 0; |
| 168 |
color: #50575e; |
| 169 |
} |
| 170 |
|
| 171 |
.tpt-rule-guide__links { |
| 172 |
margin-left: 6px; |
| 173 |
white-space: nowrap; |
| 174 |
} |
| 175 |
|
| 176 |
@media screen and (max-width: 1248px) { |
| 177 |
.tpt-rule-guide__steps { |
| 178 |
grid-template-columns: repeat(2, minmax(0, 1fr)); |
| 179 |
} |
| 180 |
} |
| 181 |
|
| 182 |
@media screen and (max-width: 782px) { |
| 183 |
.tpt-rule-guide__steps { |
| 184 |
grid-template-columns: minmax(0, 1fr); |
| 185 |
} |
| 186 |
|
| 187 |
.tpt-rule-guide__links { |
| 188 |
display: block; |
| 189 |
margin: 6px 0 0; |
| 190 |
} |
| 191 |
} |
| 192 |
</style> |
| 193 |
<script> |
| 194 |
jQuery( function ( $ ) { |
| 195 |
var $guide = $( '.tpt-rule-guide' ); |
| 196 |
|
| 197 |
// step links open the matching tab of the form below |
| 198 |
$guide.on( 'click', '[data-tab]', function ( e ) { |
| 199 |
e.preventDefault(); |
| 200 |
$( '.tpt-global-pricing-rule-form-tab[data-target="tpt-global-pricing-rule-form-tab-' + $( this ).data( 'tab' ) + '"]' ).trigger( 'click' ); |
| 201 |
} ); |
| 202 |
|
| 203 |
$guide.on( 'click', '[data-scroll]', function ( e ) { |
| 204 |
e.preventDefault(); |
| 205 |
var $target = $( $( this ).data( 'scroll' ) ); |
| 206 |
if ( $target.length ) { |
| 207 |
$( 'html, body' ).animate( { scrollTop: $target.offset().top - 60 }, 200 ); |
| 208 |
} |
| 209 |
} ); |
| 210 |
|
| 211 |
// both the cross and "Don't show again" hide the banner for good, for this user |
| 212 |
$guide.on( 'click', '.tpt-rule-guide__dismiss', function ( e ) { |
| 213 |
e.preventDefault(); |
| 214 |
$guide.slideUp( 150 ); |
| 215 |
$.post( window.ajaxurl, { action: '<?php echo esc_js( self::AJAX_ACTION ); ?>', nonce: $guide.data( 'nonce' ) } ); |
| 216 |
} ); |
| 217 |
} ); |
| 218 |
</script> |
| 219 |
<?php |
| 220 |
} |
| 221 |
} |
| 222 |
|
