Live demo of my project: Todo.taskpaper, an enhanced text editor for taskpaper files


#1

Looking for comments/suggestions on my hobby project. Questions/contributions are also welcome!

Todo.taskpaper is an enhanced text editor for taskpaper files that runs in your browser. The live demo is hosted on the web, but you can download two files and run it locally. (The final version will just be a single HTML file!)

Although just a proof-of-concept, Todo.taskpaper is surprisingly complete. It already supports most of the features from TaskPaper’s default “Welcome” file :grin:. Plus there are some features I’m pretty sure TaskPaper doesn’t have!

Questions:

  • What features do you wish TaskPaper supported? For example: markdown-style links and shortened links.
    • My idea for links (which I will implement in a Todo.taskpaper view): when links exceed a certain length, collapse the middle portion to ellipses when rendering. A tooltip shows the full version and links are fully expanded when editing.
  • Is there a TaskPaper mode for CodeMirror? I thought there might be, but the closest I could find was the stock indent-based indenting addon.

The Todo.taskpaper Vision, and What’s Coming:

  • The final version will have many different types of enhanced views. Multiple types of views on the same document allows adding adding features without cluttering the interface. Incompatible features that would otherwise not work together can each have their own views. Some example views I’m thinking of:
    • Calendar/scheduler view. (Very similar to NotePlan!)
    • Priority view: tasks automatically sorted by @due/@priority
    • Agenda view: dependent tasks hidden/folded away
    • Bookmarks view: optimized for organizing URL’s (inspired by Bkmks.com)
  • Individual tasks may be rendered differently based on their tags. For example, a @bookmark tag may cause the task to be rendered with a favicon in place of the dash.
  • The interactive console will also become more powerful: manage an outline by modifying a string representation that is linked to the outline.
  • In addition, you will be able to create and share your own custom views via a plugin API.

More background info:

This proof-of-concept only took a few days to develop, but I’ve been developing the idea for over a decade. When I started, I didn’t know about TaskPaper. I had my own special format for paper to-do lists. However, paper lists got messy and I regularly found myself copying unfinished tasks to a fresh sheet of paper by hand.

Then I discovered todo.txt. Using the CLI to manage a plain-text file was pretty clever. I tried to make it more clever: I figured the browser was an even more ubiquitous platform than the CLI, and allowed advanced GUI interaction.

I ported Todo.txt-CLI to the browser: Todo.html. The original vision was a single text file that was both a text file and HTML web app at the same time. Start editing it in a regular text editor and process it with todo.txt-CL, then open in a browser the next moment to get a great visualization of your tasks! (I had stuffed all the minimized HTML/CSS/JS into a single line at the bottom of a single todo.html file. This file could save itself like TiddlyWiki.)

Alas, this idea was too clever. I got an initial version working, but I hit the limits of the todo.txt format. Text editors did not like single lines of that were over 500KB long! So around this time I switched to the TaskPaper format. By folding the HTML/CSS/JS code under a project, I was able to split it into shorter lines that editors didn’t choke on. The TaskPaper format also had other advantages:

  • it was more flexible and I could add notes related to tasks
  • the concept of tags with attributes was really useful
  • the natural hierarchy lent itself well to dependent tasks and sub-tasks

I finally had to give up the idea of a dual plain-text/html-web-app file that saves itself. Storing the code with the data in a single file does not work as well as I had hoped on mobile (bandwith/browser issues). But I still had hopes for an advanced editor/visualization of taskpaper tasks via the browser!

Then I ran into another challenge: the TaskPaper format was more complex and thus more difficult to parse. I toyed with the idea of writing my own custom lexer/parser, but I’m more interested in UX than compiler design. So I shelved this project until I found birch-outline. Thanks @jessegrosjean! I hope my project inspires you like TaskPaper has inspired me!


Javascript or PHP Parser
Shortening links?
#2

This is pretty neat, thanks for posting!

Take what I say with a grain of salt, I don’t know you or your project … in the end work on what excites you most!

With that said …

I think putting to much effort into the editor could take a lot of energy with little long term progress. You could add some unique features (like collapsing links), but to have those features used you would need to put in a lot of effort to make the editor better/equal to all the existing native editors. Lots of effort, and in the end not much new.

Instead I really like your ideas on supporting different views of TaskPaper files. If you set this up to work with Dropbox then it would be something that existing TaskPaper users could immediately take advantage of without replacing there existing workflow.

I think (for instance) your idea of projecting a TaskPaper file into a standard calendar UI is a great idea that could quickly add some value to TaskPaper files. But my take on the best way to do the idea would be not to focus on the plain text nature of TaskPaper, instead just write a view for of TaskPaper’s data model. So maybe:

  • Find some nice modern looking web calendar component.
  • Use Dropbox to find and sync with a TaskPaper file.
  • Anytime the file changes search for “due” and insert those items into proper places in the calendar.

This same pattern could be used to good effect with many other view ideas I think.


#3

Ok, I need to get back to my actual work, but I started around on the web and found (first google result, so maybe I didn’t search too hard) https://fullcalendar.io. I think projecting a TaskPaper file into that view would be really cool. Could also add some basic editing … such as when you use the existing https://fullcalendar.io to move a date you would would update the date in the underlying TaskPaper file and save it back out. I think it could be pretty cool! :slight_smile:


#4

Thanks for the feedback! @jessegrosjean’s ideas are great, and very aligned with my goals. The goal is not to replace the TaskPaper app, but to complement it. In fact: I forgot to mention DropBox sync in my introduction here, but it was already mentioned as TODO #1 in the README).

However, I don’t think it is feasible to focus on the TaskPaper data model instead of the text format:

  • First, as a poor PC user, I can’t use the TaskPaper Mac app. :sob: I currently manage my taskpaper files from gVim…
  • More importantly: DropBox synchronizes at the file level so it makes synchronizing at the task/item level of the data model difficult, if not impossible. I actually ran into this problem with my POC when trying to sync birch-outline with CodeMirror. I opened an issue here that goes into more detail.

Do you have any suggestions for how to implement DropBox sync with regard to the issues above?


#5

I surveyed a bunch of JS calendar/scheduler components last week.

My top choice was Extensible. However, the developer stopped development so I was investigating if it was possible to use the very similar ExtJS Calendar component (licensing issues, and don’t want entire ExtJS framework).

I remember seeing https://fullcalendar.io, but can’t remember why I didn’t choose it. If it’s still actively maintained, it might be a better choice. I’ll take another look!


#6

Yes, but even so on PC you can use Atom or Sublime … none of which are quite the same as TaskPaper for Mac, but all of which are really solid editors with big existing user bases. It would take quite a bit of effort to create something that more then a few people would rather use I think.

If you wanted to work on editor more another project might be to see if you can integrate birch-outline with one of those existing projects to create a richer set of commands. To this point I think those other editors are mostly syntax highlighters with respect to TaskPaper, though with lots of other own powerful editing functions.

Anyway, I just say this because I think presenting a TaskPaper file as a calendar (or another custom view) is a very doable side project that would provide immediate value. While building an editor good enough to attract other users is a life long project of sorts :slight_smile:


#7

Thanks, I’ll respond there.