Fix highlighting of selection.

sourcing/static/js/build_links.js

@@ -1,5 +1,36 @@
-  $('#new-link').hide();
-  $('#new-link').click((e) => {
+function one_line(e, range) {
+    var text = e.text();
+    var before = text.substring(0, range.startOffset);
+    var span = text.substring(range.startOffset, range.endOffset);
+    var after = text.substring(range.endOffset);
+
+    (e.empty()
+      .append(before)
+      .append($('<span class="selected-span">').text(span))
+      .append(after));
+}
+
+function first_line(e, range) {
+  var text = e.text();
+  var before = text.substring(0, range.startOffset);
+  var span = text.substring(range.startOffset);
+
+  (e.empty()
+    .append(before)
+    .append($('<span class="selected-span">').text(span)));
+}
+
+function last_line(e, range) {
+    var text = e.text();
+    var span = text.substring(0, range.endOffset);
+    var after = text.substring(range.endOffset);
+
+    (e.empty()
+      .append($('<span class="selected-span">').text(span))
+      .append(after));
+}
+
+function highlight_selection() {
   var selection = window.getSelection();
   if(selection.type != 'Range')
     return;
@@ -15,13 +46,14 @@
 
   console.log('start', start, 'length', length);
 
-    var text = start_element.textContent;
-    var text1 = text.substring(0, range.startOffset);
-    var text2 = text.substring(range.startOffset + 1);
+  if (start_element == end_element) {
+    console.log('one line');
+    return one_line($(start_element), range);
+  }
 
-    console.log([text1, text2]);
+  first_line($(start_element), range);
 
-    var e = start_element;
+  var e = start_element.nextElementSibling;
   var count = 0;
 
   while (e != end_element && count < 50) {
@@ -29,19 +61,23 @@
     count++;
     e = e.nextElementSibling;
   }
-    e = end_element;
-    $(e).wrapInner('<span class="selected-span"></span>');
 
+  last_line($(end_element), range);
+}
+
+$('#new-link').hide();
+$('#new-link').click((e) => {
+  var selection = window.getSelection();
+  highlight_selection();
   selection.removeAllRanges();
   $('#new-link').hide();
+});
 
-  });
-
-  document.addEventListener('selectionchange', () => {
+document.addEventListener('selectionchange', () => {
   var selection = window.getSelection();
   if (selection.toString()) {
     $('#new-link').show();
   } else {
     $('#new-link').hide();
   }
-  });
+});