From d2d7c534eb90c4161add2e0847029fa24e29cdf4 Mon Sep 17 00:00:00 2001 From: Martin Edenhofer Date: Thu, 20 Jul 2017 17:17:46 +0200 Subject: [PATCH] Using text modules not working in IE 11 (only in IE 11). --- .../app/lib/base/jquery.contenteditable.js | 66 ++++++++----------- .../app/lib/base/jquery.textmodule.js | 25 ++++--- 2 files changed, 41 insertions(+), 50 deletions(-) diff --git a/app/assets/javascripts/app/lib/base/jquery.contenteditable.js b/app/assets/javascripts/app/lib/base/jquery.contenteditable.js index 2a1994828..d074e3dff 100644 --- a/app/assets/javascripts/app/lib/base/jquery.contenteditable.js +++ b/app/assets/javascripts/app/lib/base/jquery.contenteditable.js @@ -295,7 +295,7 @@ else { img = "" } - document.execCommand('insertHTML', false, img) + _this.paste(img) } // resize if to big @@ -367,13 +367,7 @@ text = App.Utils.removeEmptyLines(text) _this.log('insert', text) - // as fallback, insert html via pasteHtmlAtCaret (for IE 11 and lower) - if (docType == 'text3') { - _this.pasteHtmlAtCaret(text) - } - else { - document.execCommand('insertHTML', false, text) - } + _this.paste(text) return true }) @@ -533,37 +527,6 @@ return this.$element.html().trim() } - // taken from https://stackoverflow.com/questions/6690752/insert-html-at-caret-in-a-contenteditable-div/6691294#6691294 - Plugin.prototype.pasteHtmlAtCaret = function(html) { - var sel, range; - if (window.getSelection) { - sel = window.getSelection() - if (sel.getRangeAt && sel.rangeCount) { - range = sel.getRangeAt(0) - range.deleteContents() - - var el = document.createElement('div') - el.innerHTML = html; - var frag = document.createDocumentFragment(), node, lastNode - while ( (node = el.firstChild) ) { - lastNode = frag.appendChild(node) - } - range.insertNode(frag) - - if (lastNode) { - range = range.cloneRange() - range.setStartAfter(lastNode) - range.collapse(true) - sel.removeAllRanges() - sel.addRange(range) - } - } - } - else if (document.selection && document.selection.type != 'Control') { - document.selection.createRange().pasteHTML(html) - } - } - // log method Plugin.prototype.log = function() { if (App && App.Log) { @@ -574,7 +537,30 @@ } } - $.fn[pluginName] = function ( options ) { + // paste some content + Plugin.prototype.paste = function(string) { + var isIE11 = !!window.MSInputMethodContext && !!document.documentMode; + + // IE <= 10 + if (document.selection && document.selection.createRange) { + var range = document.selection.createRange() + if (range.pasteHTML) { + range.pasteHTML(string) + } + } + // IE == 11 + else if (isIE11 && document.getSelection) { + var range = document.getSelection().getRangeAt(0) + var nnode = document.createElement('div') + range.surroundContents(nnode) + nnode.innerHTML = string + } + else { + document.execCommand('insertHTML', false, string) + } + } + + $.fn[pluginName] = function (options) { return this.each(function () { if (!$.data(this, 'plugin_' + pluginName)) { $.data(this, 'plugin_' + pluginName, diff --git a/app/assets/javascripts/app/lib/base/jquery.textmodule.js b/app/assets/javascripts/app/lib/base/jquery.textmodule.js index 6236f42d3..699ff1847 100644 --- a/app/assets/javascripts/app/lib/base/jquery.textmodule.js +++ b/app/assets/javascripts/app/lib/base/jquery.textmodule.js @@ -250,9 +250,21 @@ // paste some content Plugin.prototype.paste = function(string) { - if (document.selection) { // IE + var isIE11 = !!window.MSInputMethodContext && !!document.documentMode; + + // IE <= 10 + if (document.selection && document.selection.createRange) { var range = document.selection.createRange() - range.pasteHTML(string) + if (range.pasteHTML) { + range.pasteHTML(string) + } + } + // IE == 11 + else if (isIE11 && document.getSelection) { + var range = document.getSelection().getRangeAt(0) + var nnode = document.createElement('div') + range.surroundContents(nnode) + nnode.innerHTML = string } else { document.execCommand('insertHTML', false, string) @@ -295,14 +307,7 @@ // for chrome, insert space again if (start) { if (spacerChar === ' ') { - string = " " - if (document.selection) { // IE - var range = document.selection.createRange() - range.pasteHTML(string) - } - else { - document.execCommand('insertHTML', false, string) - } + this.paste(' ') } } }