emacs-orgmode@gnu.org archives
 help / color / mirror / code / Atom feed
From: Martin Alsinet <martin@alsinet.com.ar>
To: "numbchild@gmail.com" <numbchild@gmail.com>
Cc: emacs-orgmode <emacs-orgmode@gnu.org>
Subject: Re: Hope ob-js can support :session feature
Date: Sat, 23 Dec 2017 03:06:27 +0000	[thread overview]
Message-ID: <CABUJmkA1bogoLXz_44JdPrGMzxeVRrxk=cBmMvpu4VTpbN76yw@mail.gmail.com> (raw)
In-Reply-To: <CAL1eYu+5EerGPg-=jKwpusL+gfBc07fkQp-jg4XBeG10Z-R-ig@mail.gmail.com>

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

Hello,

I don't have a blog yet, it is in my list of new year's resolutions. I will
try to explain it here anyway, maybe it can serve as a draft for a blog
post.

When you hit *C-c* inside of a javascript source block, *ob-js* takes the
js code from the js block and saves it into a temp file (in linux the temp
file will be in saved /tmp/random-name, while in Mac OS X it will be saved
in /var/folders/random-name). Then, it uses *org-babel-eval* to execute the
js code, which in turn creates a temp buffer, inserts the contents of the
temp file into the temp buffer and uses *shell-command-on-region* to run
the js code with *node* as the executed command.

That is the reason why you must use absolute paths in the require, because
when the code runs it is no longer in the same directory of the org file,
but in a temporary folder. If you use require("./src/my-component.js"),
require won't find the js file because it is in another directory.

Let's try an example (if you want you can send me one of your examples and
I can modify it to use my approach)

First, I will define two functions to show an array of javascript objects
as an org-mode table:

#+BEGIN_SRC js :tangle src/table.js
function table_row(cells){
    console.log("|" + cells.join("|") + "|");
}
function table(rows){
    console.log("|---|");
    table_row(Object.keys(rows[0]));
    console.log("|---|");
    rows.map(row => table_row(Object.keys(row).map(k => row[k])));
    console.log("|---|");
}
module.exports = table;
#+END_SRC

Notice the :tangle src/table.js property, which I will use to require it in
a later block:

#+BEGIN_SRC js :results output raw drawer
var data = [ { day: 'SUNDAY', accidents: 3986 },
  { day: 'MONDAY', accidents: 6109 },
  { day: 'SATURDAY', accidents: 6274 },
  { day: 'WEDNESDAY', accidents: 6453 },
  { day: 'THURSDAY', accidents: 6546 },
  { day: 'TUESDAY', accidents: 6557 },
  { day: 'FRIDAY', accidents: 6916 } ];

// here you have to use the full path to the table.js file
var view_as_table = require("/app/src/table.js");

view_as_table(data);
#+END_SRC

Then I run *org-babel-tangle* to write the table.js file, and when I hit
*C-c* inside of this last block, it requires the tangled table.js file,
runs the function and we get the following results:

#+RESULTS:
:RESULTS:
|-----------+-----------|
| day       | accidents |
|-----------+-----------|
| SUNDAY    |      3986 |
| MONDAY    |      6109 |
| SATURDAY  |      6274 |
| WEDNESDAY |      6453 |
| THURSDAY  |      6546 |
| TUESDAY   |      6557 |
| FRIDAY    |      6916 |
|-----------+-----------|
:END:

About the order of execution, if you used sessions in my example, you have
to run the first block (which defines the function) before running the
second (which uses it), or it would fail because the table function has not
been loaded.

Now imagine a very long document with dozens of source blocks. In order to
run the block number 23, you will have to run all the preceding blocks on
which that block depends. I don't like that, even if the document is meant
to be read sequentially, from start to finish, I want to be able to open
the org file, go to any section and running  any source code block without
having to remember the sequence of dependencies between them. Worst case,
all I have to do is run org-babel-tangle to update the tangled files. This
has also the added benefit that it forces me to structure my blocks
correctly, from a code architecture point of view.

I hope this makes it clearer for you.


Martin

On Fri, Dec 22, 2017 at 8:07 PM numbchild@gmail.com <numbchild@gmail.com>
wrote:

>
> Can you describe how do you do this in detailed?
> Like:
> > but since I am using docker containers to run node, I always mount the
> current directory as a volume in /app inside the container, so that works
> out fine.
> > I also think that this way forces me to separate the code in modular
> blocks, which is already a good practice in itself.
> How to do this? About this: > With sessions you have to make sure to
> execute the blocks in the correct order to build the "state" that your
> current block needs.
> I think have to use `noweb` reference here.
> (If you have a blog article describe this whole JS literate programming
> setup, that will be useful.)
> Finally, thanks you provide this paradigm.
>
> [stardiviner]           <Hack this world!>      GPG key ID: 47C32433
> IRC(freeenode): stardiviner                     Twitter:  @numbchild
> Key fingerprint = 9BAA 92BC CDDD B9EF 3B36  CB99 B8C4 B8E5 47C3 2433
> Blog: http://stardiviner.github.io/
>
> On Sat, Dec 23, 2017 at 2:32 AM, Martin Alsinet <martin@alsinet.com.ar>
> wrote:
>
>> Hello stardiviner,
>>
>> On Fri, Dec 22, 2017 at 6:57 AM stardiviner <numbchild@gmail.com> wrote:
>>
>>>
>>> I wish to do JavaScript Literate Programming in Org-mode.
>>>
>>> So the :session header argument is very necessary.
>>>
>>>
>> I do Literate Programming in Javascript with Org-mode, and I have found a
>> workaround using a combination of tangled files and require.
>>
>> I separate the logic in source code blocks which then I tangle into js
>> files and I require those js files in other source blocks.
>>
>> Example:
>>
>> #+BEGIN_SRC js :tangle src/parser.js
>> const fs = require('fs');
>> const parse = require('csv-parse')
>>
>> function columns(line){
>>     return line.map(s => s.toLowerCase());
>> }
>> parse_csv = function(filename, fn, limit){
>>     fs.readFile(filename, "utf8", function (err, fileData) {
>>         var opts = {columns: columns, trim: true};
>>         if (limit) {
>>             opts.to = limit;
>>         }
>>         parse(fileData, opts, (err, rows) => fn(rows));
>>     });
>> }
>> module.exports = parse_csv;
>> #+END_SRC
>>
>> So, I tangle that source block into a js file, and then I can use it from
>> other blocks, without needing sessions at all:
>>
>> #+BEGIN_SRC
>> const parser = require("/app/src/parser.js");
>> const inputFile = './data/records.csv';
>> parse_csv(inputFile, console.log);
>> #+END_SRC
>>
>> The only drawback is that you have to use absolute paths requiring the js
>> files, but since I am using docker containers to run node, I always mount
>> the current directory as a volume in /app inside the container, so that
>> works out fine.
>> I also think that this way forces me to separate the code in modular
>> blocks, which is already a good practice in itself.
>> With sessions you have to make sure to execute the blocks in the correct
>> order to build the "state" that your current block needs.
>> This way source blocks function as standalone units that can be run at
>> any time, I just run *org-babel-tangle* and then hit *C-c *inside the js
>> block.
>>
>> I hope that helps you.
>>
>>
>> Martin
>>
>
>

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

  reply	other threads:[~2017-12-23  3:06 UTC|newest]

Thread overview: 6+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2017-12-22 11:57 Hope ob-js can support :session feature stardiviner
2017-12-22 18:32 ` Martin Alsinet
2017-12-23  1:07   ` numbchild
2017-12-23  3:06     ` Martin Alsinet [this message]
2017-12-24  3:13       ` numbchild
2017-12-24 16:15         ` Martin Alsinet

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

  List information: https://www.orgmode.org/

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to='CABUJmkA1bogoLXz_44JdPrGMzxeVRrxk=cBmMvpu4VTpbN76yw@mail.gmail.com' \
    --to=martin@alsinet.com.ar \
    --cc=emacs-orgmode@gnu.org \
    --cc=numbchild@gmail.com \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line before the message body.
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).