From 9467839d6ca21a27a1b523941b908c06337007cc Mon Sep 17 00:00:00 2001 From: yflory Date: Tue, 28 Apr 2020 18:11:46 +0200 Subject: [PATCH 1/2] Fix size of the autocomplete dropdown for mentions --- customize.dist/src/less2/include/comments.less | 3 +++ www/common/common-ui-elements.js | 10 ++++++++++ www/pad/comments.js | 11 +++++++++++ 3 files changed, 24 insertions(+) diff --git a/customize.dist/src/less2/include/comments.less b/customize.dist/src/less2/include/comments.less index 82647e2b4..50164a05c 100644 --- a/customize.dist/src/less2/include/comments.less +++ b/customize.dist/src/less2/include/comments.less @@ -22,6 +22,9 @@ } .cp-comment-form-input { .avatar_main(40px); + .cp-avatar { + border: 1px solid transparent; + } display: flex; align-items: flex-start; div.cp-textarea { diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js index 63e110c0b..cb325af77 100644 --- a/www/common/common-ui-elements.js +++ b/www/common/common-ui-elements.js @@ -3893,6 +3893,16 @@ define([ results.sort(sort); } cb(results); + // Set max-height to the autocomplete dropdown + try { + var max = window.innerHeight; + var pos = $t[0].getBoundingClientRect(); + var menu = $t.autocomplete("instance").menu.activeMenu; + menu.css({ + 'overflow-y': 'auto', + 'max-height': (max-pos.bottom)+'px' + }); + } catch (e) {} }, focus: function() { // prevent value inserted on focus diff --git a/www/pad/comments.js b/www/pad/comments.js index 0133a47c4..894cea838 100644 --- a/www/pad/comments.js +++ b/www/pad/comments.js @@ -239,6 +239,11 @@ define([ var obj = Util.clone(Env.comments.authors[id]); authors[obj.curvePublic] = obj; }); + for (var i = 0; i< 30; i++) { + authors['test'+i] = { + name: "Name"+i + }; + } Env.common.addMentions({ $input: $text, contenteditable: true, @@ -429,7 +434,13 @@ define([ updateMetadata(Env); Env.framework.localChange(); }); + $div.append(form); + + // Make sure the submit button is visible: scroll by the height of the form + setTimeout(function () { + Env.$container.scrollTop(Env.$container.scrollTop() + 55); + }); }); UI.confirmButton(resolve, { From 4d6d9637ffe1408eca76a4ef6cc493c44e8bc82d Mon Sep 17 00:00:00 2001 From: yflory Date: Tue, 28 Apr 2020 18:16:21 +0200 Subject: [PATCH 2/2] lint compliance --- www/common/common-ui-elements.js | 25 ++++++++++++------------- www/common/sframe-app-framework.js | 4 +++- www/pad/comments.js | 9 ++------- 3 files changed, 17 insertions(+), 21 deletions(-) diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js index cb325af77..8ce295fcf 100644 --- a/www/common/common-ui-elements.js +++ b/www/common/common-ui-elements.js @@ -3673,10 +3673,10 @@ define([ var node = document.createTextNode(text); range.insertNode(node); - for (var position = 0; position != text.length; position++) { + for (var position = 0; position !== text.length; position++) { selection.modify("move", "right", "character"); - }; - } + } + }; var getSource = {}; getSource['contacts'] = function (common, sources) { @@ -3710,7 +3710,7 @@ define([ try { insertTextAtCursor(e.originalEvent.clipboardData.getData('text')); e.preventDefault(); - } catch (e) { console.error(e); } + } catch (err) { console.error(err); } }); // Fix backspace with "contenteditable false" children @@ -3767,14 +3767,14 @@ define([ // Get the text between the last @ before the cursor and the cursor var extractLast = function (term, offset) { - var offset = typeof(offset) !== "undefined" ? offset : $t[0].selectionStart; + offset = typeof(offset) !== "undefined" ? offset : $t[0].selectionStart; var startOffset = term.slice(0,offset).lastIndexOf('@'); return term.slice(startOffset+1, offset); }; // Insert the autocomplete value in the input field var insertValue = function (value, offset, content) { - var offset = typeof(offset) !== "undefined" ? offset : $t[0].selectionStart; - var content = content || getValue(); + offset = typeof(offset) !== "undefined" ? offset : $t[0].selectionStart; + content = content || getValue(); var startOffset = content.slice(0,offset).lastIndexOf('@'); var length = offset - startOffset; if (length <= 0) { return; } @@ -3798,7 +3798,6 @@ define([ var _extractLast = extractLast; // Use getSelection to get the cursor position in contenteditable extractLast = function () { - var val = getValue(); var sel = document.getSelection(); if (sel.anchorNode.nodeType !== Node.TEXT_NODE) { return; } return _extractLast(sel.anchorNode.nodeValue, sel.anchorOffset); @@ -3832,14 +3831,14 @@ define([ var range = document.createRange(); range.setStart(next, 0); range.setEnd(next, 0); - var sel = window.getSelection(); - sel.removeAllRanges(); - sel.addRange(range); + var newSel = window.getSelection(); + newSel.removeAllRanges(); + newSel.addRange(range); }; // Inserting contacts into contenteditable: use mention UI if (options.type === "contacts") { - toInsert = function (data, key) { + toInsert = function (data) { var avatar = h('span.cp-avatar', { contenteditable: false }); @@ -3871,7 +3870,7 @@ define([ e.preventDefault(); e.stopPropagation(); } - } catch (e) {} + } catch (err) { console.error(err); } } }).autocomplete({ minLength: 0, diff --git a/www/common/sframe-app-framework.js b/www/common/sframe-app-framework.js index 5cccc6cba..7fc6e6692 100644 --- a/www/common/sframe-app-framework.js +++ b/www/common/sframe-app-framework.js @@ -265,6 +265,7 @@ define([ if (!bool && update) { onRemote(); } }; + /* var hasChanged = function (content) { try { var oldValue = JSON.parse(cpNfInner.chainpad.getUserDoc()); @@ -276,8 +277,9 @@ define([ } catch (e) {} return false; }; + */ - onLocal = function (padChange) { + onLocal = function (/*padChange*/) { if (state !== STATE.READY) { return; } if (readOnly) { return; } diff --git a/www/pad/comments.js b/www/pad/comments.js index 894cea838..f34749d5f 100644 --- a/www/pad/comments.js +++ b/www/pad/comments.js @@ -224,7 +224,7 @@ define([ try { var visible = $text.autocomplete("instance").menu.activeMenu.is(':visible'); if (visible) { return; } - } catch (e) {} + } catch (err) {} $(submit).click(); e.preventDefault(); } @@ -239,11 +239,6 @@ define([ var obj = Util.clone(Env.comments.authors[id]); authors[obj.curvePublic] = obj; }); - for (var i = 0; i< 30; i++) { - authors['test'+i] = { - name: "Name"+i - }; - } Env.common.addMentions({ $input: $text, contenteditable: true, @@ -336,7 +331,7 @@ define([ var name = $el.attr('data-name'); var avatarUrl = $el.attr('data-avatar'); var profile = $el.attr('data-profile'); - if (!name && !avatar && !profile) { + if (!name && !avatarUrl && !profile) { $el.remove(); return; }