[wip] Compile to JavaScript

[ggrossetie]

Build

npm install
npm run build

Tests

1. Create a new Node project adjacent to your asciidoctor-bespoke clone:

   mkdir asciidoctor-bespoke-test
   cd asciidoctor-bespoke-test
   npm init -y 

2. Install the dependencies

   npm install --save ../asciidoctor-bespoke
   npm install --save asciidoctor.js@1.5.5-4

3. Create a simple presentation file named presentation.adoc:

   = Hello world

4. Create a test file named test.js

   
   var asciidoctor = require('asciidoctor.js')();

//require('asciidoctor-template.js'); require('asciidoctor-bespoke');

var attributes = ''; var options = {safe: 'safe', backend: 'bespoke', attributes: attributes}; asciidoctor.convertFile('presentation.adoc', options);

5. Run

node test.js

6. "Rince and repeat"

modify Jade templates in ../asciidoctor-bespoke/templates/jade and/or modify presentation.adoc

npm install --save ../asciidoctor-bespoke node test.js

### TODO

- [x] Publish a new version of `asciidoctor-template.js` to use the new wrapper API introduced in Asciidoctor.js 1.5.5-4: https://github.com/asciidoctor/asciidoctor-template.js
- [ ] Add documentation
- [ ] Port all templates to Jade/Pug
- [x] Set `filename` options in Jade to resolve relative includes and extends: https://pugjs.org/api/reference.html#options
- [x] Resolve https://github.com/asciidoctor/asciidoctor-template.js/issues/9

[ggrossetie]

@mojavelinux @hsablonniere Do you have a list of samples presentations, so I can check that Jade and Slim templates are aligned ?

[hsablonniere]

Try this one https://github.com/opendevise/presentation-documentation-as-code

My version has a Ruby extension and some overridden templates : I like to give you some chanllenges.

[ggrossetie]

Making some progress on the title page:

Asciidoctor Ruby + Slim templates

Asciidoctor.js + Jade templates

[ggrossetie]

Note: I'm using the Asciidoctor.js wrapper API in the Jade templates. This is a bit verbose but the readability is nice :smile:

[hsablonniere]

Nice ;-)

[ggrossetie]

The structure of the presentation is now valid:

• article
  • section
    • content
    • aside (speaker notes)

and slides with images are now working, next steps:

• [x] video
• [x] slide with background image only
• [x] ulist

I also need to understand why the CompositeConverter is not working. For now I've created Jade templates for inline_break, inline_quoted, etc... but as far as I know these templates should be "provided" by the default html5 converter.

[ggrossetie]

For now I've created Jade templates for inline_break, inline_quoted, etc... but as far as I know these templates should be "provided" by the default html5 converter.

I've found the root cause: https://github.com/asciidoctor/asciidoctor-template.js/issues/9 I've also pushed some improvements, I'm getting closer to an alpha 1 :wink:

[ggrossetie]

I don't know why but slide titles are not rendered (ie. I get the raw text). For instance with Got icon:file-pdf-o[fw]?

.Good (with Asciidoctor Ruby + Slim)

.Bad (with Asciidoctor.js + Jade/Pug)

@mojavelinux @hsablonniere Any idea ?

[ggrossetie]

The presentation looks closer and closer but 4 issues remain:

• [x] Slide titles are not rendered (raw text) -> fix https://github.com/asciidoctor/asciidoctor.js/commit/4efd785307a85fb05e20b4e2c5a39a43ac0c60ae
• [ ] Slides with only a background image (for instance slide 62) have an extra <figure> tag inside the <section> whereas with Slim templates, the <figure> is absent... I think it has to do with content_for and yield_content functions but I haven't figured it out yet.
• [ ] Bullet points are shown at once, because I didn't implement build_roles function
• [ ] Syntax highlighting in source code is not working (based on Pygments)

[hsablonniere]

Nice ;-) I'll try it next week (I hope).

[ggrossetie]

I still have some local modifications that I need to push otherwise this won't work on your machine. I will let you know when it's ready :rocket:

[ggrossetie]

@hsablonniere If you want to give it a try: https://github.com/opendevise/presentation-documentation-as-code/pull/2

[ggrossetie]

Instead of duplicating Slim templates I think we should use the same approach as the Reveal.js converter and compile the Slim templates into a single Ruby file: https://github.com/jirutka/asciidoctor-templates-compiler

What do you think ?

Ping @jirutka @obilodeau @mojavelinux

[ggrossetie]

As discussed with @mojavelinux the plan is to (re)write this converter in JavaScript (using String Literals or a JavaScript template engine).

Closing...