

Apocalism.js (or, How I Automated My Illustrated Short Story Build Process) - andrey-p
http://andrey-p.github.io/

======
poseid
very interesting! I was looking for some solution to maintain a photo blog
lately. could you give a clearer example how to work with images with your
solution? do you maintain the pictures in a directory before/after a build?

~~~
andrey-p
Thanks! I'm not really sure if a photo blog would be the best use for this
tool. What I had more in mind is trying to get a text written in markdown as a
printable book - the HTML output would be simply an online representation of
that printable book.

Here's something in the way of an example:

Say you've got an image which is 1299x901 pixels, called "foo.png". It's
pretty big because we want it to be a certain size when viewed at 300dpi (ie
print quality).

Before the build, it'll be stored at a folder called "images/" at the root of
your project folder. In your markdown text you reference its with its filename
only. So you reference it as "![alt text](foo.png)".

If you build with the "\--output html" option, the image will be copied over
to the output folder, and it'll be referenced in the HTML as "<img width='415'
height='288' src='images/foo.png'/>".

Note the width and height in the markup are reduced - this is so the image
will keep its relative size with the text when viewed at 96dpi, but if you
print the page it'll still look crisp and nice. (This is what happens when you
create a print-ready PDF, too.)

If you build with the "\--lo-res" option, the image will still be referenced
in the HTML as "<img width='415' height='288' src='images/foo.png'/>", but the
file will be reduced to that size when copied. So on one hand it'll take up
less space, and on the other hand it won't be good to print.

Hope that clears things up a bit.

