Skip to content

Delete Key Fix #6

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
AlexArendsen wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Delete Key Fix #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
791a9cf
Adopted Facebook-style Arrow Key + Backspace Behavior for Inserted Texts
AlexArendsen Jul 1, 2016
a62f6a0
Delete Key Fix
AlexArendsen Jul 3, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/default.coffee
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ KEY_CODE =
DOWN:40
BACKSPACE: 8
SPACE: 32
DELETE: 46

# Functions set for handling and rendering the data.
# Others developers can override these methods to tweak At.js such as matcher.
Expand Down
45 changes: 31 additions & 14 deletions src/editableController.coffee
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ class EditableController extends Controller
sel = @app.window.getSelection()
sel.getRangeAt(0) if sel.rangeCount > 0

# AKA, the "move the cursor [before|after] the given node" function
_setRange: (position, node, range=@_getRange()) ->
return unless range
node = $(node)[0]
Expand Down Expand Up @@ -37,6 +38,15 @@ class EditableController extends Controller
return unless range = @_getRange()
return unless range.collapsed

# Check inserts for disparity on Backspace and delete
if e.which in [KEY_CODE.BACKSPACE, KEY_CODE.DELETE]
@$inputor.find('[data-atwho-chosen-value]')
.each () ->
console.log "Wre are compareking \"" + $(this).text() + "\" and \"" + $(this).attr('data-atwho-chosen-value') + "\""
if $(this).text() != $(this).attr('data-atwho-chosen-value')
$(this).remove()
return

if e.which == KEY_CODE.ENTER
($query = $(range.startContainer).closest '.atwho-query')
.contents().unwrap()
Expand Down Expand Up @@ -67,33 +77,39 @@ class EditableController extends Controller
@_setRange 'after', $inserted.contents().last()

# modifying inserted element
# Correcting atwho-inserted and atwho-query classes based on current cursor position
$(range.startContainer)
.closest '.atwho-inserted'
.addClass 'atwho-query'
.siblings().removeClass 'atwho-query'

if ($query = $ ".atwho-query", @app.document).length > 0 \
$query = $ range.startContainer
.closest '.atwho-query'

if $query.length > 0 \
and $query.is(':empty') and $query.text().length == 0
$query.remove()
return

# EVERYTHING BELOW HERE IS EXECUTED ONLY IF THERE IS AN .atwho-query ELEMENT

if not @_movingEvent e
$query.removeClass 'atwho-inserted'
else
return if $query.length > 0

if $query.length > 0
switch e.which
when KEY_CODE.LEFT
@_setRange 'before', $query.get(0), range
$query.removeClass 'atwho-query'
return
when KEY_CODE.RIGHT
@_setRange 'after', $query.get(0).nextSibling, range
$query.removeClass 'atwho-query'
return
if $query.length > 0 and query_content = $query.text()
chosen = $query.attr('data-atwho-chosen-value')
if chosen and query_content != chosen
# $query.empty().html(query_content).attr('data-atwho-chosen-value', null)
$query.before(query_content).remove()
return
# This ensures that the cursor stays where it's supposed to be when the user is typing in their query
@_setRange 'after', $query.get(0), range

# matching
if $query.length > 0 and query_content = $query.attr('data-atwho-at-query')
$query.empty().html(query_content).attr('data-atwho-at-query', null)
@_setRange 'after', $query.get(0), range
# We now build a _range that contains the query text
# Note: @at = whatever symbol this controller is registered for ('@', '#', etc); the `flag`
_range = range.cloneRange()
_range.setStart range.startContainer, 0
matched = @callbacks("matcher").call(this, @at, _range.toString(), @getOpt('startWithSpace'), @getOpt("acceptSpaceBar"))
Expand Down Expand Up @@ -156,6 +172,7 @@ class EditableController extends Controller
.addClass 'atwho-inserted'
.html content
.attr 'data-atwho-at-query', "" + data['atwho-at'] + @query.text
.attr 'data-atwho-chosen-value', "" + data['atwho-at'] + content
if range = @_getRange()
range.setEndAfter @query.el[0]
range.collapse false
Expand Down