pastebin

Simple pastebin made with Mithril JS.

User Interface (UI)

Along the top are:

• "New Note..." button
• Search box
• "Sort" dropdown

On the top-right are:

• Bin ID
• "New Bin..." button
• "List of Bins" button (if the user is signed-in)

The main area is simply a flexbox list of Notes.

Each note contains:

• Note text
• "Edit" button

User Experience (UX)

The root page creates a new bin, and sets the browser's location accordingly.

The "search and sort" only occurs when the search term or sort order is changed. So, clicking "New Note..." will safely make the new note come out first in the list.

The user starts-out as anonymous, so his bin id must be saved to access the bin again.

The user may type-in his username/password to sign-in; in which case a list of his bins can be opened. Note that since the user is signed-in, his bins may have a human-readable id in addition to a regular unique id, since it only has to be local to the user, not globally like anonymous bins.

TODO

• prepend "new note" to notes list, not append
• focus new note upon creation (surprisingly hard to do "the right way")
• optional user sign-in
• create new bin
• open existing bin using browser location
• add pagination
• search term highlighting in result note text