Some useful Marionette behaviors!

trackdrag.coffee

class Behavior.TrackDrag extends Marionette.Behavior
	events:
		dragstart: 'start'
		dragenter: 'enter'
		dragleave: 'leave'
		dragend: 'leave'
		dragover: 'over'
		drop: 'drop'

	start: (e) ->

		# can only drag from something selected
		unless @view.model.get 'selected' then return

		models = []
		files = []
		for model in @view.model.collection.models
			if model.get 'selected'
				models.push model
				files.push model.get 'file'

		if models.length == 0
			return

		m = models[0]


		console.log 'start drag'
		if e.originalEvent then e = e.originalEvent

		e.dataTransfer.effectAllowed = "copyMove"
		e.dataTransfer.dropEffect = "copy"
		e.dataTransfer.setData 'files', JSON.stringify files

		# create tooltip
		if models.length == 1
			text = m.get('title')+' - '+m.get('artist')
		else
			text = models.length+' tracks'
		h = 14
		font = 'bold '+h+'px sans-serif'
		canvas = document.createElement 'canvas'
		ctx = canvas.getContext '2d'

		ctx.font = font
		w = ctx.measureText(text).width
		canvas.width = w+20
		canvas.height = h+8

		ctx.textBaseline = 'middle'
		ctx.font = font

		ctx.fillText text, 10, canvas.height/2
		img = new Image()
		img.src = canvas.toDataURL()
		e.dataTransfer.setDragImage img, 0, 0

	enter: (e) ->
		e.preventDefault()
		@$el.addClass @overClass

	leave: (e) ->
		e.preventDefault()
		@$el.removeClass @overClass

	over: (e) ->
		e.preventDefault()
		return false

	drop: (e) ->
		e.preventDefault()
		@leave e
		#currentIndex = @$el.index()

		#@model.collection.remove @parent.draggedModel
		#@model.collection.add @parent.draggedModel, at: currentIndex

		#@trigger 'drop', @parent.draggedModel

trackselect.coffee

class Behavior.TracklistSelect extends Marionette.Behavior

	initialize: ->
		@canUp = false

		@listenTo @view, 'childview:mousedown:row', @rowMouseDown
		@listenTo @view, 'childview:mouseup:row', @rowMouseUp

	rowMouseDown: (view, e) ->
		@canUp = false
		model = view.model
		col = model.collection

		if e.target.nodeName == 'A' or model.has 'directory'
			return

		if e.ctrlKey
			model.set 'selected', !model.get 'selected'
			col.lastSelectedModel = model
			e.preventDefault()
		else if e.shiftKey
			@rangeSelection model
			e.preventDefault()
		else if !model.get 'selected'
			@clearSelection model.collection
			model.set 'selected', true
			col.lastSelectedModel = model
		else
			@canUp = true
			col.lastSelectedModel = model

	rowMouseUp: (view, e) ->
		unless @canUp then return
		@clearSelection view.model.collection
		view.model.set 'selected', true

	clearSelection: (col) ->
		for m in col.models
			m.set 'selected', false

	rangeSelection: (m1) ->
		col = m1.collection
		m2 = col.lastSelectedModel
		
		index1 = col.models.indexOf m1
		index2 = col.models.indexOf m2
		if index1 == -1 then return
		if index2 == -1 then index2 = 0
		low = Math.min index1, index2
		high = Math.max index1, index2

		@clearSelection col
		for i in [low..high]
			m = col.at i
			if m.has 'file'
				m.set 'selected', true


class Behavior.TrackSelect extends Marionette.Behavior
	events:
		'mousedown': 'mouseDown'
		'mouseup': 'mouseUp'

	modelEvents:
		'change:selected': 'selectedChanged'

	mouseDown: (e) ->
		@view.trigger 'mousedown:row', e

	mouseUp: (e) ->
		@view.trigger 'mouseup:row', e

	selectedChanged: ->
		if @view.model.get 'selected'
			@view.$el.addClass 'selected'
		else
			@view.$el.removeClass 'selected'