diff --git a/plugins/jsonp-highlight/index.html b/plugins/jsonp-highlight/index.html index 2ad4ac9a1f..17d71b5d15 100644 --- a/plugins/jsonp-highlight/index.html +++ b/plugins/jsonp-highlight/index.html @@ -24,26 +24,26 @@

JSONP Highlight

How to use

- +

Use the data-jsonp attribute on <pre> elements, like so:

- +
<pre
-  class="language-javascript"
-  data-jsonp="https://api.github.com/repos/leaverou/prism/contents/prism.js">
+	class="language-javascript"
+	data-jsonp="https://api.github.com/repos/leaverou/prism/contents/prism.js">
 </pre>
- +

- Don't specifiy the callback query parameter in the URL; this will be added + Don't specify the callback query parameter in the URL; this will be added automatically. If the API expects a different callback parameter name however, use the data-callback parameter to specify the name:

- +
<pre class="…" data-jsonp="…" data-callback="cb"></pre>

The next trick is of course actually extracting something from the JSONP response worth highlighting, which means processing the response to extract the interesting data. -

+

The following JSONP APIs are automatically detected and parsed:

@@ -62,16 +62,16 @@

How to use

  • Register your adapter function by calling - Prism.plugins.jsonphighlight.registerAdapter(function(rsp) { … }). + Prism.plugins.jsonphighlight.registerAdapter(function(rsp) { … }). It will be added to the list of inbuilt adapters and used if no other registered - adapater (e.g. GitHub/Bitbucket) can parse the response. + adapter (e.g. GitHub/Bitbucket) can parse the response.
  • - +

    In either case, the function must accept at least a single parameter (the JSONP response) and returns a string of the content to highlight. If your adapter cannot parse the response, you - must return null. The DOM node that will contain the highlighted code will also + must return null. The DOM node that will contain the highlighted code will also be passed in as the second argument, incase you need to use it to query any extra information (maybe you wish to inspect the class or data-jsonp attributes to assist in parsing the response). @@ -79,7 +79,7 @@

    How to use

    The following example demonstrates both methods of using a custom adapter, to simply return - the stringyfied JSONP response (i.e highlight the entire JSONP data): + the stringified JSONP response (i.e highlight the entire JSONP data):

    <!-- perhaps this is in a .js file elsewhere -->
    @@ -139,20 +139,20 @@ 

    Caveat for Gists

    Examples

    - +

    The plugin’s JS code (from GitHub):

    -
    
    +	
    
     
     	

    GitHub Gist (gist contains a single file, automatically selected):

    -
    
    +	
    
     
     	

    GitHub Gist (gist contains a multiple files, file to load specified):

    -
    
    +	
    
     
    - 	

    Bitbucket API:

    +

    Bitbucket API:

    
    - 	
    - 	

    Custom adapter (JSON.stringify showing GitHub status):

    + +

    Custom adapter (JSON.stringify showing GitHub status):

    
     
     	

    Registered adapter (as above, but without explicitly declaring the data-adapter attribute):