help! How Does TreeSaver Paginate text?

[Dave Bricker]

I'm working on a book layout that uses classic margins. I want the layout to be responsive and I've played with one and two-column grid classes. The pages of the book should be restricted so they don't exceed a certain maximum height but if I set a fixed height, the layout isn't vertically responsive. If I set the book to use a % of page height, I can't control the proportions.

If I set a max-height css selector, everything disappears.

I have played with padding and margins and heights, and I've gotten myself tangled up.

I also want the user to be able to choose from a small menu of fonts, change the type size, change from left to full-justification, and choose a leading (tight, medium, loose).

What I want to learn is how TreeSaver "thinks." I find a lot of inline styles apparently written by the script. I have gone through the walkthrough but I just can't get the columns to behave the way I want. I would really appreciate some assistance with this. I am at the tail end of a huge eBook project and my one achilles heel is learning how to manage the way TS handles the pagination. Once I can "get" the logic and understand what TS can't do, I'll be free to design within its abilities. It's a wonderful platform based on what I've seen so far.

Many thanks,

Dave Bricker

[Mark Kessler]

Hi Dave,

I know Treesaver has a steep learning curve and it takes a while until you really grab the concept behind it. There is some material on how Treesaver works in the Wiki, this helps to understand what is happening. Actually what you write seems a lot like the standard case with a one or two column grid. Treesaver would fill as much text as fits into the columns and when they are full, it wold continue on the next page. To have the flexibility in page height, max-height should actually work, where did you set max-height?

To change fonts or font size on the fly, Treesaver would have to recalculate the whole layout. I never tried it but that should be possible by adding special class atributes to the grid. But this is a bit tricky because it doesn't work to directly change the document but you will have to manipulate the dom that is handled by Treesaver itself. This would require some advanced Javascript knowledge.

To help you more, maybe you can post a simple test case for your problem here or give a link to a testing site.

Regards,

Mark

--
You received this message because you are subscribed to the Google Groups "Treesaver" group.
To unsubscribe from this group and stop receiving emails from it, send an email to treesaverjs...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Dave Bricker]

I have made great progress and have things mostly working the way I want.

One thing I want to do is to show a book spread where a chapter starts on a right-hand page in 2-col view but the empty column disappears if the window is narrow and only one column is visible.

First part of that problem is that the .columnbreak class does not seem to work. If I start an article with <p class=".columnbreak></p> I get no result. What am I missing? Is there some simple way to implement that? The wiki mentions the class but not what to attach it to. From there, I think I can find a way to show or hide that column depending on screen size but my improvised solutions for .columnbreak are not working consistently across browsers.

Thanks,

Dave

[Andrea Campi]

On Wed, Jul 17, 2013 at 4:37 PM, Dave Bricker <inn...@gmail.com> wrote:
> First part of that problem is that the .columnbreak class does not seem to
> work. If I start an article with <p class=".columnbreak></p> I get no
> result. What am I missing? Is there some simple way to implement that? The
> wiki mentions the class but not what to attach it to. From there, I think I
> can find a way to show or hide that column depending on screen size but my
> improvised solutions for .columnbreak are not working consistently across
> browsers.

That should be:

<p class="columnbreak></p>

[Dave Bricker]

My typo. I had <p class="columnbreak"></p> but got no column break.