🐛 Koenig - Fixed deselect if mouse released at end of doc when drag-selecting

refs https://github.com/TryGhost/Ghost/issues/9623
- track the `mousedown` position and switch the `click` handler to a `mouseup` handler
- only trigger the editor focus event if both the `mousedown` and `mouseup` events occur below the editor canvas
This commit is contained in:
Kevin Ansfield 2018-06-20 13:11:12 +01:00
parent 2fd9b79102
commit 984654e19e
2 changed files with 16 additions and 5 deletions

View File

@ -13,6 +13,7 @@ export default Component.extend({
// internal properties
_title: null,
_editor: null,
_mousedownY: 0,
// closure actions
onTitleChange() {},
@ -25,15 +26,21 @@ export default Component.extend({
this._title.focus();
},
// triggered when a click is registered on .gh-koenig-editor-pane
// triggered when a mousedown is registered on .gh-koenig-editor-pane
trackMousedown(event) {
this._mousedownY = event.clientY;
},
// triggered when a mouseup is registered on .gh-koenig-editor-pane
focusEditor(event) {
if (event.target.classList.contains('gh-koenig-editor-pane')) {
let editorCanvas = this._editor.element;
let {bottom} = editorCanvas.getBoundingClientRect();
// if a click occurs below the editor canvas, focus the editor and put
// the cursor at the end of the document
if (event.clientY > bottom) {
// if a mousedown and subsequent mouseup occurs below the editor
// canvas, focus the editor and put the cursor at the end of the
// document
if (this._mousedownY > bottom && event.clientY > bottom) {
let {post} = this._editor;
let range = post.toRange();
let {tailSection} = range;

View File

@ -1,5 +1,9 @@
{{!-- full height content pane --}}
<div class="gh-koenig-editor-pane flex flex-column mih-100" onclick={{action "focusEditor"}}>
<div
class="gh-koenig-editor-pane flex flex-column mih-100"
onmousedown={{action "trackMousedown"}}
onmouseup={{action "focusEditor"}}
>
{{gh-textarea
class="gh-editor-title"
placeholder=titlePlaceholder