Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- add_action( 'admin_enqueue_scripts', 'custom_admin_pointers_header' );
- function custom_admin_pointers_header() {
- if ( custom_admin_pointers_check() ) {
- add_action( 'admin_print_footer_scripts', 'custom_admin_pointers_footer' );
- wp_enqueue_script( 'wp-pointer' );
- wp_enqueue_style( 'wp-pointer' );
- }
- }
- function custom_admin_pointers_check() {
- $admin_pointers = custom_admin_pointers();
- foreach ( $admin_pointers as $pointer => $array ) {
- if ( $array['active'] )
- return true;
- }
- }
- function custom_admin_pointers_footer() {
- $admin_pointers = custom_admin_pointers();
- ?>
- <script type="text/javascript">
- /* <![CDATA[ */
- ( function($) {
- <?php
- foreach ( $admin_pointers as $pointer => $array ) {
- if ( $array['active'] ) {
- ?>
- $( '<?php echo $array['anchor_id']; ?>' ).pointer( {
- content: '<?php echo $array['content']; ?>',
- position: {
- edge: '<?php echo $array['edge']; ?>',
- align: '<?php echo $array['align']; ?>'
- },
- close: function() {
- $.post( ajaxurl, {
- pointer: '<?php echo $pointer; ?>',
- action: 'dismiss-wp-pointer'
- } );
- }
- } ).pointer( 'open' );
- <?php
- }
- }
- ?>
- } )(jQuery);
- /* ]]> */
- </script>
- <?php
- }
- function custom_admin_pointers() {
- $dismissed = explode( ',', (string) get_user_meta( get_current_user_id(), 'dismissed_wp_pointers', true ) );
- $version = '1_0'; // replace all periods in 1.0 with an underscore
- $prefix = 'custom_admin_pointers' . $version . '_';
- $new_pointer_content = '<h3>' . __( 'Add New Item' ) . '</h3>';
- $new_pointer_content .= '<p>' . __( 'Easily add a new post, media item, link, page or user by selecting from this drop down menu.' ) . '</p>';
- $story_pointer_content = '<h3>' . __( 'Another info' ) . '</h3>';
- $story_pointer_content .= '<p>' . __( 'Lorem ipsum...' ) . '</p>';
- return array(
- $prefix . 'new_items' => array(
- 'content' => $new_pointer_content,
- 'anchor_id' => '#wp-admin-bar-new-content',
- 'edge' => 'top',
- 'align' => 'left',
- 'active' => ( ! in_array( $prefix . 'new_items', $dismissed ) )
- ),
- $prefix.'story_cover_help' => array(
- 'content' => $story_pointer_content,
- 'anchor_id' => '#save-post',
- 'edge' => 'top',
- 'align' => 'right',
- 'active' => ( ! in_array( $prefix . 'story_cover_help', $dismissed ) )
- )
- );
- }
- <?php
- $pointers = array();
- $pointers['new-items'] = array(
- 'title' => sprintf( '<h3>%s</h3>', esc_html__( 'Add New Item' ) ),
- 'content' => sprintf( '<p>%s</p>', esc_html__( 'Easily add a new post..' ) ),
- 'anchor_id' => '#wp-admin-bar-new-content',
- 'edge' => 'top',
- 'align' => 'left',
- 'where' => array( 'index.php', 'post-new.php' ) // <-- Please note this
- );
- $pointers['story_cover_help'] = array(
- 'title' => sprintf( '<h3>%s</h3>', esc_html__( 'Another info' ) ),
- 'content' => sprintf( '<p>%s</p>', esc_html__( 'Lore ipsum....' ) ),
- 'anchor_id' => '#save-post',
- 'edge' => 'top',
- 'align' => 'right',
- 'where' => array( 'post-new.php' ) // <-- Please note this
- );
- // more pointers here...
- return $pointers;
- <?php
- interface PointersManagerInterface {
- /**
- * Load pointers from file and setup id with prefix and version.
- * Cast pointers to objects.
- */
- public function parse();
- /**
- * Remove from parse pointers dismissed ones and pointers
- * that should not be shown on given page
- *
- * @param string $page Current admin page file
- */
- public function filter( $page );
- }
- <?php namespace GM;
- class PointersManager implements PointersManagerInterface {
- private $pfile;
- private $version;
- private $prefix;
- private $pointers = array();
- public function __construct( $file, $version, $prefix ) {
- $this->pfile = file_exists( $file ) ? $file : FALSE;
- $this->version = str_replace( '.', '_', $version );
- $this->prefix = $prefix;
- }
- public function parse() {
- if ( empty( $this->pfile ) ) return;
- $pointers = (array) require_once $this->pfile;
- if ( empty($pointers) ) return;
- foreach ( $pointers as $i => $pointer ) {
- $pointer['id'] = "{$this->prefix}{$this->version}_{$i}";
- $this->pointers[$pointer['id']] = (object) $pointer;
- }
- }
- public function filter( $page ) {
- if ( empty( $this->pointers ) ) return array();
- $uid = get_current_user_id();
- $no = explode( ',', (string) get_user_meta( $uid, 'dismissed_wp_pointers', TRUE ) );
- $active_ids = array_diff( array_keys( $this->pointers ), $no );
- $good = array();
- foreach( $this->pointers as $i => $pointer ) {
- if (
- in_array( $i, $active_ids, TRUE ) // is active
- && isset( $pointer->where ) // has where
- && in_array( $page, (array) $pointer->where, TRUE ) // current page is in where
- ) {
- $good[] = $pointer;
- }
- }
- $count = count( $good );
- if ( $good === 0 ) return array();
- foreach( array_values( $good ) as $i => $pointer ) {
- $good[$i]->next = $i+1 < $count ? $good[$i+1]->id : '';
- }
- return $good;
- }
- }
- add_action( 'admin_enqueue_scripts', function( $page ) {
- $file = plugin_dir_path( __FILE__ ) . 'pointers.php';
- // Arguments: pointers php file, version (dots will be replaced), prefix
- $manager = new PointersManager( $file, '5.0', 'custom_admin_pointers' );
- $manager->parse();
- $pointers = $manager->filter( $page );
- if ( empty( $pointers ) ) { // nothing to do if no pointers pass the filter
- return;
- }
- wp_enqueue_style( 'wp-pointer' );
- $js_url = plugins_url( 'pointers.js', __FILE__ );
- wp_enqueue_script( 'custom_admin_pointers', $js_url, array('wp-pointer'), NULL, TRUE );
- // data to pass to javascript
- $data = array(
- 'next_label' => __( 'Next' ),
- 'close_label' => __('Close'),
- 'pointers' => $pointers
- );
- wp_localize_script( 'custom_admin_pointers', 'MyAdminPointers', $data );
- } );
- ( function($, MAP) {
- $(document).on( 'MyAdminPointers.setup_done', function( e, data ) {
- e.stopImmediatePropagation();
- MAP.setPlugin( data ); // open first popup
- } );
- $(document).on( 'MyAdminPointers.current_ready', function( e ) {
- e.stopImmediatePropagation();
- MAP.openPointer(); // open a popup
- } );
- MAP.js_pointers = {}; // contain js-parsed pointer objects
- MAP.first_pointer = false; // contain first pointer anchor jQuery object
- MAP.current_pointer = false; // contain current pointer jQuery object
- MAP.last_pointer = false; // contain last pointer jQuery object
- MAP.visible_pointers = []; // contain ids of pointers whose anchors are visible
- MAP.hasNext = function( data ) { // check if a given pointer has valid next property
- return typeof data.next === 'string'
- && data.next !== ''
- && typeof MAP.js_pointers[data.next].data !== 'undefined'
- && typeof MAP.js_pointers[data.next].data.id === 'string';
- };
- MAP.isVisible = function( data ) { // check if anchor for given pointer is visible
- return $.inArray( data.id, MAP.visible_pointers ) !== -1;
- };
- // given a pointer object, return its the anchor jQuery object if available
- // otherwise return first available, lookin at next property of subsequent pointers
- MAP.getPointerData = function( data ) {
- var $target = $( data.anchor_id );
- if ( $.inArray(data.id, MAP.visible_pointers) !== -1 ) {
- return { target: $target, data: data };
- }
- $target = false;
- while( MAP.hasNext( data ) && ! MAP.isVisible( data ) ) {
- data = MAP.js_pointers[data.next].data;
- if ( MAP.isVisible( data ) ) {
- $target = $(data.anchor_id);
- }
- }
- return MAP.isVisible( data )
- ? { target: $target, data: data }
- : { target: false, data: false };
- };
- // take pointer data and setup pointer plugin for anchor element
- MAP.setPlugin = function( data ) {
- if ( typeof MAP.last_pointer === 'object') {
- MAP.last_pointer.pointer('destroy');
- MAP.last_pointer = false;
- }
- MAP.current_pointer = false;
- var pointer_data = MAP.getPointerData( data );
- if ( ! pointer_data.target || ! pointer_data.data ) {
- return;
- }
- $target = pointer_data.target;
- data = pointer_data.data;
- $pointer = $target.pointer({
- content: data.title + data.content,
- position: { edge: data.edge, align: data.align },
- close: function() {
- // open next pointer if it exists
- if ( MAP.hasNext( data ) ) {
- MAP.setPlugin( MAP.js_pointers[data.next].data );
- }
- $.post( ajaxurl, { pointer: data.id, action: 'dismiss-wp-pointer' } );
- }
- });
- MAP.current_pointer = { pointer: $pointer, data: data };
- $(document).trigger( 'MyAdminPointers.current_ready' );
- };
- // scroll the page to current pointer then open it
- MAP.openPointer = function() {
- var $pointer = MAP.current_pointer.pointer;
- if ( ! typeof $pointer === 'object' ) {
- return;
- }
- $('html, body').animate({ // scroll page to pointer
- scrollTop: $pointer.offset().top - 30
- }, 300, function() { // when scroll complete
- MAP.last_pointer = $pointer;
- var $widget = $pointer.pointer('widget');
- MAP.setNext( $widget, MAP.current_pointer.data );
- $pointer.pointer( 'open' ); // open
- });
- };
- // if there is a next pointer set button label to "Next", to "Close" otherwise
- MAP.setNext = function( $widget, data ) {
- if ( typeof $widget === 'object' ) {
- var $buttons = $widget.find('.wp-pointer-buttons').eq(0);
- var $close = $buttons.find('a.close').eq(0);
- $button = $close.clone(true, true).removeClass('close');
- $buttons.find('a.close').remove();
- $button.addClass('button').addClass('button-primary');
- has_next = false;
- if ( MAP.hasNext( data ) ) {
- has_next_data = MAP.getPointerData(MAP.js_pointers[data.next].data);
- has_next = has_next_data.target && has_next_data.data;
- }
- var label = has_next ? MAP.next_label : MAP.close_label;
- $button.html(label).appendTo($buttons);
- }
- };
- $(MAP.pointers).each(function(index, pointer) { // loop pointers data
- if( ! $().pointer ) return; // do nothing if pointer plugin isn't available
- MAP.js_pointers[pointer.id] = { data: pointer };
- var $target = $(pointer.anchor_id);
- if ( $target.length && $target.is(':visible') ) { // anchor exists and is visible?
- MAP.visible_pointers.push(pointer.id);
- if ( ! MAP.first_pointer ) {
- MAP.first_pointer = pointer;
- }
- }
- if ( index === ( MAP.pointers.length - 1 ) && MAP.first_pointer ) {
- $(document).trigger( 'MyAdminPointers.setup_done', MAP.first_pointer );
- }
- });
- } )(jQuery, MyAdminPointers); // MyAdminPointers is passed by `wp_localize_script`
- // Create as a class
- class testWPpointers {
- // Define pointer version
- const DISPLAY_VERSION = 'v1.0';
- // Initiate construct
- function __construct () {
- add_action('admin_enqueue_scripts', array($this, 'admin_enqueue_scripts')); // Hook to admin_enqueue_scripts
- }
- function admin_enqueue_scripts () {
- // Check to see if user has already dismissed the pointer tour
- $dismissed = explode (',', get_user_meta (wp_get_current_user ()->ID, 'dismissed_wp_pointers', true));
- $do_tour = !in_array ('test_wp_pointer', $dismissed);
- // If not, we are good to continue
- if ($do_tour) {
- // Enqueue necessary WP scripts and styles
- wp_enqueue_style ('wp-pointer');
- wp_enqueue_script ('wp-pointer');
- // Finish hooking to WP admin areas
- add_action('admin_print_footer_scripts', array($this, 'admin_print_footer_scripts')); // Hook to admin footer scripts
- add_action('admin_head', array($this, 'admin_head')); // Hook to admin head
- }
- }
- // Used to add spacing between the two buttons in the pointer overlay window.
- function admin_head () {
- ?>
- <style type="text/css" media="screen">
- #pointer-primary {
- margin: 0 5px 0 0;
- }
- </style>
- <?php
- }
- // Define footer scripts
- function admin_print_footer_scripts () {
- // Define global variables
- global $pagenow;
- global $current_user;
- //*****************************************************************************************************
- // This is our array of individual pointers.
- // -- The array key should be unique. It is what will be used to 'advance' to the next pointer.
- // -- The 'id' should correspond to an html element id on the page.
- // -- The 'content' will be displayed inside the pointer overlay window.
- // -- The 'button2' is the text to show for the 'action' button in the pointer overlay window.
- // -- The 'function' is the method used to reload the window (or relocate to a new window).
- // This also creates a query variable to add to the end of the url.
- // The query variable is used to determine which pointer to display.
- //*****************************************************************************************************
- $tour = array (
- 'quick_press' => array (
- 'id' => '#dashboard_quick_press',
- 'content' => '<h3>' . __('Congratulations!', 'test_lang') . '</h3>'
- . '<p><strong>' . __('WP Pointers is working properly.', 'test_lang') . '</strong></p>'
- . '<p>' . __('This pointer is attached to the "Quick Draft" admin widget.', 'test_lang') . '</p>'
- . '<p>' . __('Our next pointer will take us to the "Settings" admin menu.', 'test_lang') . '</p>',
- 'button2' => __('Next', 'test_lang'),
- 'function' => 'window.location="' . $this->get_admin_url('options-general.php', 'site_title') . '"' // We are relocating to "Settings" page with the 'site_title' query var
- ),
- 'site_title' => array (
- 'id' => '#blogname',
- 'content' => '<h3>' . __('Moving along to Site Title.', 'test_lang') . '</h3>'
- . '<p><strong>' . __('Another WP Pointer.', 'test_lang') . '</strong></p>'
- . '<p>' . __('This pointer is attached to the "Blog Title" input field.', 'test_lang') . '</p>',
- 'button2' => __('Next', 'test_lang'),
- 'function' => 'window.location="' . $this->get_admin_url('index.php', 'quick_press_last') . '"' // We are relocating back to "Dashboard" with 'quick_press_last' query var
- ),
- 'quick_press_last' => array (
- 'id' => '#dashboard_quick_press',
- 'content' => '<h3>' . __('This concludes our WP Pointers tour.', 'test_lang') . '</h3>'
- . '<p><strong>' . __('Last WP Pointer.', 'test_lang') . '</strong></p>'
- . '<p>' . __('When closing the pointer tour; it will be saved in the users custom meta. The tour will NOT be shown to that user again.', 'test_lang') . '</p>'
- )
- );
- // Determine which tab is set in the query variable
- $tab = isset($_GET['tab']) ? $_GET['tab'] : '';
- // Define other variables
- $function = '';
- $button2 = '';
- $options = array ();
- $show_pointer = false;
- // *******************************************************************************************************
- // This will be the first pointer shown to the user.
- // If no query variable is set in the url.. then the 'tab' cannot be determined... and we start with this pointer.
- // *******************************************************************************************************
- if (!array_key_exists($tab, $tour)) {
- $show_pointer = true;
- $file_error = true;
- $id = '#dashboard_right_now'; // Define ID used on page html element where we want to display pointer
- $content = '<h3>' . sprintf (__('Test WP Pointers %s', 'test_lang'), self::DISPLAY_VERSION) . '</h3>';
- $content .= __('<p>Welcome to Test WP Pointers admin tour!</p>', 'test_lang');
- $content .= __('<p>This pointer is attached to the "At a Glance" dashboard widget.</p>', 'test_lang');
- $content .= '<p>' . __('Click the <em>Begin Tour</em> button to get started.', 'test_lang' ) . '</p>';
- $options = array (
- 'content' => $content,
- 'position' => array ('edge' => 'top', 'align' => 'left')
- );
- $button2 = __('Begin Tour', 'test_lang' );
- $function = 'document.location="' . $this->get_admin_url('index.php', 'quick_press') . '";';
- }
- // Else if the 'tab' is set in the query variable.. then we can determine which pointer to display
- else {
- if ($tab != '' && in_array ($tab, array_keys ($tour))) {
- $show_pointer = true;
- if (isset ($tour[$tab]['id'])) {
- $id = $tour[$tab]['id'];
- }
- $options = array (
- 'content' => $tour[$tab]['content'],
- 'position' => array ('edge' => 'top', 'align' => 'left')
- );
- $button2 = false;
- $function = '';
- if (isset ($tour[$tab]['button2'])) {
- $button2 = $tour[$tab]['button2'];
- }
- if (isset ($tour[$tab]['function'])) {
- $function = $tour[$tab]['function'];
- }
- }
- }
- // If we are showing a pointer... let's load the jQuery.
- if ($show_pointer) {
- $this->make_pointer_script ($id, $options, __('Close', 'test_lang'), $button2, $function);
- }
- }
- // This function is used to reload the admin page.
- // -- $page = the admin page we are passing (index.php or options-general.php)
- // -- $tab = the NEXT pointer array key we want to display
- function get_admin_url($page, $tab) {
- $url = admin_url();
- $url .= $page.'?tab='.$tab;
- return $url;
- }
- // Print footer scripts
- function make_pointer_script ($id, $options, $button1, $button2=false, $function='') {
- ?>
- <script type="text/javascript">
- (function ($) {
- // Define pointer options
- var wp_pointers_tour_opts = <?php echo json_encode ($options); ?>, setup;
- wp_pointers_tour_opts = $.extend (wp_pointers_tour_opts, {
- // Add 'Close' button
- buttons: function (event, t) {
- button = jQuery ('<a id="pointer-close" class="button-secondary">' + '<?php echo $button1; ?>' + '</a>');
- button.bind ('click.pointer', function () {
- t.element.pointer ('close');
- });
- return button;
- },
- close: function () {
- // Post to admin ajax to disable pointers when user clicks "Close"
- $.post (ajaxurl, {
- pointer: 'test_wp_pointer',
- action: 'dismiss-wp-pointer'
- });
- }
- });
- // This is used for our "button2" value above (advances the pointers)
- setup = function () {
- $('<?php echo $id; ?>').pointer(wp_pointers_tour_opts).pointer('open');
- <?php if ($button2) { ?>
- jQuery ('#pointer-close').after ('<a id="pointer-primary" class="button-primary">' + '<?php echo $button2; ?>' + '</a>');
- jQuery ('#pointer-primary').click (function () {
- <?php echo $function; ?> // Execute button2 function
- });
- jQuery ('#pointer-close').click (function () {
- // Post to admin ajax to disable pointers when user clicks "Close"
- $.post (ajaxurl, {
- pointer: 'test_wp_pointer',
- action: 'dismiss-wp-pointer'
- });
- })
- <?php } ?>
- };
- if (wp_pointers_tour_opts.position && wp_pointers_tour_opts.position.defer_loading) {
- $(window).bind('load.wp-pointers', setup);
- }
- else {
- setup ();
- }
- }) (jQuery);
- </script>
- <?php
- }
- }
- $testWPpointers = new testWPpointers();
Add Comment
Please, Sign In to add comment