emacs-orgmode@gnu.org archives
 help / color / mirror / code / Atom feed
* html export with editable/runnable js src blocks?
@ 2016-10-27 16:01 Matt Price
  2016-10-28  9:55 ` Rasmus
  0 siblings, 1 reply; 2+ messages in thread
From: Matt Price @ 2016-10-27 16:01 UTC (permalink / raw)
  To: Org Mode

[-- Attachment #1: Type: text/plain, Size: 632 bytes --]

I feel like I've seen people do this before but my search today did not
turn up a working example online. I'd like to be able to export to html
(and by extension, to a blog or a reveal.js presentation) and have my
source code blocks -- at leas t the javascript ones -- placed in an editing
environment that allows you to actually run the code. the idea is to help
students experiment with code as you're talking about it in class.

Has anyone done this? I know it's not too hard to embed codemirror or ace
in aweb page, but I odn't know how to get org to set the blocks up right.
Would love some suggestions or examples. Thank you!

[-- Attachment #2: Type: text/html, Size: 699 bytes --]

^ permalink raw reply	[flat|nested] 2+ messages in thread

* Re: html export with editable/runnable js src blocks?
  2016-10-27 16:01 html export with editable/runnable js src blocks? Matt Price
@ 2016-10-28  9:55 ` Rasmus
  0 siblings, 0 replies; 2+ messages in thread
From: Rasmus @ 2016-10-28  9:55 UTC (permalink / raw)
  To: emacs-orgmode

Matt Price <moptop99@gmail.com> writes:

> I feel like I've seen people do this before but my search today did not
> turn up a working example online. I'd like to be able to export to html
> (and by extension, to a blog or a reveal.js presentation) and have my
> source code blocks -- at leas t the javascript ones -- placed in an editing
> environment that allows you to actually run the code. the idea is to help
> students experiment with code as you're talking about it in class.

You could add contenteditable="true" to your <pre ...> tags.  E.g.

    <pre class="src src-emacs-lisp" contenteditable="true">

On this page there’s some ideas for making it live. 

   http://html5doctor.com/the-contenteditable-attribute/

> Has anyone done this? I know it's not too hard to embed codemirror or ace
> in aweb page, but I odn't know how to get org to set the blocks up right.
> Would love some suggestions or examples. Thank you!

Unfortunately, org-html-src-block does not allow you to insert random keys
into <pre...>.  Thus, you would either have to prepare your pages with JS
on pageload, do the correction with org-export-filter-body-functions or
maybe change org-html-src-block to allow the flexibility you need.  You
might need to figure out what you want the final output to be like first.

The IPython notebook (which has some other name these days) might also be
appropriate here, though I don’t know if it does JS...

Hope it helps,
Rasmus

-- 
You people at the NSA are becoming my new best friends!

^ permalink raw reply	[flat|nested] 2+ messages in thread

end of thread, other threads:[~2016-10-28  9:56 UTC | newest]

Thread overview: 2+ messages (download: mbox.gz / follow: Atom feed)
-- links below jump to the message on this page --
2016-10-27 16:01 html export with editable/runnable js src blocks? Matt Price
2016-10-28  9:55 ` Rasmus

Code repositories for project(s) associated with this public inbox

	https://git.savannah.gnu.org/cgit/emacs/org-mode.git

This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox;
as well as URLs for read-only IMAP folder(s) and NNTP newsgroup(s).