Flow/Interactive prototype

To better help people understand how Flow will work, we have built an interactive prototype out of Javascript and HTML. This prototype is not the final product and nothing will be saved.

Open the Flow Prototype

Giving Feedback
Please give feedback about the prototype on this page's talk page.

Using the Prototype
First, understand that nothing will be saved. If you reload the prototype, the state of everything is reset (within certain random variances).

Upon first loading the prototype, you will be presented with a dialog asking for a user name to use. Enter your user name (or any name, really) and the prototype will then see you as that user.

For ease of use, this user name will be saved for 7 days in a cookie so that you don't have to continually enter it every time you come back.

You can always clear the cookies by clicking the "Clear Saved User Name" link in the sidebar, under the "Toolbox".

What You Can Do in the Prototype
The prototype is fairly interactive.

Some simple interactions are:
 * Topics may be opened or closed by clicking on the chevron to the left or the topic title text itself.
 * Hovering your mouse over a datestamp ("About X time ago") will reveal a tooltip showing the actual date of the event
 * The buttons to the right of a topic title - Tags, Subscribe, Configure - are interactive, even if they don't actually work
 * If you see a "Show X read messages" banner, that means that there are additional posts that you've already seen. Click the banner to reveal them in order to show context.

Add Topics
Clicking the "+ Topic" button will open up a modal dialog. You can then fill out a title and text, and it will be automatically inserted at the top of the Board.

Note that the "X" button is currently broken (see "Known Issues"). You can always click "cancel" or hit the [ESCAPE] button to dismiss the dialog.

Reply to Posts
You can reply to any post in a topic. Replies will be inserted in-line, directly beneath the post being responded to, and will use the user name you have provided.

Note that in the "real" world the experience will be slightly different: new posts will be inserted into their correct position chronologically (not always just below the post being responded to).

Search
The search box will filter all posts in the board based on the text provided. You have to click the "Go" button for it to work right now, unfortunately.

Searching works against topic titles, tags, post texts, and author names. It will hide all topics that do not match the criteria.

Please note that the search functionality is a bit clunky - it has to be, since it does not have access to string tokenizers or a "real" backend.

Visit Echo Notifications
Clicking the Echo notifications badge (the red thing at the top, next to your username) will show you some notificatiosn. All have been read except for one (concerning a reply by Writ Keeper). Clicking that will bring you to a "single topic" view: this is just one conversation.

Single topics will have unique URLs, and can be referenced that way.

There are controls that will bring you back to your feed from there.

Other

 * Collapse All - This will collapse all topics. Clicking it again will expand all topics.  This function doesn't make a lot of sense in the context of an infinitely scrolling page, but is provided so that we can view what collapsing all topics looks like.
 * Mark All Read - This will grind through all topics, marking all posts as read.

Sidebar Links
There are two sidebar sections of interest: Toolbox and Examples.

Toolbox

 * Leave Feedback - This will take to a Wiki page where you can leave feedback.
 * Clear Saved Data - This will clear your saved user name and delete all cookies.
 * Toggle Paragraphs - This will hide all paragraph content. This is useful for seeing how topics "nest".
 * Indent++ - This increases the indent depth of all posts by 5 pixels.
 * Indent-- - This decreases the indent depth of all posts by 5 pixels

Examples

 * Fully Chaos - This will create a fully randomized board. All data is randomized with "Lorem Ipsum" text.  This is for exploring extreme cases.  If you don't like the randomized result, simply click the link again.
 * Jimmy Wales - This is a version of Jimmy Wales' talk page (which is an extreme example of activity).
 * Maggie Dennis - This is a version of Moonriddengirl's talk page (which also has a lot of activity).
 * Brandon Harris - This is a version of Jorm (WMF)'s talk page (light activity)
 * One Topic - This shows a "single topic" conversation, such as what you would get from clicking an Echo notification or a single-topic URL. (You can also get this by clicking the unread notification from "Writ Keeper" in the Echo flyout)

Functionality

 * Topic manipulation:
 * Add/remove tags
 * Locking/Archiving/Hatenote Topics
 * Splitting Topics
 * Delete Topics
 * Summarize Topics
 * Add mentions in Create Topic dialog
 * Build a better personal feed and personal board JSON
 * Generate random tags
 * Really distinguish board from feed
 * Handle tabs
 * Add a faked-up user page
 * Search tokenizing
 * Make tagbox work
 * Fake up "new responses to this post" scenario
 * Indicate when posts have been edited

Use Cases/Scripts

 * Party/Counterparty discussion use cases
 * Specific use cases (block notices, etc)

Bugs

 * The "X" button in the "Add Topic" dialog isn't working for some reason. Just click "cancel" or hit [ESCAPE].
 * Messages are being "marked read" too quickly.
 * The talk2json.pl script has a broken date parser (fails on single-digit day entries)

May 4, 2013

 * Read posts in any thread are collapsed by default, with an indicator to open all of them up.
 * Posts are not collapsed if the thread is collapsed
 * Collapse sections is an all-or-nothing deal
 * You cannot "re-collapse" read posts. Adding a control to every post is too heavy
 * Collapsing a thread will uncollapse all posts inside of it and remove the indicator
 * Reopening the thread will expand all posts
 * On start up, a modal appears asking you for your user name.
 * The form saves it and operates as "that person" from then on.
 * This is saved to a cookie, which prevents the modal from opening in the future
 * There is a "clear saved username" link on the side.
 * The feed link now treats itself as if it were the "logged in" user and does some replacing on text to imply that the conversations are happening with them (and not the original owner of the posts)

May 1, 2013
- Loading throbber - case insensitive - DOES NOT tokenize - searches titles, authornames, tags, postcontent
 * Posts are automatically marked read as you scroll through them.
 * Unread posts are significantly called out (green headers, experimental)
 * Topic titles are now hot
 * Rudimentary search functionality
 * Clicking the gear icon now brings up a menu
 * Clicking the subscribe/unsubscribe stars now do things
 * Clicking the tag icon now opens a small dialog (that doesn't work yet);
 * Reply form auto-focuses to the textarea now.

April 30, 2013

 * First version
 * Different views load different json representations of varius talk pages.
 * Sidebar links exist for various Board examples:
 * Fully Chaos (everything is generated randomly.)
 * Jimmy Wales
 * Maggie Dennis (Moonriddengirl)
 * Brandon Harris (Jorm)
 * A single topic (this is what you get to if you get an echo notification)
 * "Echo" badge brings user to a single topic (click on the entry by Writ Keeper)
 * Clicking on the "Feed" link in the header brings you to your feed. The "feed" view is different from the "Board" view.  The feed is private - it's all the conversations that you my be interested in or are subscribed to (have a solid star).  You also see activity from the boards of *people* you're subscribed to as well, but it floats away fairly quickly if you don't subscribe to it.