EOITourPointer

This class handles the pointers used in the introduction tour.

Defined (1)

The class is defined in the following location(s).

/includes/eoi-tour-pointer.php  
  1. class EOITourPointer { 
  2.  
  3. // get all infor of plugin 
  4. private $plugin_data; 
  5.  
  6. // the option fca_eoi_take_the_tour 
  7. private $options; 
  8.  
  9. // the post_type 
  10. private $post_type; 
  11.  
  12. private $settings; 
  13.  
  14. public function __construct( $settings=null ) { 
  15.  
  16. $this->settings = $settings; 
  17. $this->post_type = $settings['post_type']; 
  18. $this->options = get_option( 'fca_eoi_take_the_tour' ); 
  19.  
  20. if ( ! in_array( $this->options, array( 'closed' ) ) ) { 
  21.  
  22. add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_assets' ) ); 
  23.  
  24. add_filter( 'admin_url', array( $this, 'add_fca_eoi_tour_item_param' ) ); 
  25. add_action( 'wp_ajax_fca_eoi_take_the_tour', array( $this, 'fca_eoi_take_the_tour_pointer_ajax' ) ); 
  26.  
  27. /** 
  28. * Loads CSS and JS elements for pointer popup 
  29. */ 
  30. public function enqueue_assets() { 
  31.  
  32. wp_enqueue_style( 'wp-pointer' ); 
  33. wp_enqueue_script( 'wp-pointer' ); 
  34. add_action( 'admin_print_footer_scripts', array( $this, 'intro_tour' ) ); 
  35.  
  36. /** 
  37. * re-write the url after saving post via tour pointer 
  38. */ 
  39. function add_fca_eoi_tour_item_param ( $link ) { 
  40.  
  41. $tour_item = K::get_var( 'fca-eoi-tour-item', $_REQUEST ); 
  42. if ( ! empty( $tour_item ) ) { 
  43. $link = add_query_arg( array( 'fca-eoi-tour-item' => urlencode( $tour_item ) ), $link ); 
  44. return $link; 
  45.  
  46. /** 
  47. * Update option fca_eoi_take_the_tour 
  48. */ 
  49. function fca_eoi_take_the_tour_pointer_ajax () { 
  50.  
  51. // Verify nonce 
  52. if ( ! wp_verify_nonce( $_POST['nonce'], 'fca_eoi_take_the_tour' ) ) { 
  53. die( __( 'An error occurred, please try again.' ) ); 
  54.  
  55. // Check status 
  56. update_option( 'fca_eoi_take_the_tour', 'closed' ); 
  57. exit; 
  58.  
  59. /** 
  60. * Load the introduction tour 
  61. */ 
  62. function intro_tour() { 
  63.  
  64. global $pagenow; 
  65.  
  66. $this->plugin_data = get_plugin_data( FCA_EOI_PLUGIN_DIR . 'easy-opt-ins.php' ); 
  67.  
  68. // Ajax request template 
  69.  
  70. $ajax = ' 
  71. jQuery.ajax( { 
  72. type: "POST",  
  73. url: "' . admin_url( 'admin-ajax.php' ) . '",  
  74. data: { 
  75. action: "fca_eoi_take_the_tour",  
  76. nonce: "' . wp_create_nonce( 'fca_eoi_take_the_tour' ) . '" 
  77. } ); 
  78. '; 
  79.  
  80. // if there is more than 1 layout the number will be 6 , otherwise 5 
  81. $init_pointer_number = 5; 
  82. if ( count( glob( FCA_EOI_PLUGIN_DIR . 'layouts/*', GLOB_ONLYDIR ) ) > 1 ) { 
  83. $init_pointer_number += 1; 
  84. }; 
  85.   
  86. $page_items = array( 
  87. 'fca_eoi_form_integration' => array( 
  88. 'target' => '#fca_eoi_fieldset_form_integration',  
  89. 'options' => array( 
  90. 'content' => sprintf( '<h3>%s</h3><p>%s</p>' 
  91. , __( 'Mailing List Integration' ) 
  92. , __( 'First, integrate '. $this->plugin_data[ 'Name' ] .' with your mailing list.' ) 
  93. ),  
  94. 'position' => array( 
  95. 'edge' => 'bottom',  
  96. 'align' => 'middle' 
  97. ),  
  98. 'pointerClass' => 'fca_eoi_tour_pointer_style',  
  99. ),  
  100. 'button1' => __( 'Close' ),  
  101. 'button2' => __( 'Next' ),  
  102. 'button3' => __( 'Previous' ),  
  103. 'button1_function' => $ajax 
  104.   
  105. ),  
  106. 'fca_eoi_fieldset_thank_you_page' => array( 
  107. 'target' => '#fca_eoi_fieldset_thank_you_page',  
  108. 'options' => array( 
  109. 'content' => sprintf( '<h3>%s</h3><p>%s</p>' 
  110. , __( 'Thank you page' ) 
  111. , __( 'Next, select a thank you page <em>(selecting a thank you page is required)</em>.' ) 
  112. ),  
  113. 'position' => array( 
  114. 'edge' => 'bottom',  
  115. 'align' => 'center' 
  116. ),  
  117. 'pointerClass' => 'fca_eoi_tour_pointer_style' 
  118. ),  
  119. 'button1' => __( 'Close' ),  
  120. 'button2' => __( 'Next' ),  
  121. 'button3' => __( 'Previous' ),  
  122. 'button1_function' => $ajax 
  123. ),  
  124. 'fca_eoi_design_and_content_headline' => array( 
  125. 'target' => '#fca_eoi_design_and_content_headline',  
  126. 'options' => array( 
  127. 'content' => '<h3>' . __( 'Design & Content' ) . '</h3>' . '<p>' . __( 'You can customize your opt-in form in this area. You can click anywhere on your form to change the text, colors, etc...' ) . '</p>' 
  128. ,  
  129. 'position' => array( 'edge' => 'bottom', 'align' => 'center' ),  
  130. 'pointerClass' => 'fca_eoi_tour_pointer_style' 
  131. ),  
  132. 'button1' => __( 'Close' ),  
  133. 'button2' => __( 'Next' ),  
  134. 'button3' => __( 'Previous' ),  
  135. 'button1_function' => $ajax,  
  136. ),  
  137. 'fca_eoi_save' => array( 
  138. 'target' => '#publish',  
  139. 'options' => array( 
  140. 'content' => '<h3>' . __( 'Save' ) . '</h3>'. '<p>' . __( 'Make sure to hit *Save Form* now that you*ve set up your form.' ) . '</p>' 
  141. ,  
  142. 'position' => array( 'edge' => 'bottom', 'align' => 'left' ),  
  143. 'pointerClass' => 'fca_eoi_tour_pointer_style',  
  144. ),  
  145. 'button1' => __( 'Close' ),  
  146. 'button2' => __( 'Save Now' ),  
  147. 'button3' => __( 'Previous' ),  
  148. 'button1_function' => $ajax,  
  149. 'button2_function' => "$( '#publish' ).click()",  
  150. 'extra_function' => "var form = $(pointer.target).closest( 'form' );$(pointer.target).after( '<input type=\"hidden\" name=\"fca-eoi-tour-item\" value=\"$init_pointer_number\"/>' );" 
  151. ),  
  152. ); 
  153.   
  154. if( $init_pointer_number == 6 ) { 
  155.   
  156. $fca_eoi_choose_layout = array( 
  157. 'target' => 'a[href="#fca_eoi_meta_box_setup"]',  
  158. 'options' => array( 
  159. 'content' => '<h3>' . __( 'Choose Layout' ) . '</h3>' . '<p>' . __( 'Choose a Layout to get started.' ) . '</p>',  
  160. 'position' => array( 'edge' => 'bottom', 'align' => 'left' ),  
  161. 'pointerClass' => 'fca_eoi_tour_pointer_style' 
  162. ),  
  163. 'button1' => __( 'Close' ),  
  164. 'button2' => __( 'Next' ),  
  165. 'button3' => __( 'Previous' ),  
  166. 'button1_function' => $ajax,  
  167. 'extra_function' => "$( '[href=\"#fca_eoi_meta_box_setup\"]' ).click();",  
  168. ); 
  169. // push this array to the beginning of $page_items array 
  170. array_unshift( $page_items, $fca_eoi_choose_layout ); 
  171.   
  172. $fca_eoi_dashboard_tour_item = array( 
  173. 'target' => '#menu-posts-easy-opt-ins',  
  174. 'options' => array( 
  175. 'content' => '<h3>' . __( 'Getting started' ) . '</h3>' . '<p>' . __( 'Thanks for installing '. $this->plugin_data['Name'] .'. Click *Start Tour* to view a quick introduction of how to use this plugin.' ) . '</p>' 
  176. ,  
  177. 'position' => array( 'edge' => 'bottom', 'align' => 'center' ),  
  178. 'pointerClass' => 'fca_eoi_tour_dashboard' 
  179. ),  
  180. 'button1' => __( 'Close' ),  
  181. 'button2' => __( 'Start tour' ),  
  182. 'button1_function' => $ajax,  
  183. 'button2_function' => '' 
  184. ); 
  185.   
  186. $fca_eoi_index_tour_item = 1; 
  187.   
  188. if ( ! isset( $_GET[ 'fca-eoi-tour-item' ] ) ) { 
  189. if ( FALSE 
  190. || 'easy-opt-ins' !== $this->post_type  
  191. || ( $pagenow == 'edit.php' && 'easy-opt-ins' == $this->post_type ) 
  192. ) { 
  193. $fca_eoi_dashboard_tour_item = array( 
  194. 'target' => '#menu-posts-easy-opt-ins',  
  195. 'options' => array( 
  196. 'content' => '<h3>' . __( 'Getting started' ) . '</h3>' . '<p>' . __( 'Thanks for installing '. $this->plugin_data['Name'] .'. Click *Start Tour* to view a quick introduction of how to use this plugin.' ) . '</p>',  
  197. 'position' => array( 'edge' => 'bottom', 'align' => 'center' ),  
  198. 'pointerClass' => 'fca_eoi_tour_dashboard' 
  199. ),  
  200. 'button1' => __( 'Close' ),  
  201. 'button2' => __( 'Start tour' ),  
  202. 'button2_function' => "document.location='" . admin_url( 'post-new.php?post_type=easy-opt-ins&fca-eoi-tour-item=1' )."'",  
  203. ); 
  204.   
  205. $fca_eoi_index_tour_item = 0; 
  206. } else { 
  207. if ( K::get_var( 'fca-eoi-tour-item', $_GET ) == $init_pointer_number ) { 
  208.   
  209. $fca_eoi_index_tour_item = $init_pointer_number; 
  210. $fca_eoi_publish_tour_item = array( 
  211. 'target' => '#menu-appearance',  
  212. 'options' => array( 
  213. 'content' => '<h3> Publish </h3>' . '<p>' . __( 'You can publish your opt-in widget by going to *Appearance -> Widgets* and choosing the *Optin Cat Sidebar Widget*.' ) . '</p>' 
  214. ,  
  215. 'position' => array( 'edge' => 'top', 'align' => 'center' ),  
  216. 'pointerClass' => 'fca_eoi_tour_pointer_style' 
  217. ),  
  218. 'button1' => __( 'Close' ),  
  219. 'button3' => __( 'Previous' ),  
  220. 'button1_function' => $ajax,  
  221. ); 
  222. $page_items['fca_eoi_publish'] = $fca_eoi_publish_tour_item; 
  223. // push this array to the beginning of $page_items array 
  224. array_unshift( $page_items, $fca_eoi_dashboard_tour_item ); 
  225.   
  226. $this->print_scripts( $fca_eoi_index_tour_item , $page_items ); 
  227.   
  228. /** 
  229. * Prints the pointer script 
  230. * @param string $selector The CSS selector the pointer is attached to.  
  231. * @param array $options The options for the pointer.  
  232. * @param string $button1 Text for button 1  
  233. * @param string|bool $button2 Text for button 2 (or false to not show it, defaults to false)  
  234. * @param string $button2_function The JavaScript function to attach to button 2  
  235. * @param string $button1_function The JavaScript function to attach to button 1  
  236. */ 
  237. function print_scripts( $fca_eoi_tour_index, $options) { 
  238. ?><script> 
  239. jQuery( document ).ready( function( $ ) { 
  240. var fca_eoi_tour_pointer_options_json = <?php echo json_encode( $options ); ?>; 
  241. var fca_eoi_tour_pointer_options = []; 
  242. for ( elem in fca_eoi_tour_pointer_options_json ) { 
  243. fca_eoi_tour_pointer_options.push( fca_eoi_tour_pointer_options_json[ elem ] ); 
  244.  
  245. $( window ).load( function( $ ) { 
  246. setTimeout( function() { 
  247. fca_eoi_open_pointer( <?php echo $fca_eoi_tour_index ?> ); 
  248. }, 500 ); 
  249. } ); 
  250.  
  251. function fca_eoi_open_pointer( i ) { 
  252.  
  253. $( '[href="#fca_eoi_meta_box_build"]' ).click(); 
  254. var pointer = fca_eoi_tour_pointer_options[ i ]; 
  255. var button2_function_text = pointer.button2_function; 
  256. var button1_function_text = pointer.button1_function; 
  257. var extra_function_text = pointer.extra_function; 
  258.  
  259. // excute the extra function 
  260. if ( extra_function_text ) { 
  261. eval( extra_function_text ); 
  262.  
  263. options = $.extend( pointer.options, { 
  264. buttons:function ( event, t ) { 
  265. button = jQuery( '<a id="fca-eoi-tour-pointer-close-'+ i +'" style="margin-left:5px" class="button-secondary">' + pointer.button1 + '</a>' ); 
  266. button.bind( 'click.pointer', function () { 
  267. t.element.pointer( 'close' ); 
  268. if( pointer.button1_function ) { 
  269. eval( button1_function_text ); 
  270. } ); 
  271. return button; 
  272. },  
  273. close: function() {} 
  274. }); 
  275. $( pointer.target +':not(.expanded) legend' ).click(); 
  276. $( pointer.target ).pointer( options ).pointer( 'open' ); 
  277.  
  278. if ( pointer.button2 ) { 
  279.  
  280. jQuery( '#fca-eoi-tour-pointer-close-'+i ).after( '<a id="fca-eoi-tour-pointer-primary-'+ i +'" class="button-primary">' + pointer.button2 + '</a>' ); 
  281. jQuery( '#fca-eoi-tour-pointer-primary-' + i ).click( function ( e ) { 
  282. e.preventDefault(); 
  283. $( pointer.target ).pointer( 'close' ); 
  284. eval( button2_function_text ); 
  285. fca_eoi_open_pointer( i + 1 ); 
  286. } ); 
  287.  
  288. if ( pointer.button3 ) { 
  289. jQuery( '#fca-eoi-tour-pointer-close-'+i ).after( '<a id="fca-eoi-tour-pointer-previous-'+ i +'" class="button-secondary">' + pointer.button3 + '</a>' ); 
  290. jQuery( '#fca-eoi-tour-pointer-previous-'+i ).click( function () { 
  291. $( pointer.target ).pointer( 'close' ); 
  292. fca_eoi_open_pointer( i - 1 ); 
  293. } ); 
  294. } ); 
  295. </script><?php