search

asciidoctor / asciidoctor-browser-extension

:white_circle: An extension for web browsers that converts AsciiDoc files to HTML using Asciidoctor.js.
https://chrome.google.com/webstore/detail/asciidoctorjs-live-previe/iaalpfgpbocpdfblpnhhgllgbdbchmia
MIT License
218 stars 50 forks source link

Rendering AsciiDoc files in a custom html page #640

Closed amelillo closed 1 year ago

amelillo commented 1 year ago

Hello. I started using asciidoc.js extension as a live preview of my asciidoc files I edit wih gedit. Everything works flawlessly. Then I wanted to upgrade my workflow; I coded a simple html page with a table which divides the screen in four cells. In each cell I put an iframe referencing to a local directory where I store *.adoc files so Firefox shows a simple directory tree as if I were in a file manager. Well, if I open an asciidoc file clicking on its name, the file is rendered as plain text. Is thee a workaround to make the extension sense the opening of an asciidoc file inside the iframe and render it correctly? The code I use is attached below. (the fourth frame is a textarea to take live notes inside the browser) Thanks!

<html>
<table width="100%" height="100%">
  <tr>
    <td><iframe src="file:///home/ale/Sync/" width="100%" height="100%" frameborder="0"></iframe></td>
    <td><iframe src="file:///home/ale/Sync/" width="100%" height="100%" frameborder="0"></iframe></td>
  </tr>
  <tr>
    <td><iframe src="file:///home/ale/Sync/" width="100%" height="100%" frameborder="0"></iframe></td>
    <td>
    <textarea style="width:100%;height:100%;font-size:1.2em;line-height:1.2em;background:black;color:f5600a;border:none;outline:none;margin:0;padding:20px 5px 5px 20px;"autofocus placeholder="GREETINGS PROFESSOR FALKEN.""></textarea>
    </td>
  </tr>
  </table>
</html>

Schermata del 2023-01-06 22-30-22

ggrossetie commented 1 year ago

I would recommend to use Asciidoctor.js directly (inside the <iframe>) and convert the text to HTML.

The browser extension is designed/limited to render text content.

ggrossetie commented 1 year ago

If you want to continue this discussion, please join the project chat at chat.asciidoctor.org as we don't use the issue tracker as a support forum. Thanks!

amelillo commented 1 year ago

thank you.