| 1 |
<?php |
| 2 |
|
| 3 |
namespace ImageOptimization\Modules\Settings\Components; |
| 4 |
|
| 5 |
use ImageOptimization\Modules\Core\Components\Pointers; |
| 6 |
use ImageOptimization\Modules\Settings\Module; |
| 7 |
use ImageOptimization\Modules\Core\Module as Core_Module; |
| 8 |
|
| 9 |
if ( ! defined( 'ABSPATH' ) ) { |
| 10 |
exit; // Exit if accessed directly. |
| 11 |
} |
| 12 |
|
| 13 |
class Settings_Pointer { |
| 14 |
const CURRENT_POINTER_SLUG = 'image-optimizer-settings'; |
| 15 |
|
| 16 |
public function admin_print_script() { |
| 17 |
if ( Core_Module::is_elementor_one() ) { |
| 18 |
return; |
| 19 |
} |
| 20 |
|
| 21 |
if ( ! current_user_can( 'manage_options' ) ) { |
| 22 |
return; |
| 23 |
} |
| 24 |
|
| 25 |
if ( $this->is_dismissed() ) { |
| 26 |
return; |
| 27 |
} |
| 28 |
|
| 29 |
wp_enqueue_script( 'wp-pointer' ); |
| 30 |
wp_enqueue_style( 'wp-pointer' ); |
| 31 |
|
| 32 |
$pointer_content = '<h3>' . esc_html__( 'Image Optimization', 'image-optimization' ) . '</h3>'; |
| 33 |
$pointer_content .= '<p>' . esc_html__( 'Head over to the Image Optimization Settings to fine-tune how your media uploads are managed.', 'image-optimization' ) . '</p>'; |
| 34 |
|
| 35 |
$pointer_content .= sprintf( |
| 36 |
'<p><a class="button button-primary image-optimization-pointer-settings-link" href="%s">%s</a></p>', |
| 37 |
admin_url( 'admin.php?page=' . Module::SETTING_BASE_SLUG ), |
| 38 |
esc_html__( 'Take me there', 'image-optimization' ) |
| 39 |
); |
| 40 |
$allowed_tags = [ |
| 41 |
'h3' => [], |
| 42 |
'p' => [], |
| 43 |
'a' => [ |
| 44 |
'class' => [], |
| 45 |
'href' => [], |
| 46 |
], |
| 47 |
]; |
| 48 |
?> |
| 49 |
<script> |
| 50 |
const onClose = () => { |
| 51 |
return jQuery.ajax( { |
| 52 |
url: ajaxurl, |
| 53 |
method: 'POST', |
| 54 |
data: { |
| 55 |
action: 'image_optimizer_pointer_dismissed', |
| 56 |
data: { |
| 57 |
pointer: '<?php echo esc_attr( static::CURRENT_POINTER_SLUG ); ?>' |
| 58 |
}, |
| 59 |
nonce: '<?php echo esc_attr( wp_create_nonce( 'image-optimization-pointer-dismissed' ) ); ?>' |
| 60 |
} |
| 61 |
} ); |
| 62 |
} |
| 63 |
|
| 64 |
jQuery( document ).ready( function( $ ) { |
| 65 |
|
| 66 |
const target = $('#toplevel_page_elementor-home').hasClass('wp-not-current-submenu') ? $('#toplevel_page_elementor-home') : $( '.image-optimizer-menu' ); |
| 67 |
|
| 68 |
target.pointer( { |
| 69 |
content: '<?php echo wp_kses( $pointer_content, $allowed_tags ); ?>', |
| 70 |
pointerClass: 'image-optimizer-settings-pointer', |
| 71 |
position: { |
| 72 |
edge: 'top', |
| 73 |
align: 'left', |
| 74 |
at: 'left+20 bottom', |
| 75 |
my: 'left top' |
| 76 |
}, |
| 77 |
close: onClose |
| 78 |
} ).pointer( 'open' ); |
| 79 |
|
| 80 |
$( '.image-optimization-pointer-settings-link' ).first().on( 'click', function( e ) { |
| 81 |
e.preventDefault(); |
| 82 |
|
| 83 |
$(this).attr( 'disabled', true ); |
| 84 |
|
| 85 |
onClose().promise().done(() => { |
| 86 |
location = $(this).attr( 'href' ); |
| 87 |
}); |
| 88 |
}) |
| 89 |
} ); |
| 90 |
</script> |
| 91 |
<style> |
| 92 |
.image-optimizer-settings-pointer .wp-pointer-content h3::before { |
| 93 |
content: ''; |
| 94 |
background: transparent; |
| 95 |
border-radius: 0; |
| 96 |
background-image: url('data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20x%3D%221.375%22%20y%3D%222.625%22%20width%3D%2229.375%22%20height%3D%2229.375%22%20rx%3D%225%22%20fill%3D%22%23FAE4FA%22%2F%3E%3Crect%20x%3D%229.875%22%20y%3D%2213.125%22%20width%3D%2212.5%22%20height%3D%2212.5%22%20rx%3D%222.5%22%20stroke%3D%22%23ED01EE%22%20stroke-width%3D%220.625%22%2F%3E%3Cpath%20d%3D%22M10.5%2025L13.8596%2020.8005C14.0752%2020.531%2014.4685%2020.4873%2014.738%2020.7029L16.887%2022.4221C17.1565%2022.6377%2017.5498%2022.594%2017.7654%2022.3245L22.375%2016.5625%22%20stroke%3D%22%23ED01EE%22%20stroke-width%3D%220.625%22%2F%3E%3Ccircle%20cx%3D%2213%22%20cy%3D%2216.25%22%20r%3D%221.25%22%20stroke%3D%22%23ED01EE%22%20stroke-width%3D%220.5%22%2F%3E%3Crect%20x%3D%2219.5%22%20width%3D%2212.5%22%20height%3D%2212.5%22%20rx%3D%226.25%22%20fill%3D%22%23ED01EE%22%2F%3E%3Ccircle%20cx%3D%2225.75%22%20cy%3D%226.25%22%20r%3D%225.625%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M25.75%200.625C22.6439%200.625%2020.125%203.14387%2020.125%206.25C20.125%209.35612%2022.6439%2011.875%2025.75%2011.875C28.8561%2011.875%2031.375%209.35612%2031.375%206.25C31.375%203.14387%2028.8561%200.625%2025.75%200.625ZM24.0625%209.0625H22.9375V3.4375H24.0625V9.0625ZM28.5625%209.0625H25.1875V7.9375H28.5625V9.0625ZM28.5625%206.8125H25.1875V5.6875H28.5625V6.8125ZM28.5625%204.5625H25.1875V3.4375H28.5625V4.5625Z%22%20fill%3D%22%23ED01EE%22%2F%3E%3C%2Fsvg%3E'); |
| 97 |
} |
| 98 |
</style> |
| 99 |
<?php |
| 100 |
} |
| 101 |
|
| 102 |
public function is_dismissed(): bool { |
| 103 |
$meta = (array) get_user_meta( get_current_user_id(), Pointers::DISMISSED_POINTERS_META_KEY, true ); |
| 104 |
|
| 105 |
return key_exists( static::CURRENT_POINTER_SLUG, $meta ); |
| 106 |
} |
| 107 |
|
| 108 |
public function __construct() { |
| 109 |
add_action( 'in_admin_header', [ $this, 'admin_print_script' ] ); |
| 110 |
} |
| 111 |
} |
| 112 |
|
