

Activator 		= window.require 'spine/controller/activator'
Activateable 	= window.require 'spine/controller/activateable'
Scrollable 		= require '../../core/controller/scrollable'

Item 			= require './item'
Content 		= window.require 'core/models/content'

BulkEditor      = require './bulk-editor'

###
Details text
###
class Details extends Activator
	className		: 'editor-content'
	autoDeactivate 	: false
	title 			: 'Details'
	nextTitle   	: 'Edit Details'
	interval 		: 0
	vh				: 0
	eof				: 0

	@include Activateable
	@include Scrollable

	constructor: ->
		super
		@scroll()
		@container.sortable
			itemSelector: ".item-details"
			handle:       ".item-details-order"
			onDragStart:  @onDragStart
			onDrop:       @onDrop
			onDrag:       @onDrag

		@bulkEditor = new BulkEditor()
		@bulkEditor.toggle()
		@bulkEditor.bind 'toggle', (open) =>
			setTimeout (=> @scroll().update()), 500

		# TODO: review usage
		@items = []

	for: (@composition) ->
		@initialize()

		@el.prepend @bulkEditor.el
		@bulkEditor.for @composition

		@

	initialize: (options) =>
		return console.warn 'No composition set' unless @composition

		@children (i) -> i.release()
		@stopListening()
		@listenTo Content, 'create', @addItem

		@composition.getContent().forEach @addItem

		@trigger 'initialized'

	onDragStart: (item, container, _super) =>
		item.controller().deactivate()

		_super item,container

		item.controller().deactivate()
		@scroll().update()
		@$item = $ item

		@vh  = @container.parent().height()
		@oh  = @container[0].scrollHeight
		@eof = @el.offset()

	onDrag: (item, position, _super) =>
		# position.top += @container.scrollTop()
		_super item, position

		offset    = @$item.offset()
		@position = position
		@offset   = offset
		@dragged  = @$item

		top    = offset.top - @eof.top < 30
		bottom = offset.top - @eof.top > @vh - 10

		unless top or bottom
			clearInterval @interval
			@interval = 0
		else if top
			@interval = setInterval @scrollTop , 10 if @interval is 0
		else if bottom
			@interval = setInterval @scrollBottom, 10 if @interval is 0

	onDrop: (item, container, _super) =>
		_super item, container

		item.controller().onDrop()
		@$item = null
		@_relocate()
		clearInterval @interval
		@interval = 0

	scrollTop: =>
		top = @container.scrollTop()
		return unless top > 0
		@scroll().scrollTo top - 4
		@dragged.css top: parseInt(@dragged.css 'top')-4

	scrollBottom: =>
		top = @container.scrollTop()
		return unless (elTop = parseInt @dragged.css 'top') < @oh - 4
		@scroll().scrollTo top + 4
		@dragged.css top: 4+elTop

	_relocate: =>
		@children((i) -> i.item.order isnt i.el.index()+1).forEach (i) ->
			i.item.updateAttribute 'order', i.el.index()+1, attribute: 'order'

		@scroll().update()

	_release: =>
		super

		setTimeout @_relocate, 100
		@delay =>
			if @isActive() and @children().length is 0
				@$trigger 'DetailsEditor:empty'

	addItem: (item) =>
		return unless item.composition_id is @composition.id

		@append i = new Item {item, meta: item.meta()}
		item.updateAttribute 'order', i.el.index()+1, attribute: 'order'

		@scroll().update()
		@items.push i

	_onActivate: =>
		return if @children((i) -> i.isActive()).length

		@children((i) -> !i.isInvalid)[0]?.activate animate: true
		@scroll().update()

	activate: =>
		Activateable.activate.apply @, arguments
		@$trigger 'viewChange', 'details'
		@delay @_onActivate
		@

	onScroll: =>
		@children (child) -> child.attributes.deactivate?()

module.exports = Details
