From f2d94c5d8627adee985e605a18cf147003ef16de Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Fri, 15 Apr 2016 16:05:37 -0400 Subject: Scroll to the last comment I made and edit it. --- app/assets/javascripts/notes.js.coffee | 27 ++++++++++++++++++++++++--- 1 file changed, 24 insertions(+), 3 deletions(-) (limited to 'app/assets/javascripts/notes.js.coffee') diff --git a/app/assets/javascripts/notes.js.coffee b/app/assets/javascripts/notes.js.coffee index fa91baa07c0..a3d0d212bed 100644 --- a/app/assets/javascripts/notes.js.coffee +++ b/app/assets/javascripts/notes.js.coffee @@ -75,6 +75,9 @@ class @Notes # when issue status changes, we need to refresh data $(document).on "issuable:change", @refresh + # when a key is clicked on the notes + $(document).on "keydown", ".js-note-text", @keydownNoteText + cleanBinding: -> $(document).off "ajax:success", ".js-main-target-form" $(document).off "ajax:success", ".js-discussion-note-form" @@ -92,10 +95,19 @@ class @Notes $(document).off "click", ".js-note-target-reopen" $(document).off "click", ".js-note-target-close" $(document).off "click", ".js-note-discard" + $(document).off "keydown", ".js-note-text" $('.note .js-task-list-container').taskList('disable') $(document).off 'tasklist:changed', '.note .js-task-list-container' + keydownNoteText: (e) -> + $this = $(this) + if $this.val() is '' and e.which is 38 #aka the up key + myLastNote = $("li.note[data-author-id='#{gon.current_user_id}'][data-editable]:last") + if myLastNote.length + myLastNoteEditBtn = myLastNote.find('.js-note-edit') + myLastNoteEditBtn.trigger('click', [true, myLastNote]) + initRefresh: -> clearInterval(Notes.interval) Notes.interval = setInterval => @@ -343,7 +355,7 @@ class @Notes Adds a hidden div with the original content of the note to fill the edit note form with if the user cancels ### - showEditForm: (e) -> + showEditForm: (e, scrollTo, myLastNote) -> e.preventDefault() note = $(this).closest(".note") note.addClass "is-editting" @@ -355,8 +367,17 @@ class @Notes note.find(".js-note-attachment-delete").show() new GLForm form - - form.find(".js-note-text").focus() + if scrollTo? and myLastNote? + # scroll to the bottom + # so the open of the last element doesn't make a jump + $('html, body').scrollTop($(document).height()); + $('html, body').animate({ + scrollTop: myLastNote.offset().top - 150 + }, 500, -> + form.find(".js-note-text").focus() + ); + else + form.find(".js-note-text").focus() ### Called in response to clicking the edit note link -- cgit v1.2.1 From 262ca7b651037e02d0de662b6462fe4edfa77e81 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Fri, 15 Apr 2016 16:36:25 -0400 Subject: When editing put the cursor at the end of the textarea --- app/assets/javascripts/notes.js.coffee | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'app/assets/javascripts/notes.js.coffee') diff --git a/app/assets/javascripts/notes.js.coffee b/app/assets/javascripts/notes.js.coffee index a3d0d212bed..c2e103ff857 100644 --- a/app/assets/javascripts/notes.js.coffee +++ b/app/assets/javascripts/notes.js.coffee @@ -374,7 +374,11 @@ class @Notes $('html, body').animate({ scrollTop: myLastNote.offset().top - 150 }, 500, -> - form.find(".js-note-text").focus() + $noteText = form.find(".js-note-text") + $noteText.focus() + # Neat little trick to put the cursor at the end + noteTextVal = $noteText.val() + $noteText.val('').val(noteTextVal); ); else form.find(".js-note-text").focus() -- cgit v1.2.1 From dd0478656d877bea84a313826258f1a35f9b1ab4 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Sat, 16 Apr 2016 16:08:53 -0400 Subject: Add move cursor to last character for editing comment also. --- app/assets/javascripts/notes.js.coffee | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) (limited to 'app/assets/javascripts/notes.js.coffee') diff --git a/app/assets/javascripts/notes.js.coffee b/app/assets/javascripts/notes.js.coffee index c2e103ff857..82e210fed7d 100644 --- a/app/assets/javascripts/notes.js.coffee +++ b/app/assets/javascripts/notes.js.coffee @@ -366,6 +366,11 @@ class @Notes # Show the attachment delete link note.find(".js-note-attachment-delete").show() + done = ($noteText) -> + # Neat little trick to put the cursor at the end + noteTextVal = $noteText.val() + $noteText.val('').val(noteTextVal); + new GLForm form if scrollTo? and myLastNote? # scroll to the bottom @@ -376,12 +381,12 @@ class @Notes }, 500, -> $noteText = form.find(".js-note-text") $noteText.focus() - # Neat little trick to put the cursor at the end - noteTextVal = $noteText.val() - $noteText.val('').val(noteTextVal); + done($noteText) ); else - form.find(".js-note-text").focus() + $noteText = form.find('.js-note-text') + $noteText.focus() + done($noteText) ### Called in response to clicking the edit note link -- cgit v1.2.1