Batch Actions

- fix don’t break checkbox uncheck
- don’t break selection of ticket text
This commit is contained in:
Felix Niklas 2017-01-30 12:05:36 +01:00
parent 8fedf5759f
commit 7d4abee77e
2 changed files with 21 additions and 7 deletions

View file

@ -44,7 +44,6 @@ class App.TicketOverview extends App.Controller
# TODO: fire @cancelDrag on ESC # TODO: fire @cancelDrag on ESC
dragItem: (event) => dragItem: (event) =>
event.preventDefault()
pos = @batchDragger.data() pos = @batchDragger.data()
threshold = 3 threshold = 3
x = event.pageX - pos.dx x = event.pageX - pos.dx
@ -52,8 +51,12 @@ class App.TicketOverview extends App.Controller
dir = if event.pageY > pos.startY then 1 else -1 dir = if event.pageY > pos.startY then 1 else -1
if !pos.moved if !pos.moved
if Math.abs(event.pageX - pos.startX) > threshold or Math.abs(event.pageY - pos.startY) > threshold # trigger when moved a little up or down
# but don't trigge when moved left or right
# because the user might just want to select text
if Math.abs(event.pageY - pos.startY) - Math.abs(event.pageX - pos.startX) > threshold
@batchDragger.data 'moved', true @batchDragger.data 'moved', true
@el.addClass('u-no-userselect')
# check grabbed items batch checkbox to make sure its checked # check grabbed items batch checkbox to make sure its checked
# (could be grabbed without checking the checkbox it) # (could be grabbed without checking the checkbox it)
@grabbedItemWasntChecked = !@grabbedItem.find('[name="bulk"]').prop('checked') @grabbedItemWasntChecked = !@grabbedItem.find('[name="bulk"]').prop('checked')
@ -84,6 +87,8 @@ class App.TicketOverview extends App.Controller
else else
return return
event.preventDefault()
$.Velocity.hook @batchDragger, 'translateX', "#{x}px" $.Velocity.hook @batchDragger, 'translateX', "#{x}px"
$.Velocity.hook @batchDragger, 'translateY', "#{y}px" $.Velocity.hook @batchDragger, 'translateY', "#{y}px"
@ -103,15 +108,17 @@ class App.TicketOverview extends App.Controller
scale: 1.1 scale: 1.1
options: options:
duration: 200 duration: 200
complete: -> complete: =>
@hoveredBatchEntry.velocity 'reverse', @hoveredBatchEntry.velocity 'reverse',
duration: 200 duration: 200
complete: => complete: =>
# clean scale # clean scale
action = @hoveredBatchEntry.attr('data-action')
items = @el.find('[name="bulk"]:checked')
@hoveredBatchEntry.removeAttr('style') @hoveredBatchEntry.removeAttr('style')
@cleanUpDrag(true) @cleanUpDrag(true)
@performBatchAction @hoveredBatchEntry.attr('data-action')
@hoveredBatchEntry = null @performBatchAction items, action
@batchDragger.velocity @batchDragger.velocity
properties: properties:
scale: 0 scale: 0
@ -125,7 +132,9 @@ class App.TicketOverview extends App.Controller
cleanUpDrag: (success) -> cleanUpDrag: (success) ->
@hideBatchOverlay() @hideBatchOverlay()
@el.removeClass('u-no-userselect')
$('.batch-dragger').remove() $('.batch-dragger').remove()
@hoveredBatchEntry = null
if @grabbedItemWasntChecked if @grabbedItemWasntChecked
@grabbedItem.find('[name="bulk"]').prop('checked', false) @grabbedItem.find('[name="bulk"]').prop('checked', false)
@ -151,8 +160,8 @@ class App.TicketOverview extends App.Controller
easing: 'ease-in-out' easing: 'ease-in-out'
duration: 300 duration: 300
performBatchAction: (action) -> performBatchAction: (items, action) ->
console.log "perform action #{action} on checked items" console.log "perform action #{action} on #{items.length} checked items"
showBatchOverlay: -> showBatchOverlay: ->
@batchOverlay.show() @batchOverlay.show()

View file

@ -132,6 +132,10 @@ ul {
user-select: none; user-select: none;
} }
.u-no-userselect {
user-select: none;
}
.u-textTruncate { .u-textTruncate {
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
@ -8367,6 +8371,7 @@ output {
will-change: display; will-change: display;
cursor: grabbing; cursor: grabbing;
overflow: hidden; overflow: hidden;
user-select: none;
&-backdrop { &-backdrop {
@extend .fit; @extend .fit;