Use icanhaz.js in WordPress Admin?

61 Views Asked by At

I wanted to use ICanHaz.js (http://icanhazjs.com/) in a custom metabox in the WordPress admin. But whenever I enqueue the script it breaks the media uploader and I get this error in the console:

Uncaught TypeError: Cannot read property 'replace' of undefined

load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,schedule,wp-ajax-response,autosave,suggest…:382 Uncaught TypeError: Cannot read property 'replace' of undefined

It doesn't seem to cause any problems on the front end, just when editing a post.

Any ideas how to get this working?

Here's the code I'm using to register and enqueue the scripts:

<?php

class SF_theme {

public function init(){
    //add actions, filters, images sizes, shortcodes, etc

    add_action( 'admin_init', array($this, 'register_admin') );
    add_action( 'init', array($this, 'register') );

    add_shortcode( 'facebook_box', array($this, 'facebook_box'));
    add_action( 'wp_enqueue_scripts', array($this, 'styles') );
    add_action( 'wp_enqueue_scripts', array($this, 'scripts') );

    add_action( 'admin_enqueue_scripts', array($this, 'admin_styles') );
    add_action( 'admin_enqueue_scripts', array($this, 'admin_scripts') );
    
}

public function register(){
    wp_register_script( 'icanhaz', get_stylesheet_directory_uri() . '/js/libs/ICanHaz.min.js', array('jquery'));
    wp_register_script( 'sf-scripts', get_stylesheet_directory_uri() . '/js/sf-script.js', array('icanhaz'));
}   

public function register_admin(){
    wp_register_style( 'sf-admin', get_stylesheet_directory_uri() . '/css/admin.css');
    wp_register_script( 'sf-admin', get_stylesheet_directory_uri() . '/js/sf-admin.js', array('icanhaz'));
}

public function styles(){
    wp_enqueue_style( 'dashicons' );
}

public function scripts(){
    
    wp_enqueue_script('sf-scripts');
}

public function admin_styles(){     
    wp_enqueue_style( 'sf-admin' );
}

public function admin_scripts(){
    wp_enqueue_script('sf-admin');
    
}   

}

$theme = new SF_theme();
$theme->init();

?>
1

There are 1 best solutions below

0
On

After a bit of investigation, I discovered that the WordPress admin area uses several script tags with the type="text/html". ICanHaz.js looks for any script tags with this type to use as it's templates, and it removes them from the DOM. So when the WordPress admin javascript looks for these tags, they no longer exist, causing the error.

So it appears I Can't Haz ICanHaz.js in my WordPress admin interface.