Make a specific quote-action button for website

Factual Questions
1

I’m asking for a coder who doesn’t know much English.

We’re designing a kinda blog website. It should have a feature like this: when a viewer is reading an article, there is a toolbar on the side, which has several hotkey buttons - for example, ‘Q’.

We encounter the QUOTE button on fora all the times, but this Q is more advanced. If the viewer encounter something interesting and want to quote it in their comment, they just need to highlight the thing using the mouse and then press Q. That will copy the content and paste it in quoted form into the comment field at the bottom of the page. Also, the pointer-cursor will be placed right at the end of that quote, ready for the viewer to type the comment. Which means it has ‘disconnected’ all the possible conflicting inputs with the toolbar mentioned before.

Pressing Q before highlighting any content will just take the reader down to the comment section with cursor on, ready to type.

How do we do that? Thanks!

2

It’s going to vary depending on language/framework, but is pretty straightforward. Whatever language you’re using should have some method along the lines of GetSelection(), which should be currently highlighted text. Placing that in another textbox is likewise rather easy.

So, “Q” is pressed.

If GetSelection() is not empty
    Write value of that method to our textbox, leaving cursor at end
Else
    Move cursor to box below
End
3

This forum has more or less what you want. Select some text and a “floating” button with the word “Quote” appears.

It should not be hard to reverse engineer this feature, especially as Discourse is open source. Even if you do not want to follow the same license, the method should give you ideas.

4

Thank you. This forum definitely helps ::