Shortcodes with dependencies on scripts, extra actions, etc.

[danielbachhuber]

There are two, somewhat common use cases that aren't handled magically with previews:

• Enqueuing a script that's output in the footer.
• Third-party code that pays attention to how many times a shortcode is used, and does something with that knowledge.

There are probably more edge cases we aren't catching. We added a couple of actions so that themes and plugins can account for this (#35), but it would be nice to have a more durable solution.

[chrisvanpatten]

Thought I responded to this but it looks like I posted in the wrong spot... womp.

Anywho, I noticed that the shortcode_ui_after_do_shortcode only seems to apply to TinyMCE, and not the preview too. Is that intentional or a mistake on my part?

Also I noticed that I couldn't use my existing method with wp_enqueue_* calls... I had to create a separate method that manually echos out the script/style tags my shortcode needs to get it to show properly in TinyMCE.

[danielbachhuber]

Anywho, I noticed that the shortcode_ui_after_do_shortcode only seems to apply to TinyMCE, and not the preview too. Is that intentional or a mistake on my part?

Hm, this might fix an outstanding bug of ours :) Where did you notice this?

Also I noticed that I couldn't use my existing method with wpenqueue* calls... I had to create a separate method that manually echos out the script/style tags my shortcode needs to get it to show properly in TinyMCE.

Right, that's the implementation right now.

[chrisvanpatten]

Anywho, I noticed that the shortcode_ui_after_do_shortcode only seems to apply to TinyMCE, and not the preview too. Is that intentional or a mistake on my part?

Hm, this might fix an outstanding bug of ours :) Where did you notice this?

Okay this one's my bad. It's echoing things in the right spot, but for whatever reason the JS isn't actually doing anything. But I'm guessing that's a problem with the JS (JuxtaposeJS), not Shortcake.

Also I noticed that I couldn't use my existing method with wpenqueue* calls... I had to create a separate method that manually echos out the script/style tags my shortcode needs to get it to show properly in TinyMCE.

Right, that's the implementation right now.

Argh, unfinished thought on my part :) I guess what I meant was that it'd be cool if there were an equivalent hook, like shortcode_ui_enqueue_scripts/styles, so you could reuse the method and just attach it to multiple hooks.

I have no idea what it would take to do that, but just an idea.

Thanks for the quick answer!

[danielbachhuber]

It's echoing things in the right spot, but for whatever reason the JS isn't actually doing anything. But I'm guessing that's a problem with the JS (JuxtaposeJS), not Shortcake.

Heh, we're using the JS. We have a method on our Image_Comparison class like this:

/**
 * Get the image comparer dependencies when applicable
 *
 * @return string
 */
public static function get_dependencies() {

    if ( !self::$page_image_comparer ) {
        return '';
    }

    return '<link rel="stylesheet" href="' . esc_url( get_template_directory_uri() . '/assets/vendor/juxtaposejs/juxtapose.css' ) . '"><script src="' . esc_url( includes_url( 'js/jquery/jquery.js') ) . '"></script><script type="text/javascript" src="' . esc_url( get_template_directory_uri() . '/assets/vendor/juxtaposejs/juxtapose.js') . '"></script>';

}

And then we call it like this:

add_action( 'shortcode_ui_after_do_shortcode', function( $shortcode ) {
    echo \Fusion\Shortcodes\Image_Comparison::get_dependencies();
});

It's just used for Shortcake.

I guess what I meant was that it'd be cool if there were an equivalent hook, like shortcode_ui_enqueue_scripts/styles, so you could reuse the method and just attach it to multiple hooks.

Good suggestion — might work. We do need to work something more robust out.