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

General touchup #2733

Open
wants to merge 5 commits into
base: main
Choose a base branch
from
+104 −107
Open

General touchup #2733

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
3d73705
make search_field_disabled smarter
koenpunt Oct 19, 2016
e9d9f5b
update tabindex handling
koenpunt Oct 19, 2016
3658d35
use fat arrow function for test_active_click
koenpunt Oct 19, 2016
204ed8d
remove arguments of function that don't use them
koenpunt Oct 19, 2016
5dd350a
let coffeescript handle function scope
koenpunt Oct 20, 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
93 changes: 46 additions & 47 deletions coffee/chosen.jquery.coffee
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,46 +71,46 @@ class Chosen extends AbstractChosen
@form_field_jq.trigger("chosen:ready", {chosen: this})

register_observers: ->
@container.bind 'touchstart.chosen', (evt) => this.container_mousedown(evt); return
@container.bind 'touchend.chosen', (evt) => this.container_mouseup(evt); return

@container.bind 'mousedown.chosen', (evt) => this.container_mousedown(evt); return
@container.bind 'mouseup.chosen', (evt) => this.container_mouseup(evt); return
@container.bind 'mouseenter.chosen', (evt) => this.mouse_enter(evt); return
@container.bind 'mouseleave.chosen', (evt) => this.mouse_leave(evt); return

@search_results.bind 'mouseup.chosen', (evt) => this.search_results_mouseup(evt); return
@search_results.bind 'mouseover.chosen', (evt) => this.search_results_mouseover(evt); return
@search_results.bind 'mouseout.chosen', (evt) => this.search_results_mouseout(evt); return
@search_results.bind 'mousewheel.chosen DOMMouseScroll.chosen', (evt) => this.search_results_mousewheel(evt); return

@search_results.bind 'touchstart.chosen', (evt) => this.search_results_touchstart(evt); return
@search_results.bind 'touchmove.chosen', (evt) => this.search_results_touchmove(evt); return
@search_results.bind 'touchend.chosen', (evt) => this.search_results_touchend(evt); return

@form_field_jq.bind "chosen:updated.chosen", (evt) => this.results_update_field(evt); return
@form_field_jq.bind "chosen:activate.chosen", (evt) => this.activate_field(evt); return
@form_field_jq.bind "chosen:open.chosen", (evt) => this.container_mousedown(evt); return
@form_field_jq.bind "chosen:close.chosen", (evt) => this.close_field(evt); return

@search_field.bind 'blur.chosen', (evt) => this.input_blur(evt); return
@search_field.bind 'keyup.chosen', (evt) => this.keyup_checker(evt); return
@search_field.bind 'keydown.chosen', (evt) => this.keydown_checker(evt); return
@search_field.bind 'focus.chosen', (evt) => this.input_focus(evt); return
@search_field.bind 'cut.chosen', (evt) => this.clipboard_event_checker(evt); return
@search_field.bind 'paste.chosen', (evt) => this.clipboard_event_checker(evt); return
@container.bind 'touchstart.chosen', this.container_mousedown
@container.bind 'touchend.chosen', this.container_mouseup
Copy link
Collaborator

Choose a reason for hiding this comment

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

we must be sure that these methods can never return false by mistake, as this would stop propagation and prevent default.
And the automatic return of CoffeeScript could hide this from us.


@container.bind 'mousedown.chosen', this.container_mousedown
@container.bind 'mouseup.chosen', this.container_mouseup
@container.bind 'mouseenter.chosen', this.mouse_enter
@container.bind 'mouseleave.chosen', this.mouse_leave

@search_results.bind 'mouseup.chosen', this.search_results_mouseup
@search_results.bind 'mouseover.chosen', this.search_results_mouseover
@search_results.bind 'mouseout.chosen', this.search_results_mouseout
@search_results.bind 'mousewheel.chosen DOMMouseScroll.chosen', this.search_results_mousewheel

@search_results.bind 'touchstart.chosen', this.search_results_touchstart
@search_results.bind 'touchmove.chosen', this.search_results_touchmove
@search_results.bind 'touchend.chosen', this.search_results_touchend

@form_field_jq.bind 'chosen:updated.chosen', this.results_update_field
@form_field_jq.bind 'chosen:activate.chosen', this.activate_field
@form_field_jq.bind 'chosen:open.chosen', this.container_mousedown
@form_field_jq.bind 'chosen:close.chosen', this.close_field

@search_field.bind 'blur.chosen', this.input_blur
@search_field.bind 'keyup.chosen', this.keyup_checker
@search_field.bind 'keydown.chosen', this.keydown_checker
@search_field.bind 'focus.chosen', this.input_focus
@search_field.bind 'cut.chosen', this.clipboard_event_checker
@search_field.bind 'paste.chosen', this.clipboard_event_checker

if @is_multiple
@search_choices.bind 'click.chosen', (evt) => this.choices_click(evt); return
@search_choices.bind 'click.chosen', this.choices_click
else
@container.bind 'click.chosen', (evt) -> evt.preventDefault(); return # gobble click of anchor

destroy: ->
$(@container[0].ownerDocument).unbind 'click.chosen', @click_test_action
$(@container[0].ownerDocument).unbind 'click.chosen', this.test_active_click
@form_field_label.unbind 'click.chosen' if @form_field_label.length > 0

if @search_field[0].tabIndex
@form_field_jq[0].tabIndex = @search_field[0].tabIndex
@form_field.tabIndex = @search_field[0].tabIndex

@container.remove()
@form_field_jq.removeData('chosen')
Expand All @@ -130,7 +130,7 @@ class Chosen extends AbstractChosen
else unless @is_multiple
@selected_item.bind 'focus.chosen', this.activate_field

container_mousedown: (evt) ->
container_mousedown: (evt) =>
return if @is_disabled

if evt and evt.type in ['mousedown', 'touchstart'] and not @results_showing
Expand All @@ -139,29 +139,29 @@ class Chosen extends AbstractChosen
if not (evt? and ($ evt.target).hasClass "search-choice-close")
if not @active_field
@search_field.val "" if @is_multiple
$(@container[0].ownerDocument).bind 'click.chosen', @click_test_action
$(@container[0].ownerDocument).bind 'click.chosen', this.test_active_click
this.results_show()
else if not @is_multiple and evt and (($(evt.target)[0] == @selected_item[0]) || $(evt.target).parents("a.chosen-single").length)
evt.preventDefault()
this.results_toggle()

this.activate_field()

container_mouseup: (evt) ->
container_mouseup: (evt) =>
this.results_reset(evt) if evt.target.nodeName is "ABBR" and not @is_disabled

search_results_mousewheel: (evt) ->
search_results_mousewheel: (evt) =>
delta = evt.originalEvent.deltaY or -evt.originalEvent.wheelDelta or evt.originalEvent.detail if evt.originalEvent
if delta?
evt.preventDefault()
delta = delta * 40 if evt.type is 'DOMMouseScroll'
@search_results.scrollTop(delta + @search_results.scrollTop())

blur_test: (evt) ->
blur_test: ->
this.close_field() if not @active_field and @container.hasClass "chosen-container-active"

close_field: ->
$(@container[0].ownerDocument).unbind "click.chosen", @click_test_action
close_field: =>
$(@container[0].ownerDocument).unbind 'click.chosen', this.test_active_click

@active_field = false
this.results_hide()
Expand All @@ -173,7 +173,7 @@ class Chosen extends AbstractChosen
this.search_field_scale()
@search_field.blur()

activate_field: ->
activate_field: =>
return if @is_disabled

@container.addClass "chosen-container-active"
Expand All @@ -183,7 +183,7 @@ class Chosen extends AbstractChosen
@search_field.focus()


test_active_click: (evt) ->
test_active_click: (evt) =>
active_container = $(evt.target).closest('.chosen-container')
if active_container.length and @container[0] == active_container[0]
@active_field = true
Expand Down Expand Up @@ -264,12 +264,11 @@ class Chosen extends AbstractChosen

@results_showing = false


set_tab_index: (el) ->
set_tab_index: ->
if @form_field.tabIndex
ti = @form_field.tabIndex
tabIndex = @form_field.tabIndex
@form_field.tabIndex = -1
@search_field[0].tabIndex = ti
@search_field[0].tabIndex = tabIndex

set_label_behavior: ->
@form_field_label = @form_field_jq.parents("label") # first check for a parent label
Expand All @@ -287,18 +286,18 @@ class Chosen extends AbstractChosen
@search_field.val("")
@search_field.removeClass "default"

search_results_mouseup: (evt) ->
search_results_mouseup: (evt) =>
target = if $(evt.target).hasClass "active-result" then $(evt.target) else $(evt.target).parents(".active-result").first()
if target.length
@result_highlight = target
this.result_select(evt)
@search_field.focus()

search_results_mouseover: (evt) ->
search_results_mouseover: (evt) =>
target = if $(evt.target).hasClass "active-result" then $(evt.target) else $(evt.target).parents(".active-result").first()
this.result_do_highlight( target ) if target

search_results_mouseout: (evt) ->
search_results_mouseout: (evt) =>
this.result_clear_highlight() if $(evt.target).hasClass "active-result" or $(evt.target).parents('.active-result').first()

choice_build: (item) ->
Expand Down
88 changes: 44 additions & 44 deletions coffee/chosen.proto.coffee
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,43 +55,43 @@ class @Chosen extends AbstractChosen
@form_field.fire("chosen:ready", {chosen: this})

register_observers: ->
@container.observe "touchstart", (evt) => this.container_mousedown(evt)
@container.observe "touchend", (evt) => this.container_mouseup(evt)

@container.observe "mousedown", (evt) => this.container_mousedown(evt)
@container.observe "mouseup", (evt) => this.container_mouseup(evt)
@container.observe "mouseenter", (evt) => this.mouse_enter(evt)
@container.observe "mouseleave", (evt) => this.mouse_leave(evt)

@search_results.observe "mouseup", (evt) => this.search_results_mouseup(evt)
@search_results.observe "mouseover", (evt) => this.search_results_mouseover(evt)
@search_results.observe "mouseout", (evt) => this.search_results_mouseout(evt)
@search_results.observe "mousewheel", (evt) => this.search_results_mousewheel(evt)
@search_results.observe "DOMMouseScroll", (evt) => this.search_results_mousewheel(evt)

@search_results.observe "touchstart", (evt) => this.search_results_touchstart(evt)
@search_results.observe "touchmove", (evt) => this.search_results_touchmove(evt)
@search_results.observe "touchend", (evt) => this.search_results_touchend(evt)

@form_field.observe "chosen:updated", (evt) => this.results_update_field(evt)
@form_field.observe "chosen:activate", (evt) => this.activate_field(evt)
@form_field.observe "chosen:open", (evt) => this.container_mousedown(evt)
@form_field.observe "chosen:close", (evt) => this.close_field(evt)

@search_field.observe "blur", (evt) => this.input_blur(evt)
@search_field.observe "keyup", (evt) => this.keyup_checker(evt)
@search_field.observe "keydown", (evt) => this.keydown_checker(evt)
@search_field.observe "focus", (evt) => this.input_focus(evt)
@search_field.observe "cut", (evt) => this.clipboard_event_checker(evt)
@search_field.observe "paste", (evt) => this.clipboard_event_checker(evt)
@container.observe 'touchstart', this.container_mousedown
@container.observe 'touchend', this.container_mouseup

@container.observe 'mousedown', this.container_mousedown
@container.observe 'mouseup', this.container_mouseup
@container.observe 'mouseenter', this.mouse_enter
@container.observe 'mouseleave', this.mouse_leave

@search_results.observe 'mouseup', this.search_results_mouseup
@search_results.observe 'mouseover', this.search_results_mouseover
@search_results.observe 'mouseout', this.search_results_mouseout
@search_results.observe 'mousewheel', this.search_results_mousewheel
@search_results.observe 'DOMMouseScroll', this.search_results_mousewheel

@search_results.observe 'touchstart', this.search_results_touchstart
@search_results.observe 'touchmove', this.search_results_touchmove
@search_results.observe 'touchend', this.search_results_touchend

@form_field.observe 'chosen:updated', this.results_update_field
@form_field.observe 'chosen:activate', this.activate_field
@form_field.observe 'chosen:open', this.container_mousedown
@form_field.observe 'chosen:close', this.close_field

@search_field.observe 'blur', this.input_blur
@search_field.observe 'keyup', this.keyup_checker
@search_field.observe 'keydown', this.keydown_checker
@search_field.observe 'focus', this.input_focus
@search_field.observe 'cut', this.clipboard_event_checker
@search_field.observe 'paste', this.clipboard_event_checker

if @is_multiple
@search_choices.observe "click", (evt) => this.choices_click(evt)
@search_choices.observe 'click', this.choices_click
else
@container.observe "click", (evt) => evt.preventDefault() # gobble click of anchor
@container.observe 'click', (evt) => evt.preventDefault() # gobble click of anchor

destroy: ->
@container.ownerDocument.stopObserving "click", @click_test_action
@container.ownerDocument.stopObserving 'click', this.test_active_click

for event in ['chosen:updated', 'chosen:activate', 'chosen:open', 'chosen:close']
@form_field.stopObserving(event)
Expand Down Expand Up @@ -132,7 +132,7 @@ class @Chosen extends AbstractChosen
else unless @is_multiple
@selected_item.observe 'focus', this.activate_field

container_mousedown: (evt) ->
container_mousedown: (evt) =>
return if @is_disabled

if evt and evt.type in ['mousedown', 'touchstart'] and not @results_showing
Expand All @@ -141,28 +141,28 @@ class @Chosen extends AbstractChosen
if not (evt? and evt.target.hasClassName "search-choice-close")
if not @active_field
@search_field.clear() if @is_multiple
@container.ownerDocument.observe "click", @click_test_action
@container.ownerDocument.observe 'click', this.test_active_click
this.results_show()
else if not @is_multiple and evt and (evt.target is @selected_item || evt.target.up("a.chosen-single"))
this.results_toggle()

this.activate_field()

container_mouseup: (evt) ->
container_mouseup: (evt) =>
this.results_reset(evt) if evt.target.nodeName is "ABBR" and not @is_disabled

search_results_mousewheel: (evt) ->
search_results_mousewheel: (evt) =>
delta = evt.deltaY or -evt.wheelDelta or evt.detail
if delta?
evt.preventDefault()
delta = delta * 40 if evt.type is 'DOMMouseScroll'
@search_results.scrollTop = delta + @search_results.scrollTop

blur_test: (evt) ->
blur_test: ->
this.close_field() if not @active_field and @container.hasClassName("chosen-container-active")

close_field: ->
@container.ownerDocument.stopObserving "click", @click_test_action
close_field: =>
@container.ownerDocument.stopObserving 'click', this.test_active_click

@active_field = false
this.results_hide()
Expand All @@ -174,7 +174,7 @@ class @Chosen extends AbstractChosen
this.search_field_scale()
@search_field.blur()

activate_field: ->
activate_field: =>
return if @is_disabled

@container.addClassName "chosen-container-active"
Expand All @@ -183,7 +183,7 @@ class @Chosen extends AbstractChosen
@search_field.value = this.get_search_field_value()
@search_field.focus()

test_active_click: (evt) ->
test_active_click: (evt) =>
if evt.target.up('.chosen-container') is @container
@active_field = true
else
Expand Down Expand Up @@ -285,18 +285,18 @@ class @Chosen extends AbstractChosen
@search_field.value = ""
@search_field.removeClassName "default"

search_results_mouseup: (evt) ->
search_results_mouseup: (evt) =>
target = if evt.target.hasClassName("active-result") then evt.target else evt.target.up(".active-result")
if target
@result_highlight = target
this.result_select(evt)
@search_field.focus()

search_results_mouseover: (evt) ->
search_results_mouseover: (evt) =>
target = if evt.target.hasClassName("active-result") then evt.target else evt.target.up(".active-result")
this.result_do_highlight( target ) if target

search_results_mouseout: (evt) ->
search_results_mouseout: (evt) =>
this.result_clear_highlight() if evt.target.hasClassName('active-result') or evt.target.up('.active-result')

choice_build: (item) ->
Expand Down
Loading