Skip to content

Commit

Permalink
Fix typos & other issues in JSONP docs (#1672)
Browse files Browse the repository at this point in the history
This PR fixes some typos, indentation mistakes, and corrects the language of some `code` elements.
  • Loading branch information
RunDevelopment authored and mAAdhaTTah committed Jan 22, 2019
1 parent 2848969 commit cd058a9
Showing 1 changed file with 20 additions and 20 deletions.
40 changes: 20 additions & 20 deletions plugins/jsonp-highlight/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -24,26 +24,26 @@ <h2>JSONP Highlight</h2>

<section class="language-markup">
<h1>How to use</h1>

<p>Use the <code>data-jsonp</code> attribute on <code>&lt;pre></code> elements, like so:</p>

<pre><code>&lt;pre
class="language-javascript"
data-jsonp="https://github.com/gitapi/repos/leaverou/prism/contents/prism.js">
class="language-javascript"
data-jsonp="https://github.com/gitapi/repos/leaverou/prism/contents/prism.js">
&lt;/pre></code></pre>

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

<pre><code>&lt;pre class="&hellip;" data-jsonp="&hellip;" data-callback="cb">&lt;/pre></code></pre>

<p>
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.
</p>
</p>

<p>The following JSONP APIs are automatically detected and parsed:</p>

Expand All @@ -62,24 +62,24 @@ <h1>How to use</h1>
</li>
<li>
Register your adapter function by calling
<code>Prism.plugins.jsonphighlight.registerAdapter(function(rsp) { &hellip; })</code>.
<code class="language-javascript">Prism.plugins.jsonphighlight.registerAdapter(function(rsp) { &hellip; })</code>.
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.
</li>
</ol>

<p>
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 <code>null</code>. The DOM node that will contain the highlighted code will also
must return <code class="language-javascript">null</code>. 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 <code>class</code> or <code>data-jsonp</code> attributes to
assist in parsing the response).
</p>

<p>
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):
</p>

<pre><code>&lt;!-- perhaps this is in a .js file elsewhere -->
Expand Down Expand Up @@ -139,20 +139,20 @@ <h2>Caveat for Gists</h2>

<section>
<h1>Examples</h1>

<p>The plugin’s JS code (from GitHub):</p>
<pre class="lang-javascript" data-jsonp="https://github.com/gitapi/repos/PrismJS/prism/contents/plugins/jsonp-highlight/prism-jsonp-highlight.js"></pre>
<pre class="lang-javascript" data-jsonp="https://github.com/gitapi/repos/PrismJS/prism/contents/plugins/jsonp-highlight/prism-jsonp-highlight.js"></pre>

<p>GitHub Gist (gist contains a single file, automatically selected):</p>
<pre class="lang-javascript" data-jsonp="https://github.com/gitapi/gists/599a04c05a22f48a292d"></pre>
<pre class="lang-css" data-jsonp="https://github.com/gitapi/gists/599a04c05a22f48a292d"></pre>

<p>GitHub Gist (gist contains a multiple files, file to load specified):</p>
<pre class="lang-markup" data-jsonp="https://github.com/gitapi/gists/599a04c05a22f48a292d" data-filename="dabblet.html"></pre>
<pre class="lang-markup" data-jsonp="https://github.com/gitapi/gists/599a04c05a22f48a292d" data-filename="dabblet.html"></pre>

<p>Bitbucket API:</p>
<p>Bitbucket API:</p>
<pre class="lang-css" data-jsonp="https://bitbucket.org/!api/1.0/repositories/nauzilus/stylish/src/master/whirlpool/style.css"></pre>
<p>Custom adapter (JSON.stringify showing GitHub <a href="https://status.github.com/api/status.json">status</a>):</p>

<p>Custom adapter (JSON.stringify showing GitHub <a href="https://status.github.com/api/status.json">status</a>):</p>
<pre class="lang-javascript" data-jsonp="https://status.github.com/api/status.json" data-adapter="dump_json"></pre>

<p>Registered adapter (as above, but without explicitly declaring the <code>data-adapter</code> attribute):</p>
Expand Down

0 comments on commit cd058a9

Please sign in to comment.