ready = ->
  if $.isFunction($.fn.nestable)
    $('.dd').nestable
      maxDepth: "<%= Spina.config.max_page_depth %>"

  if $('.page-template').length > 0
    page_parts = $('.page-template').data('page-parts')
    show_page_parts(page_parts)

  $('.sortable-grid').sortable().bind 'sortupdate', (e) ->
    position_array = []
    $(e.target).find('li.image').each (index) ->
      position_array.push $(this).data('photo-id')
    $(e.target).parents('.horizontal-form-content').find('.photo-positions').val(position_array.join(","))

  $('.structure-form-menu ul').sortable().bind 'sortupdate', (e) ->
    $(e.target).find('li').each (index) ->
      id = $(this).data('structure-item-id')
      $(".structure_form_pane_#{id}_position").val(index)

$(document).on 'turbolinks:load', ready

# Change templates makes page parts appear and disappear
$(document).on 'change', '.page-template select', ->
  page_parts = $(this).find('option:selected').data('page-parts').split(" ")
  show_page_parts(page_parts)

show_page_parts = (page_parts) ->
  $('.horizontal-form-group.page-part').hide()
  for page_part in page_parts
    $('.horizontal-form-group.page-part[data-name=' + page_part + ']').show()

# Dynamically add and remove structures
$(document).on 'click', 'form .add_structure_item_fields', (event) ->
  $structureForm = $(this).parents('.structure-form')

  time = new Date().getTime()
  regexp = new RegExp("#{$(this).data('id')}|new_association", 'g')
  $fields = $($(this).data('fields').replace(regexp, time))
  $structureForm.find('.structure-form-content').append($fields)

  $link = $("<li><a href='#structure_form_pane_#{time}'><i class='icon icon-bars'></i> </a></li>")

  $structureForm.find('.structure-form-menu ul').append($link)
  $fields.attr('id', "structure_form_pane_#{time}")

  $link.find('a').click()

  # Fire event
  $structureForm.trigger('spina:structure_added')

  event.preventDefault()

$(document).on 'click', 'form .remove_structure_item_fields', (event) ->
  $(this).prev('input[type=hidden]').val('1')
  $pane = $(this).closest('.structure-form-pane')
  $link = $("a[href='##{$pane.attr('id')}']").parents('li')
  $previousLink = $link.siblings('li:visible')

  $previousLink.find('a').trigger('click')
  $link.hide()
  $pane.hide()
  event.preventDefault()

$(document).on 'change', '.structure-form-pane .structure-form-part:first-child input', (event) ->
  value = $(this).val()
  $pane = $(this).parents('.structure-form-pane')
  $link = $("a[href='##{$pane.attr('id')}']")
  $link.html("<i class='icon icon-bars'></i> #{value}")

# Sort pages
$(document).on 'click', '.sort-switch', (event) ->
  $($(this).attr('href') + ' .dd-item-inner').toggleClass('dd-handle')
  if $(this).hasClass('button-success')
    $(this).removeClass('button-success')
    $(this).text($(this).data('change-order'))
    $(this).prepend('<i class="icon icon-random"></i>')
  else
    $(this).addClass('button-success')
    $(this).text($(this).data('done-changing-order'))
    $(this).prepend('<i class="icon icon-check"></i>')
  return false