No Description

class-jetpack-recommendations-banner.php 9.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273
  1. <?php
  2. /**
  3. * Displays the site type recommendations question as a banner.
  4. *
  5. * @package automattic/jetpack
  6. */
  7. use Automattic\Jetpack\Assets;
  8. use Automattic\Jetpack\Assets\Logo as Jetpack_Logo;
  9. use Automattic\Jetpack\Tracking;
  10. /**
  11. * Jetpack_Recommendations_Banner
  12. **/
  13. class Jetpack_Recommendations_Banner {
  14. /**
  15. * Jetpack_Recommendations_Banner
  16. *
  17. * @var Jetpack_Recommendations_Banner
  18. **/
  19. private static $instance = null;
  20. /**
  21. * Factory method
  22. */
  23. public static function init() {
  24. if ( is_null( self::$instance ) ) {
  25. self::$instance = new Jetpack_Recommendations_Banner();
  26. }
  27. return self::$instance;
  28. }
  29. /**
  30. * Jetpack_Recommendations_Banner constructor.
  31. */
  32. private function __construct() {
  33. add_action( 'current_screen', array( $this, 'maybe_initialize_hooks' ) );
  34. }
  35. /**
  36. * Initialize hooks to display the banner
  37. *
  38. * @since 9.7 Added the $current_screen parameter.
  39. *
  40. * @param \WP_Screen $current_screen Current WordPress screen.
  41. */
  42. public function maybe_initialize_hooks( $current_screen ) {
  43. if ( ! $this->can_be_displayed() ) {
  44. return;
  45. }
  46. if ( Jetpack_Connection_Banner::can_be_displayed( $current_screen ) ) {
  47. // We don't want to overcrowd the screen with both the Connection banner and the Recommendations banner.
  48. return;
  49. }
  50. add_action( 'admin_print_styles', array( $this, 'admin_banner_styles' ) );
  51. add_action( 'admin_notices', array( $this, 'render_banner' ) );
  52. add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_banner_scripts' ) );
  53. }
  54. /**
  55. * Determines if the banner can be displayed
  56. */
  57. public static function can_be_displayed() {
  58. if ( ! Jetpack_Recommendations::is_banner_enabled() ) {
  59. return false;
  60. }
  61. // Only the dashboard and plugins pages should see the banner.
  62. if ( ! in_array( get_current_screen()->id, array( 'dashboard', 'plugins' ), true ) ) {
  63. return false;
  64. }
  65. if ( ! current_user_can( 'jetpack_manage_modules' ) ) {
  66. return false;
  67. }
  68. if ( Jetpack_Options::get_option( 'recommendations_banner_dismissed' ) ) {
  69. return false;
  70. }
  71. if ( ! in_array(
  72. Jetpack_Options::get_option( 'recommendations_step', 'not-started' ),
  73. array(
  74. 'not-started',
  75. 'site-type-question',
  76. ),
  77. true
  78. ) ) {
  79. return false;
  80. }
  81. return true;
  82. }
  83. /**
  84. * Handles storing the user responses in the banner.
  85. */
  86. public static function ajax_callback() {
  87. check_ajax_referer( 'jp-recommendations-banner-nonce', 'nonce' );
  88. if ( ! current_user_can( 'jetpack_manage_modules' ) ) {
  89. wp_die();
  90. }
  91. $tracking = new Tracking();
  92. if ( isset( $_REQUEST['dismissBanner'] ) && 'true' === $_REQUEST['dismissBanner'] ) {
  93. Jetpack_Options::update_option( 'recommendations_banner_dismissed', 1 );
  94. $tracking->record_user_event( 'recommendations_banner_dismissed' );
  95. wp_send_json_success();
  96. wp_die();
  97. }
  98. $data = Jetpack_Recommendations::get_recommendations_data();
  99. $tracking_answers = array();
  100. if ( isset( $_REQUEST['personal'] ) && is_string( $_REQUEST['personal'] ) ) {
  101. $value = 'true' === $_REQUEST['personal'] ? true : false;
  102. $data['site-type-personal'] = $value;
  103. $tracking_answers['personal'] = $value;
  104. }
  105. if ( isset( $_REQUEST['business'] ) && is_string( $_REQUEST['business'] ) ) {
  106. $value = 'true' === $_REQUEST['business'] ? true : false;
  107. $data['site-type-business'] = $value;
  108. $tracking_answers['business'] = $value;
  109. }
  110. if ( isset( $_REQUEST['store'] ) && is_string( $_REQUEST['store'] ) ) {
  111. $value = 'true' === $_REQUEST['store'] ? true : false;
  112. $data['site-type-store'] = $value;
  113. $tracking_answers['store'] = $value;
  114. }
  115. if ( isset( $_REQUEST['other'] ) && is_string( $_REQUEST['other'] ) ) {
  116. $value = 'true' === $_REQUEST['other'] ? true : false;
  117. $data['site-type-other'] = $value;
  118. $tracking_answers['other'] = $value;
  119. }
  120. Jetpack_Recommendations::update_recommendations_data( $data );
  121. Jetpack_Options::update_option( 'recommendations_step', 'banner-completed' );
  122. $tracking->record_user_event( 'recommendations_banner_answered', $tracking_answers );
  123. wp_send_json_success();
  124. wp_die();
  125. }
  126. /**
  127. * Enqueue JavaScript files.
  128. */
  129. public function enqueue_banner_scripts() {
  130. wp_enqueue_script(
  131. 'jetpack-recommendations-banner-js',
  132. Assets::get_file_url_for_environment(
  133. '_inc/build/jetpack-recommendations-banner.min.js',
  134. '_inc/jetpack-recommendations-banner.js'
  135. ),
  136. array( 'jquery' ),
  137. JETPACK__VERSION,
  138. true
  139. );
  140. wp_localize_script(
  141. 'jetpack-recommendations-banner-js',
  142. 'jp_banner',
  143. array(
  144. 'nonce' => wp_create_nonce( 'jp-recommendations-banner-nonce' ),
  145. 'ajax_url' => admin_url( 'admin-ajax.php' ),
  146. 'recommendations_url' => admin_url( 'admin.php?page=jetpack#/recommendations' ),
  147. )
  148. );
  149. }
  150. /**
  151. * Include the needed styles
  152. */
  153. public function admin_banner_styles() {
  154. wp_enqueue_style(
  155. 'jetpack-recommendations-banner',
  156. Assets::get_file_url_for_environment(
  157. 'css/jetpack-recommendations-banner.min.css',
  158. 'css/jetpack-recommendations-banner.css'
  159. ),
  160. array(),
  161. JETPACK__VERSION
  162. );
  163. }
  164. /**
  165. * Renders the Recommendations Banner
  166. */
  167. public function render_banner() {
  168. $jetpack_logo = new Jetpack_Logo();
  169. $site_name = get_bloginfo( 'name' );
  170. ?>
  171. <div id="jp-recommendations-banner-main" class="jp-recommendations-banner-main">
  172. <div class="jp-recommendations-banner__content">
  173. <div class="jp-recommendations-banner__logo">
  174. <?php
  175. echo $jetpack_logo->get_jp_emblem_larger(); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
  176. ?>
  177. </div>
  178. <h1 class="jp-recommendations-banner__question">
  179. <?php
  180. /* translators: placeholder is the name of the website */
  181. echo sprintf( esc_html__( 'What type of site is %s?', 'jetpack' ), esc_html( $site_name ) );
  182. ?>
  183. </h1>
  184. <p class="jp-recommendations-banner__description">
  185. <?php esc_html_e( 'This assistant will help you get the most from Jetpack. Tell us more about your goals and we’ll recommend relevant features to help you succeed.', 'jetpack' ); ?>
  186. </p>
  187. <div class="jp-recommendations-banner__answer">
  188. <form id="jp-recommendations-banner__form" class="jp-recommendations-banner__form">
  189. <div class="jp-recommendations-banner__checkboxes">
  190. <?php $this->render_checkbox( 'personal', __( 'Personal', 'jetpack' ) ); ?>
  191. <?php $this->render_checkbox( 'business', __( 'Business', 'jetpack' ) ); ?>
  192. <?php $this->render_checkbox( 'store', __( 'Store', 'jetpack' ) ); ?>
  193. <?php $this->render_checkbox( 'other', __( 'Other', 'jetpack' ) ); ?>
  194. </div>
  195. </form>
  196. <a id="jp-recommendations-banner__continue-button" class="jp-recommendations-banner__continue-button">
  197. <?php esc_html_e( 'Continue', 'jetpack' ); ?>
  198. </a>
  199. <div class="jp-recommendations-banner__continue-description">
  200. <?php esc_html_e( 'The following Jetpack recommendations are available to you later in the Jetpack dashboard.', 'jetpack' ); ?>
  201. </div>
  202. </div>
  203. </div>
  204. <div class="jp-recommendations-banner__illustration-container">
  205. <div id="jp-recommendations-banner__notice-dismiss" class="jp-recommendations-banner__notice-dismiss">
  206. <svg class="jp-recommendations-banner__svg-dismiss" width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
  207. <mask id="jp-dismiss-mask0" mask-type="alpha" maskUnits="userSpaceOnUse" x="2" y="2" width="21" height="20">
  208. <path fill-rule="evenodd" clip-rule="evenodd" d="M12.5232 2C7.02034 2 2.57227 6.47 2.57227 12C2.57227 17.53 7.02034 22 12.5232 22C18.0261 22 22.4742 17.53 22.4742 12C22.4742 6.47 18.0261 2 12.5232 2ZM15.1005 8L12.5232 10.59L9.94591 8L8.54283 9.41L11.1201 12L8.54283 14.59L9.94591 16L12.5232 13.41L15.1005 16L16.5036 14.59L13.9263 12L16.5036 9.41L15.1005 8ZM4.56245 12C4.56245 16.41 8.13484 20 12.5232 20C16.9116 20 20.484 16.41 20.484 12C20.484 7.59 16.9116 4 12.5232 4C8.13484 4 4.56245 7.59 4.56245 12Z" />
  209. </mask><g mask="url(#jp-dismiss-mask0)"><rect x="0.582031" width="23.8823" height="24" /></g></svg>
  210. <span><?php esc_attr_e( 'Dismiss', 'jetpack' ); ?></span>
  211. </div>
  212. <img
  213. src="<?php echo esc_url( plugins_url( 'images/recommendations/background.svg', JETPACK__PLUGIN_FILE ), 'jetpack' ); ?>"
  214. class="jp-recommendations-banner__illustration-background"
  215. />
  216. <img
  217. src="<?php echo esc_url( plugins_url( 'images/recommendations/site-type-illustration.jpg', JETPACK__PLUGIN_FILE ), 'jetpack' ); ?>"
  218. class="jp-recommendations-banner__illustration-foreground"
  219. />
  220. </div>
  221. </div>
  222. <?php
  223. }
  224. /**
  225. * Renders a checkbox.
  226. *
  227. * @param string $name The name to give the form input.
  228. * @param string $title The title to put on the checkbox.
  229. */
  230. private function render_checkbox( $name, $title ) {
  231. ?>
  232. <label for="<?php echo esc_html( $name ); ?>" class="jp-recommendations-answer__checkbox-label">
  233. <input id="<?php echo esc_html( $name ); ?>" name="<?php echo esc_html( $name ); ?>" type="checkbox" tabindex="-1"/>
  234. <div class="jp-recommendations-answer__title">
  235. <?php echo esc_html( $title ); ?>
  236. </div>
  237. </label>
  238. <?php
  239. }
  240. }