[FIX] web_editor: solve all triple-click issues

... hopefully.

This *must* be forward-ported.

Depending on the browser, the triple-click behavior is different. This
is especially problematic on Chrome, where blank characters at the start
of the neighbor of the clicked element are selected.

A weak attempt to solve that was made by commit https://github.com/odoo/odoo/commit/b85bd358234684974f9af63bc5f28cfabb527767

This commit hopes to solve all the issues once and for all by fully
reimplementing the triple-click for all browsers. The concept is simple:
when a triple-click occurs, select the whole *inner* content of the
deepest DOM *element* that was clicked.
This commit is contained in:
qsm-odoo
2018-01-25 12:44:36 +01:00
parent 78a556601e
commit 2fad2e43b8
+12 -22
View File
@@ -583,8 +583,8 @@ var RTE = Widget.extend({
onEnableEditableArea: function ($editable) {
},
onMouseup: function (event) {
var $target = $(event.target);
onMouseup: function (ev) {
var $target = $(ev.target);
var $editable = $target.closest('.o_editable');
if (!$editable.size()) {
@@ -596,26 +596,16 @@ var RTE = Widget.extend({
self.historyRecordUndo($target, 'activate', true);
},0);
// To Fix Google Chrome Tripleclick Issue, which selects the ending
// whitespace characters (so Tripleclicking then typing text will remove
// the whole paragraph instead of its content).
// http://stackoverflow.com/questions/38467334/why-does-google-chrome-always-add-space-after-selected-text
if ($.browser.chrome === true && event.originalEvent.detail === 3) {
var currentSelection = range.create();
if (currentSelection.sc.parentNode === currentSelection.ec) {
_selectSC(currentSelection);
} else if (currentSelection.eo === 0) {
var $hasNext = $(currentSelection.sc).parent();
while (!$hasNext.next().length && !$hasNext.is('body')) {
$hasNext = $hasNext.parent();
}
if ($hasNext.next()[0] === currentSelection.ec) {
_selectSC(currentSelection);
}
}
}
function _selectSC(selection) {
range.create(selection.sc, selection.so, selection.sc, selection.sc.length).select();
// Browsers select different content from one to another after a
// triple click (especially: if triple-clicking on a paragraph on
// Chrome, blank characters of the element following the paragraph are
// selected too)
//
// The triple click behavior is reimplemented for all browsers here
if (ev.originalEvent.detail === 3) {
// Select the whole content inside the deepest DOM element that was
// triple-clicked
range.create(ev.target, 0, ev.target, ev.target.childNodes.length).select();
}
},