When I set :doctype: book and then use the print preview I expected the print CSS styles for book to kick in (page break on title page, sections, etc) but they don't seem to be. The same adoc when run through the asciidoctor CLI and opened in Chrome print preview works as expected.

On Chrome, the Asciidoctor Preview add-on conflicts with the LiveReload extension: the asciidoctor add-on renders the HTML output from the given asciidoc resource, but then the <script> tag that should be inserted by the LiveReload extension is missing, which means that the LiveReload feature does not work after the first refresh..

https://github.com/asciidoctor/asciidoctor-stylesheet-factory

See asciidoctor/asciidoctor-stylesheet-factory@32c3620

The example below does not render item (3) correctly due to a bug in asciidoctor 1.5 rc5. See Issue 1058 for details.

:stem: latexmath

== Test

. Pythagorean Theorem: \(a^2 + b^2 = c^2\)

. Volume of something large:
\[ V = s^3  =  10^{63} \text{m}^3 \]


. Volume of something large again:
\[ V = s^3  =  (10^{21})^3 \text{m}^3 \]

Set the value of the outfilesuffix attribute to the extension of the source file. For instance, if the source file is README.adoc, the outfilesuffix should default to .adoc. This allows cross references to link to the AsciiDoc source files they reference instead of the HTML file, which is appropriate for the preview environment.

You can read more about inter-document cross references here:

http://asciidoctor.org/docs/user-manual/#inter-document-cross-references

When the AsciiDoc source is read from document.body.innerText, the charset of the string is assumed to be whatever the browser uses as the fallback encoding. On many systems, this charset is not UTF-8. If the AsciiDoc source is read from the responseText of the Ajax response object, then the charset of the string is honored.

Replace:

render(document.body.innerText);

With:

render(data.responseText);

With #3 fixed you get the error reported but then you still can't see the content without disabling the extension. Could we have a button or shortcut or something to toggle between raw/rendered?

I'm looking for someone to help create a version of asciidoctor-chrome-extension that will work on a MacOS WebView (WebKit). See asciihelper.

• Asciidoctor / Opal
• JQuery
• Bootstrap
• Fontawesome

My actions

1. install extention from webstore
2. check "Allow access to file URLs"
3. drag test.adoc (anything, even empty) to browser

Result

page with content:

Error
TypeError : Cannot read property 'join' of null

Versions

chrome 34.0.1847.131
asciidoctor-chrome-extension 0.3.0
windows 8.1

If the URL to the AsciiDoc file contains a query string, the extension does not trigger. The presence of the query string may be breaking the extension matching logic. This seems like a fairly straightforward fix.

As a side note, the console message seems to indicate that we need to change something in the extension settings to make it work fully.

Refused to apply inline style because it violates the following Content Security Policy directive: "default-src 'none'". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'style-src' was not explicitly set, so 'default-src' is used as a fallback.

I really like the option to use chrome for live preview of my asciidoc files. But I have to scroll down to the previous position whenever I save my file which is really annoying. It would be nice previous scroll position could be restored.

The ability to print exactly what I see, keeping the styling from the theme. When I go to print preview or printer, it's stylized as the "media print" which removes all color/style.

I'd rather not hack up the css theme/bootstrap to remove a media type. This will allow me to quickly save pdf's (printer plugin, browser, etc) without using a command-line toolchain.

Add instructions for how to build the extension bundle for local testing.

There are two problem with Cyrillic in test doc http://yadi.sk/d/ndivZCDuDBnpM:

1. Some times file is loades incorrect. F5 resolve problem.
   
2. Strange formating after F5
   

Request on the Chrome WebStore:

Would live it if you could configure the extensions supported.
We sometimes preprocess .adoc files and the raw input has the extension .adoc.pl.
Usually our preprocessing doesn't affect output enough to make much of a difference, especially for preview purposes.

• Steve Glaser

With the Chrome Webstore I can publish pre-release version of the extension to test accounts. With more and more users (nearly 1K !) I think it's a good idea to start using this feature to make sure that the new version is bug free 😄

So if you are interested give me your Google account and I will make you... beta tester!

Thanks

Hey guys, I've implemented a feature which allows for each theme css to be paired with an associated js script file.

e.g.

css/themes/rocket-panda.css
js/rocket-panda.js

It's working perfectly and for existing themes which don't have a js file, it embeds the it anyway, with no ill side effects.

I actually looked for a chrome extension API to detect if a file path reference in the extension exists or not in order to not append the script if missing. I didn't find one.

Thoughts?

Asciidoctor integrates with two syntax highlighters out of the box, highlight.js and prettify (though prettify isn't yet available in Asciidoctor.js). If the source-highlighter is set to one of these two options, load the appropriate JavaScript and CSS files (either local or from cloudfare) and initiate the syntax highlighting script.

Hi today I have tried again the integration between asciidoctor js and Java, I think it has been improved so much since last time I tried.

For example rendering Chrome extension README.adoc it has been improved 2 seconds, from 3.5s to 1.5s, JRuby implementation takes 256ms, but I think that with time we will be able to improve a bit more. This time only is rendering time no startup time.

So I decided to open an issue here because I have some questions about opal/asciidoctorjs that I think that may become issues.

So the questions are:

• I have tried to use the method called convert_file to try to convert a file instead of a chunk and next exception is thrown:

javax.script.ScriptException: TypeError: Cannot call undefined in at line number 12263

Basically it is that input.$readLines doesn't exists.

• I have tried to write an output to disk but without luck, no exception is thrown, I have used to_file attribute.
• I thought about reading the file from Java part and the output write it back, but my next question is if there is a way to get the converted html file as full html (that is with html tag, embedded css, ...) when we pass content as string instead of a file? I have seen that in asciidoctorj some of this information is appended manually.

Well that's all for now we are on the good path :).

Thanks.

I'm using the Asciidoctor.js Live Preview Chrome extension -- downloaded two days ago. Very nice!!
Alas, it does not support the current Asciidoctor 1.5 syntax for math. Please see the test file below (testmath3.ad). When I run asciidoctor testmath3.ad, the resulting html file renders the math properly. Version:

Asciidoctor 1.5.0.rc.4 [http://asciidoctor.org]
Runtime Environment (ruby 2.1.1p76 (2014-02-24 revision 45161) [x86_64-darwin12.0])

Here is the test file:

:stem:

== Plain old +++:stem:+++

We humans are mostly water (stem:[H_2O]).

stem:[sqrt(4) = 2]

[stem]
++++
sqrt(4) = 2
++++

== Now use +++:stem: latexmath+++

:stem: latexmath

latexmath:[\sqrt 4 = 2]

[latexmath]
++++
\sqrt 4 = 2
++++

From the docs ...

latexmath:[$C = \alpha + \beta Y^{\gamma} + \epsilon$]

-- there is a spurious $.  It is not needed in the formula.


latexmath:[C = \alpha + \beta Y^{\gamma} + \epsilon]

== Finally, use +++:stem: asciimath+++

:stem: latexmath

[asciimath]
++++
sqrt(4) = 2
++++

... or wait for v1.5.0 "final" ? @mojavelinux what do you think ?

Something like https://github.com/adam-p/markdown-here

Add a configuration option for specifying custom attributes. Presumably, this entails adding an options page for the extension.

The custom attributes are intended as a user-preference for controlling how documents are rendered by the extension globally. Per-document attributes are best placed in the document being rendered, at least for now.

Since Asciidoctor can accept attributes as a String of space-separated key/value attribute pairs, its sufficient to use a simple String option. For example:

• Custom attributes: [ idprefix idseparator=- numbered sectanchors ]

(the square brackets emulate an input field in the configuration dialog)

Example: https://raw.github.com/asciidoctor/asciidoctor.org/master/docs/what-is-asciidoctor.adoc

This loads up with empty page. Not sure why.

Would be nice there was a way to show the "raw" content even with the plugin installed and equally awesome would be to get an error or something explaining what causes the empty doc.

I recommend updating the screenshot that's in the Chrome store with one based on the new styles. Also, you may want to add a few more screenshots to get people even more excited. Just browse some AsciiDoc document you like and snap, snap, snap.

Each time the page refreshes, another stylesheet reference (i.e., <link> element) is added to the DOM. You can see this happen by looking at the Elements tab in the development tools (opened from "Inspect Element"). The stylesheet reference should only be added the first time the document is rendered.

I think we have enough new stuff to make a ✨ release... WDYT ? 😄

I have a local Asciidoctor document and opened it in Chrome (prior you have to allow access to local files under chrome://extensions/). The Asciidoctor document is stored in UTF-8 without BOM but German Umlauts are not displayed properly.

UTF-8 storage should be enough according to
http://discuss.asciidoctor.org/Encoding-of-special-German-Umlaut-characters-in-html-backend-td548.html

I'm using the default Highlight.js theme but I think it would be better to use the Highlight.js GitHub theme with the Asciidoctor theme ?

Do you have any suggestion on how the following theme should be paired with a corresponding Highlight.js theme ?

• asciidoctor -> github ?
• colony
• foundation
• foundation-lime
• foundation-potion
• github
• golo
• iconic
• maker
• readthedocs
• riak
• rocket-panda
• rubygems

The list of available Highlight.js theme is here: https://github.com/isagalaev/highlight.js/tree/master/src/styles

I think I will also need to support the highlightjs-theme attribute.

Space plus " +" does not insert line break. See last line in the example below. The same source works with asciidoctor (1.4).

Business assets:::  
    *Information, process, skill inherent to the business* of the 
    organisation that has *value* to the organisation in terms of its
    business model and is necessary for achieving its objectives.
    Example : technical plan, structure calculation process, architectural
    competence. +
    Business assets are *immaterial*.

I have my images and stylesheets relative to my base_dir and I need a way to define it.

I've been adding attributes to each environment where Asciidoctor is running that allows authors to conditionally include or exclude content under that environment. In the case of the chrome extension, I recommend setting the following two attributes:

• env=opal
• env-opal

If we anticipate needing to know that the environment is specifically the live preview, then perhaps we can go a step further with something like:

• env=browser
• env-browser

Whichever you think is best. Though, in looking at the options, it makes me realize perhaps we should have a "platform" attribute that communicates which Asciidoctor implementation is in use (i.e., which Ruby environment).

• platform=opal
• platform-opal
• env=browser
• env-browser

wdyt?

I absolutely love being able to see the HTML output for an AsciiDoc file by visiting the file directly in the browser. Most of the time, that's what I want to see.

However, there are times when I want to see the AsciiDoc source. In those cases, I would like to be able to switch back to the AsciiDoc source. I can imagine having a button in the toolbar that toggles between the HTML output and the AsciiDoc source when I click on it.

I would suggest how to implement this, except I'm not familiar enough with Chrome extensions to understand how it's done. Perhaps look for another extension that does something similar and take notes :)

Hello,

according to http://www.methods.co.nz/asciidoc/chunked/ch31.html, there are built-in/dynamic attributes like {indir}, which are super handy to know precisely where we are.

I have two issues:

• {indir} does not seem to be resolved
• attributes do not seem to be concatenable

# index.adoc
= Book Title
include::chapters/02.adoc[]

# chapters/02.adoc
:imageDir: {indir}/images

image::{imageDir}/sample.png[align="center"]

At the moment, if I define {imageDir} as ./images, then it does not resolve the proper path when the chapter02.adoc is included, because {imageDir}/sample.png is resolved as images/sample.png instead of chapters/images/sample.png.

When viewing a web page, I'd like to be able to select a region of text and have Asciidoctor.js render it in a new tab or window. With this capability, I could pick out a reply on a mailinglist thread that was written in the AsciiDoc syntax and view the content in all its glory without having to go through the exercise of saving it to a file, etc.

mojavelinux:

It's important to note that since the Chrome extension converts the document to embeddable HTML (header and footer disabled), the only TOC placement that work are preamble (if the document has a preamble) or manual placement.

The author can use preprocessor directives to fine-tune the content to put the TOC in the right place depending on the environment.

See #42

Everything is in the title, maybe with Jasmine to stick with the same technology as Asciidoctor.js ?

Although we lobby in the Asciidoctor community to deprecate the .asc extension, .asc is still in use by many AsciiDoc files on the internet. Since this extension is often used for previewing existing files, it should recognize all the known AsciiDoc file extensions.

Currently, the browser extension only includes a single theme for Highlight.js, see: https://github.com/asciidoctor/asciidoctor-browser-extension/tree/main/app/css/highlight

And the relevant code that adds the Higlight.js theme (github):

I don't see (and I've tried a few options) a way to create an inter-document link between a source .adoc file and a destination file.

e.g.

link:doc-b[Document B]

It would look for a fuel named doc-b.adoc first and then possibly doc-b.html.

I have multiple documents that need to link each other and it would be nice to be able to test the links with the Chrome extension but when the documents are rendered have them link to the generated .html files.

If the icons attribute is enabled on the document (or perhaps just anytime), add Font Awesome to the HTML header so it can be used to draw the icons.

See the HTML generated by Asciidoctor to see the <link> element to add.

Steps to Reproduce:

1. Enter URL to your file e.g. file:///home/leif/helloworld.adoc
2. Right click and select Send to AsciiDoctor Editor

Expected Results:

???

Actual Results:

Nothing happens.

Additional Info:

Using extension v0.3.0.