text icon indicating copy to clipboard operation
text copied to clipboard

Text Editor: Double clicking on any text causes a small pop-up box with Add Link and Link File.

Open jimoquinn opened this issue 2 years ago β€’ 7 comments

Describe the bug Double clicking on any text causes a small pop-up box with Add Link and Link File. See screen shots below. I'm not aware of any other modern editor that behaves this way. The typical pattern for mouse clicks in a text editor is double-clicking selects the associated word. Triple-clicking will often select the associated line or sentence.

Breaking this pattern by having this box pop-up has become rather bothersome and ultimately, frustrating.

A suggestion is to move the Add Link icon and Link File icon to the icon row at the top of the editor.

To Reproduce Steps to reproduce the behavior:

  1. Click Files->New Text Document
  2. Type some text in the new document
  3. Double click text
  4. You'll find the pop-up box with Add Link and Link File

Expected behavior

  • The typical pattern for mouse clicks in a text editor is double-clicking selects the associated word.

  • Triple-clicking will often select the associated line or sentence.

Screenshots Screen shots are below.

Server details

Text app version: unsure which Text app is causing this, I have Plain Text Editor disabled

Nextcloud version: 22.2.3

Screen shot where the pop-up box appears: image

Move the Add Link and Link File buttons to the tool bar. image

jimoquinn avatar Jan 13 '22 03:01 jimoquinn

Hey @jimoquinn, thanks for your feedback.

Indeed, what you describe is intended behaviour. You still can select text by double-clicking, but a context menu will open in order to turn the selected text into an (internal or external) link. Other online editors like notion.so or hackmd.io do similar things.

To better understand your issue, could you elaborate on what problems you face with that behaviour? Selecting a word with double-click and selecting the whole line with dripple-click should still work, no?

mejo- avatar Jan 13 '22 11:01 mejo-

Thanks for listening and I appreciate all the work you do on nextcloud.

I found myself becoming frustrated when typing up a document so decided to pause and dig in to discover this source of frustration. Ultimately I discovered there are 2 deviations from dominant and universally accepted UI design patterns which were starting to bug me.

  • Double Click - Stacking additional functionality on top of the double click action breaks mental flow and increases cognitive load. The expected double click behavior was modified so when this additional pop-up box appears I'm forced to pause my thoughts about the content of my document and deal with this interruption. Why is it asking me to Add a Link? Why is it asking me to Link a File? Why does it ask every single time? Out of the hundreds of pop-up boxes that appeared during the authoring of my document, not once did I need to add a link or link a file, and as time elapsed I found it bothersome which increased my frustration.

  • ToolBar - all other editor functions are in the toolbar, where they should be. If we need to link, we will check the toolbar, as this is where the dominant and generally accepted pattern UI pattern places these two functions (including the editor that I'm using to type this).

I'm not sure deviating from these 2 design patterns and breaking from expected behavior provides a clear benefit. If the editor's primary task was to create links, then it may be more acceptable to move those two options from the toolbar and stack them on the double click action. But, I suspect this was designed for general use and was not designed with link creation as its primary function.

Not one to complain without offering potential solutions, here are mine:

  • Move the Add Link function and icon to the toolbar
  • Move the Link a File function and icon to the toolbar
  • Disable the stacked function on top of the double-click

jimoquinn avatar Jan 15 '22 00:01 jimoquinn

Let's check in with @jancborchardt or @juliushaertl about the original design considerations.

I can add that the positioning of the popover menu has been difficult to get right and at times conflicting with the menu bar or other pop over menus on text selection such as copy and paste menu on android phones.

max-nextcloud avatar Jan 17 '22 19:01 max-nextcloud

Text is, as mentioned above, inspired by other widely used solutions like Notion and Medium. Both show not only the adding link and file but all formatting options in that bar:

Medium Notion
Medium formatting bar Notion formatting bar

I can see the confusion with the combination of the fixed toolbar and the floating bar however. Maybe it is indeed easiest if we just move those 2 additional actions in the formatting bar as well so it’s all in one place. That would still be consistent with what many people are used to via Google Docs, MS Office and other common editors.

What do you think @mejo- @max-nextcloud @juliushaertl? Of course in this case it’s yet 2 more icons in the toolbar. We could put them in like @jimoquinn proposes, or combine "Add image", "Add link", "Link file" into an Insert/Add menu.

jancborchardt avatar Jan 18 '22 10:01 jancborchardt

I have to admit that I agree with @jimoquinn that it's rather inconsistent to have the linking tools in a floating toolbar and all the others in a fixed toolbar. I'd vote for getting rid of the floating toolbar altogether.

mejo- avatar Jan 24 '22 10:01 mejo-

First, I had similar thoughts as @jimoquinn but this changed when working with Nextcloud Text over time.

Please keep in mind that the floating toolbar (popup) has one major advantage. I can work much faster when setting links because I do not have to go up with my mouse cursor to the fixed toolbar every time when I want to set a link. When highlighting the text with my cursor, the popup is right above the cursor - love it.

@jancborchardt, an additional Insert/Add menu button in the fix toolbox opening another layer of buttons would be an additional mouse click and selection process and further slowdown. Moreover, the two options Add Link and Link File are very sleek compared to the popups in Notion and Medium above, which are very distracting in my opinion. Furthermore, I agree with @jancborchardt that it might be easier having all buttons in the fix toolbar but only in the first use. After having figured this out, it is equally easy having in mind the next years of working faster with the popup. In addition, I would not compare this functionality too much with Google Docs, MS Office, etc. because these editors represent another philosophy. And is the goal to make e.g. Google Docs users comfortable with Nextcloud Text by replicated the Google Docs functionality/interface? I do not think so.

In case a shortcut for Add Link and Link File would be introduced then I would not mind, where the buttons are located but this is probably very difficult regarding the variety of internet browsers.

Personally speaking, I would prefer an interface where I can get more done with less mouse clicks and movements to work fast than having a consistent toolbar or having it bit easier only in the first use. My concluding question, isn't the idea of Markdown to keep the hands as much as possible on the keyboard and reduce mouse movement?

For me, it would be a loss in productivity when eliminating the floating popup toolbar.

pat-githubber avatar Jan 26 '22 13:01 pat-githubber

It is indeed a tradeoff, as mentioned by @pat-githubber Reduce cognitive load vs increasing productivy when adding links. Both are valuable philosophy and have pros and cons.

One way to help us decide what to do would be to ask "how often are user more likely to encounter X?" In this case: how often are users adding links vs how often do they see the popup without the need for it.

I don't think we have any numbers to prove this, but I would guess that users add link less frequently than they select text for any other reasons (ex: bold, italic, copy, edit, etc).

Based on that, I would say it would be better to move the "create link" buttons to the top bar. The lost of productivity in mouse movement would be minimal, but the decrease on cognitive load and general usability of the app would increase a lot.

Otherwise, following this argument, we would need to put other more frequently used tool to this popup: bold, italic, etc. And then it would look like the Wordpress text editor, where tools buttons are in a floating popup above the currently selected paragraph: https://www.softwarecrew.com/wp-content/uploads/2018/12/wordpress5-1024x513.png

narFnarF avatar Mar 23 '22 17:03 narFnarF

The positioning has improved quite a bit recently, however we also plan to move away from the popover bubble after some more discussion with the designers. This will be tracked in https://github.com/nextcloud/text/issues/2392

juliushaertl avatar Oct 17 '22 17:10 juliushaertl

Much more handy as it is right now than before πŸ™ƒ image

pat-githubber avatar Oct 18 '22 11:10 pat-githubber