Skip to content
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

Fixing sidebar not closing on outside content click issue #328

Merged
merged 2 commits into from
Mar 31, 2017
Merged

Fixing sidebar not closing on outside content click issue #328

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
96a0330
Fixing sidebar not closing on outside content click issue
sean-roberts Mar 30, 2017
b6741e5
Add tests for sidebar closing when user clicks or taps in document
robertknight Mar 31, 2017
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
13 changes: 13 additions & 0 deletions src/annotator/sidebar.coffee
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,16 @@ module.exports = class Sidebar extends Host
@element.on 'click', (event) =>
if !@selectedTargets?.length
this.hide()

# Mobile browsers do not register click events on
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I thought that this restriction applied only to iOS but not to Android Chrome. This works either way.

# elements without cursor: pointer. So instead of
# adding that to every element, we can add the initial
# touchstart event which is always registered to
# make up for the lack of click support for all elements.
@element.on 'touchstart', (event) =>
if !@selectedTargets?.length
this.hide()

return this

_setupSidebarEvents: ->
Expand Down Expand Up @@ -166,6 +176,9 @@ module.exports = class Sidebar extends Host
.removeClass('h-icon-chevron-right')
.addClass('h-icon-chevron-left')

isOpen: ->
!@frame.hasClass('annotator-collapsed')

createAnnotation: (annotation = {}) ->
super
this.show() unless annotation.$highlight
Expand Down
13 changes: 13 additions & 0 deletions src/annotator/test/sidebar-test.coffee
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -173,3 +173,16 @@ describe 'Sidebar', ->
hide = sandbox.stub(sidebar, 'hide')
sidebar.onSwipe({type: 'swiperight'})
assert.calledOnce(hide)

describe 'document events', ->

sidebar = null

beforeEach ->
sidebar = createSidebar({})

it 'closes the sidebar when the user taps or clicks in the page', ->
for event in ['click', 'touchstart']
sidebar.show()
sidebar.element.trigger(event)
assert.isFalse(sidebar.isOpen())