9 votes

Tildes User Script: Drag and drop usernames in order to mention them in your comments

It is was a tedious task to mention users: copy, type, paste. This script makes it a single step: drag and drop any username on to the comment you're composing, and tada! It's there.

Here is the script:

// ==UserScript==
// @name     tildesDragNDropUsernameForMention
// @version  1
// @grant    none
// @namespace   tildes.net
// ==/UserScript==

var userLinks = document.querySelectorAll('a.link-user');

var dragstartHandler = function (event) {
  var text = event.target.innerText;
  if(!text.startsWith('@')){
    text = "@" + text;
  }
  event.dataTransfer.setData("text", text);
  event.dataTransfer.dropEffect = 'copy';
}

userLinks.forEach(function (each) {
  each.setAttribute('draggable', true);
  each.ondragstart = dragstartHandler;
});

Patches welcome!

Edit: remove useless code

6 comments

  1. unknown user
    Link
    Version 2 without useless definitions: // ==UserScript== // @name tildesDragNDropUsernameForMention // @version 2 // @grant none // @namespace tildes.net // ==/UserScript==...

    Version 2 without useless definitions:

    // ==UserScript==
    // @name     tildesDragNDropUsernameForMention
    // @version  2
    // @grant    none
    // @namespace   tildes.net
    // ==/UserScript==
    
    document.querySelectorAll('a.link-user').forEach(function (each) {
      each.setAttribute('draggable', true);
      each.ondragstart = function (event) {
        var text = event.target.innerText;
        if(!text.startsWith('@')){
          text = "@" + text;
        }
        event.dataTransfer.setData("text", text);
        event.dataTransfer.dropEffect = 'copy';
      };
    });
    
    3 votes
  2. [5]
    Wes
    Link
    Thanks for sharing! I don't reference usernames often enough to use it personally, but I'm sure it'll be useful for some. As an alternative approach: maybe some sort of suggestive-feature could...

    Thanks for sharing! I don't reference usernames often enough to use it personally, but I'm sure it'll be useful for some.

    As an alternative approach: maybe some sort of suggestive-feature could pull names from the current thread, and volunteer them if you type @ or /u/? Though I don't know of any simple way to offer something like that.

    3 votes
    1. [4]
      unknown user
      Link Parent
      You're welcome! @Deimos uses really good class names, and again in this time, all instances of usernames are assigned link-user. So, apart from the UI, the implementation of such a feature would...

      You're welcome! @Deimos uses really good class names, and again in this time, all instances of usernames are assigned link-user. So, apart from the UI, the implementation of such a feature would be as easy as document.querySelectorAll('a.link-user') and display the results at where the cursor is in a filtering list. The UI would be straightforward but involved if you don't use a library (tho there is this that suggests it can be easier).

      2 votes
      1. [3]
        Algernon_Asimov
        Link Parent
        I'm curious (and feeling a bit cheeky). You user-mentioned someone in your comment. Did you use your script to do that?

        I'm curious (and feeling a bit cheeky). You user-mentioned someone in your comment. Did you use your script to do that?

        1 vote
        1. [2]
          unknown user
          Link Parent
          Nope :) The name needs to exist on the webpage somewhere so that you can drag and drop it on the comment text box. If the feature @Wes talked about was implemented, you could use it to auto...

          Nope :) The name needs to exist on the webpage somewhere so that you can drag and drop it on the comment text box. If the feature @Wes talked about was implemented, you could use it to auto complete Deimos or Algernon_Asimov. I was tempted to give it a try, but I already procrastinated enough, and that one is a bit too involved (and I'm no expert at browser stuff). Maybe someone with a better know-how can try their hand at writing it.

          BTW when mentioning Wes here, I did use the script.

          2 votes
          1. Algernon_Asimov
            Link Parent
            That's what I thought. :) Cool.

            Nope :) The name needs to exist on the webpage somewhere so that you can drag and drop it on the comment text box.

            That's what I thought. :)

            BTW when mentioning Wes here, I did use the script.

            Cool.

            1 vote