[p2pu-webcraft] jsFiddle Embed and Syntax Highlighting

[Dan Diebolt]

FWIW, the CKEditor rich text editor now appears to support the embedding of
various <iframe> content via Embed [1] as well as syntax highlighting via
prettify [2]. In addition to the embedly providers listed [3] you can embed
jsFiddles by just pasting in the jsFiddle url or directly typing the embed
code [embed:http://jsfiddle.net/dandiebolt/agaCq/]. This particaular feature
appears to either be undocumented or perhaps working as part of a default
embed protocol and requires further study. However, there is no control over
the height of the embedded fiddle as it always is give an <iframe> height of
300px. The width of the <iframe> is 100% but the size of every embeded
<iframe> is constrained by P2PU's left panel content and various margins and
padding that are always applied. Syntax highlighting is also now on the
CKEditor menu which uses Prettify. Prettify does not require the
specification of the source language and will do a fair job of syntax
highlighting any bash or c-line language as well as HTML and XML [4]. The
P2PU install includes an number of style sheets [5] for other languages.
Line numbers can be added every five lines and every single line with a
patch [6] to the css. You can see examples of the jsFiddle embed and syntax
highlighting here:

http://p2pu.org/en/groups/lernanatron/content/gist-test-embed-2/edit/

Other embed providers that are supported via the CKEditor that might be
useful for webcarft include  SlideShare, Scribd, Screencast, Brightcove,
Pastebin, github & gist, pastie and a host of video, audio and social media
embeds. I will probably go through the details of other providers which I
would anticipate being used in webcraft related course and perhaps even talk
to embedly about adding new providers such as consoles and improving
jsFiddle embedding.

[1] http://embed.ly/
[2] http://code.google.com/p/google-code-prettify/
[3] http://embed.ly/providers
[4] http://google-code-prettify.googlecode.com/svn/trunk/README.html
[5] http://p2pu.org/media/js/libs/prettify/
[6]
http://groups.google.com/group/js-code-prettifier/browse_thread/thread/faecb9ba41ff9e06?pli=1
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.p2pu.org/pipermail/p2pu-webcraft/attachments/20110916/0a88e0cc/attachment.html>