Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Simplify insertion flow #833

Closed
jasmussen opened this issue May 18, 2017 · 2 comments · Fixed by #835
Closed

Simplify insertion flow #833

jasmussen opened this issue May 18, 2017 · 2 comments · Fixed by #835
Assignees
Labels
[Feature] Inserter The main way to insert blocks using the + button in the editing interface [Priority] High Used to indicate top priority items that need quick attention [Type] Task Issues or PRs that have been broken down into an individual action to take

Comments

@jasmussen
Copy link
Contributor

After discussions with @mtias (#798 (comment)) and @aduth and seeing some of the complexity that the proposed flow for inserting (#323) has presented, perhaps we should think of a simpler flow for insertion.

To be absolutely clear — the purpose of these mockups is to make the code simpler too. If these ideas and concepts add complexity, please do let me know. They are not gospel, and your thoughts are important here.

Flow

The inserter lives in the Editor bar at the top, and at the bottom of the post for quick access near where you're writing:

inserter

Click the inserter to open the block tray. Hovering a block in the inserter shows a blue line where the block will be inserted. The block will always be inserted after the selected block, and if nothing is selected, at the end of the document:

inserter after a block

In the above mockup, the first two paragraphs constitute a single text block, and the last paragraph is also a separate text block. Since the caret is in the first text block, the image about to be inserted will show up after.

CC: @aduth @youknowriad — will this make for a simpler, codewise, flow?

@jasmussen jasmussen added Design [Priority] High Used to indicate top priority items that need quick attention [Type] Task Issues or PRs that have been broken down into an individual action to take [Feature] Inserter The main way to insert blocks using the + button in the editing interface labels May 18, 2017
@jasmussen jasmussen added this to the May Week 3 (Alpha) milestone May 18, 2017
@youknowriad
Copy link
Contributor

@jasmussen This looks good to me and simple enough in terms of "code". I'm going to try to implement it.

@youknowriad youknowriad self-assigned this May 18, 2017
@mtias
Copy link
Member

mtias commented May 18, 2017

Agreed this is a much simpler flow code wise, since we only deal with block ordering. The selection state is slightly related to: #827.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Inserter The main way to insert blocks using the + button in the editing interface [Priority] High Used to indicate top priority items that need quick attention [Type] Task Issues or PRs that have been broken down into an individual action to take
Projects
None yet
3 participants