Birch-outline: any difference rendering without the `P` elements? rendering as a linear list (vs nested) list?

I’m refactoring the birch-outline Webpage Example so it works with a virtual scrolling list for performance reasons. I have some questions about how the example builds a UL from a Taskpaper outline:

  • Is there a reason for having each LI wrap a P element?
    • Will rendering only the LI have any non-obvious effects?
    • (Assuming the corresponding CSS is also changed.)
  • Is there any difference between rendering Taskpaper outlines as linear lists vs. nested lists?
    • My guess: indents will have to be manually inserted. (As the browser indents nested lists for you.)
    • But maybe some themes will break… Anything else?

Feel free to play around with what I’m building: Todo.taskpaper

First know that that example was put together very quickly. I wouldn’t say anything about the HTML structure is particularly right or wrong … modify as you see fit for your given goals.

This makes styling easier. (I think) It allows you to style a parent item without giving it’s children the same style.

I think it depends on your goal… if your goal is to export a final HTML document then I think structured makes more logical sense. But if you are writing an editor then I think a flat list with manual indents can be easier to keep updated (that’s the model that I use in TaskPaper for Mac, though it’s not HTML based).

If you use a flat list it will limit your styling options since you couldn’t do any styles based on contentment. With that said TaskPaper for Mac also doesn’t support item containment styles.

1 Like

The example was easy to read and showed me exactly what parts of the API I needed (and how to use them).

I successfully modified the example to render a flat list. It’s even easier to read because it’s shorter and doesn’t involve recursion. A little more CSS is needed for the indentation, however.

(BTW what’s the practical maximum indentation level for a TaskPaper file? I find I don’t use more than about two or three levels, myself)

Later, I hooked up the flat list to clusterize.js for dramatic speed improvements!

@jessegrosjean: I’d be happy to clean up and contribute my (CoffeeScript) example code if you’re interested.

It really depends on how you use your TaskPaper file … I don’t think there’s any particular maximum. It used to be that you would have to see all the indentation (in TaskPaper 2) even when you focused into a project. But in TaskPaper 3 when you focus into a project you just see that projects indentation … so there’s no much cost to indenting projects as long as you edit them in focused mode.

I would say my own lists don’t go much beyond 7 levels. But I’m sure there’s someone out there who creates really deep hiearchies!

If you want to share it I think best to release in your own repo and then link to it from the TaskPaper extensions wiki. I don’t want to build up to many official examples right now.