textarea selection interaction

I've been running a blog with daily entires for 15 years. A while back i switched it to be mostly a Twitter/Tumbler like format, with quick quotes or links collated as a single day separated by little breaks.

The blog serves as my statement of record, so often I'm copying and pasting links entries I'd shared on FB (where my community of readers and friends has by and large moved...)

I've always prefered a raw HTML editor for this (vs WYSIWYG) but typing up endless<a href="">links</a> can be a bit fiddly, so a tool that would turn the highlighted text into a link would be sweet. I figured I had 3 main use cases:

1. I have the text I want to turn into a link highlighted
2. I have a link I went to make clickable highlighted
3. If I'm copy from FB, I tend to lead with the link, and then maybe the next few words should be the clickable text.

Short story long, I used jquery-textrange and the following shows off three links and how they are treated:

Here is the heuristic code...
<script>
jQuery(function(){
  jQuery("#linky").click(linky_maintext_normal);
});

function linky_maintext_normal(){
  var jqo = jQuery("#maintext_normal");
  var selectedText = jqo.textrange('get').text;
  var url = ""; 
  var clickText = "";
  if(selectedText.indexOf('http') == 0) {
       var spaceLocation = selectedText.indexOf(' ');
       if(spaceLocation == -1) {
          url = selectedText; 
       } else {
          url = selectedText.substring(0, spaceLocation);
          clickText = selectedText.substring(spaceLocation+1);
       }
  } else {
    clickText = selectedText;
  }
  jqo.textrange('replace','<a href="'+url+'">'+clickText+'</a>')
}
</script>

The logic had to be a little clunky and special-case-y, but good enough.

I think textarea selected range manipulation is a very powerful tool, since it gives the poweruser the chance to see what was changed and make further modifications, vs custom modals or, worse, server round-trips.

(UPDATE: in 2021 I made up the vanilla JS version of this.... I don't cover the "with some descriptive text" case, I had forgotten I put that feature in so never use it, it's kind of cleaner to be all or nothing tbh)