From 4a5d29b83d76767d3179d0e60141e44fa2dada07 Mon Sep 17 00:00:00 2001
From: azivner <adam.zivner@gmail.com>
Date: Fri, 25 Aug 2017 00:00:08 -0400
Subject: [PATCH] fixed major rendering problem with mixed links and
 formattings

---
 src/templates/app.html     |  2 +-
 static/js/html2notecase.js |  2 ++
 static/js/notecase2html.js | 47 +++++++++++++++++++-------------------
 3 files changed, 27 insertions(+), 24 deletions(-)

diff --git a/src/templates/app.html b/src/templates/app.html
index c301b4984..f1114faf1 100644
--- a/src/templates/app.html
+++ b/src/templates/app.html
@@ -41,7 +41,7 @@
 
           <ul>
             <li>insert - create new note on current tree level</li>
-            <li>shift + insert - create new sub-note</li>
+            <li>ctrl + insert - create new sub-note</li>
             <li>delete - delete current note (and it's sub-notes)</li>
             <li>shift + up - move current note up in the current tree level</li>
             <li>shift + down - move current note down in the current tree level</li>
diff --git a/static/js/html2notecase.js b/static/js/html2notecase.js
index 881f0f2e0..e2de65012 100644
--- a/static/js/html2notecase.js
+++ b/static/js/html2notecase.js
@@ -144,5 +144,7 @@ function html2notecase(contents, note) {
         }
     }
 
+    //console.log(contents);
+
     note.detail.note_text = contents;
 }
\ No newline at end of file
diff --git a/static/js/notecase2html.js b/static/js/notecase2html.js
index 4eef20a38..52eb7824a 100644
--- a/static/js/notecase2html.js
+++ b/static/js/notecase2html.js
@@ -1,9 +1,14 @@
 function notecase2html(note) {
     let noteText = note.detail.note_text;
 
-    let formatting = note.formatting;
-    let links = note.links;
-    let images = note.images;
+    note.formatting.forEach(el => el.type = 'formatting');
+    note.links.forEach(el => el.type = 'link');
+    note.images.forEach(el => el.type = 'image');
+
+    let all = note.formatting.concat(note.links).concat(note.images);
+    all.sort(function compare(a, b) {
+       return a.note_offset - b.note_offset;
+    });
 
     let offset = 0;
     let lastTag = null;
@@ -14,32 +19,28 @@ function notecase2html(note) {
         return noteText.substr(0, position) + injected + noteText.substr(position);
     }
 
-    for (let fmt of formatting) {
-        if (tags[fmt.fmt_tag]) {
-            noteText = inject(noteText, tags[fmt.fmt_tag], fmt.note_offset + offset);
+    for (let el of all) {
+        if (el.type === 'formatting') {
+            if (tags[el.fmt_tag]) {
+                noteText = inject(noteText, tags[el.fmt_tag], el.note_offset + offset);
+            }
         }
-    }
+        else if (el.type === 'link') {
+            let linkHtml = '<a href="' + el.target_url + '">' + el.lnk_text + '</a>';
 
-    offset = 0;
+            noteText = noteText.substr(0, el.note_offset + offset) + noteText.substr(el.note_offset + offset + el.lnk_text.length);
 
-    for (let link of links) {
-        let linkHtml = '<a href="' + link.target_url + '">' + link.lnk_text + '</a>';
+            noteText = inject(noteText, linkHtml, el.note_offset + offset);
 
-        noteText = noteText.substr(0, link.note_offset + offset) + noteText.substr(link.note_offset + offset + link.lnk_text.length);
+            offset -= el.lnk_text.length;
+        }
+        else if (el.type === 'image') {
+            let type = el.is_png ? "png" : "jpg";
 
-        noteText = inject(noteText, linkHtml, link.note_offset + offset);
+            let imgHtml = '<img alt="Embedded Image" src="data:image/' + type + ';base64,' + el.image_data + '" />';
 
-        offset -= link.lnk_text.length;
-    }
-
-    offset = 0;
-
-    for (let image of images) {
-        let type = image.is_png ? "png" : "jpg";
-
-        let imgHtml = '<img alt="Embedded Image" src="data:image/' + type + ';base64,' + image.image_data + '" />';
-
-        noteText = inject(noteText, imgHtml, image.note_offset + offset);
+            noteText = inject(noteText, imgHtml, el.note_offset + offset);
+        }
     }
 
     noteText = noteText.replace(/(?:\r\n|\r|\n)/g, '<br />');