class EditableTableAligner
  @align_table: (obj, xhr) ->
    # move colhead class to left column
    EditableTableAligner.align_static_left_columns(obj, xhr)
    console.log("left columns moved")


    # allowing of paired scrolling
    EditableTableAligner.paired_left_right_scrolling(obj)
    console.log("left right scrolling paired")
    EditableTableAligner.paired_up_down_scrolling(obj)
    console.log("up down scrolling paired")


    # align widths and heights at last after moving all columns
    # align withs of header and body of table
    EditableTableAligner.align_widths(obj)
    console.log("align widths")


    # aligning heights of static left or right columns and center content of table
    EditableTableAligner.align_heights(obj)
    console.log("align heights")

  @align_after_rows_update: (obj) ->
    # move colhead class to left column
    EditableTableAligner.align_static_left_columns_after_row_update(obj)
    console.log("left columns moved")

    # align widths and heights at last after moving all columns
    # align withs of header and body of table
    EditableTableAligner.align_widths(obj)
    console.log("roew align widths")
    # aligning heights of static left or right columns and center content of table
    EditableTableAligner.align_heights(obj)
    console.log("roew align heights")

  #########################
  ### private methods #########
  ##############################

  @align_widths: (obj) ->
    # going trough headers th
#    console.log($("#" + obj.form_id).find('td[data-width-align-id]'))

    $("#" + obj.form_id).find('th[data-width-align-id]').each (index, element) =>

      # loading paired td and th
      th = $(element)

      # id of paired th and td elements
      width_align_id = th.data("width-align-id")

      td = $("#" + obj.form_id).find('td[data-width-align-id="' + width_align_id + '"]').first()

      #careful delete one by one, or scrolling will be lost
      # have to delete it from elements, otherwise the width would increase (alwazs adding padding nad vbroder to outerWidth)
      th.css({
      'min-width': "",
      'max-width': ""
      })

      td.css({
      'min-width': "",
      'max-width': ""
      })


      # determining max width
      th_width = th.outerWidth()
      td_width = td.outerWidth()


      if th_width > td_width
        max_width = th_width
      else
        max_width = td_width


      # setting max width
      th.css({
      'min-width': max_width,
      'max-width': max_width
      })

      td.css({
      'min-width': max_width,
      'max-width': max_width
      })


    return

  @paired_left_right_scrolling: (obj) ->
    #scrolling of head must affect body and vice versa
    head = $("#" + obj.form_id).find(".centerContainer .scrollTargetContainter").first()
    body = $("#" + obj.form_id).find(".centerContainer .detachedTableContainer").first()

    EditableTableAligner.side_scroll(head, body)
    EditableTableAligner.side_scroll(body, head)


  @side_scroll: (source, target) ->
    $(source).scroll ->
      target.scrollLeft(parseInt(source.scrollLeft()))



  @paired_up_down_scrolling: (obj) ->
    #scrolling of head must affect body and vice versa
    center_body = $("#" + obj.form_id).find(".centerContainer .detachedTableContainer").first()
    fixed_left_column_body = $("#" + obj.form_id).find(".fixedLeftColumn .detachedTableContainer").first()


    EditableTableAligner.scroll(center_body, fixed_left_column_body)
    EditableTableAligner.scroll(fixed_left_column_body, center_body)

  @scroll: (source, target) ->
    $(source).scroll ->
      target.scrollTop(parseInt(source.scrollTop()))


  @align_static_left_columns: (obj, xhr) ->
    orig_head = $("#" + obj.form_id).find('.centerContainer .scrollTargetContainter')
    head  = $("#" + obj.form_id).find(".fixedLeftColumn .table_head thead")
    # first clear the head, but only if not by XHR, head is not sent by ajax

    console.log(xhr)
    if xhr? && !xhr
      head.html("")
      # then fill it with actual data
      orig_head.find("thead tr").each (index, element) =>
        EditableTableAligner.move_cell_to_static_column(element, head)

      # can delete orid headcols when I duplicated them, otherwise the height info is wrong
      #$(orig_head).find(".headcol").remove()


    orig_body =  $("#" + obj.form_id).find('.centerContainer .detachedTableContainer')
    body  = $("#" + obj.form_id).find(".fixedLeftColumn .table_body tbody")
    # first clear the body
    body.html("")
    # then fill it with actual data
    orig_body.find("tr").each (index, element) =>
      EditableTableAligner.move_cell_to_static_column(element, body)

  # can delete orid headcols when I duplicated them, otherwise the height info is wrong
  #$(orig_body).find(".headcol").remove()

  @align_heights: (obj) ->
    ##################### !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!11
    ###################### omezim je na thead, tbody bude mit fixni vysku sloupcu, prepocinani s 500 radky, trva strasne dlouho
    #$("#" + obj.form_id).find('.fixedLeftColumn tr').each (index, element) =>

    $("#" + obj.form_id).find('.fixedLeftColumn thead tr').each (index, element) =>

      # loading paired tr of left column and right
      tr_left = $(element)

      # id of paired th and td elements
      height_align_id = tr_left.data("row-count-number")

      tr_center = $("#" + obj.form_id).find('.centerContainer tr[data-row-count-number="' + height_align_id + '"]').first()

      # carefull delete of height line by line, or scrolling will be lost
      # have to delete it from headers first, as it is not sent by ajax, othewwise it will increase with each ajax reload
      tr_left.css({
      'height': "",
      })
      tr_center.css({
      'height': "",
      })

      # determining max width
      td_left_height = tr_left.outerHeight()
      td_center_height = tr_center.outerHeight()

      if td_left_height > td_center_height
        max_height = td_left_height
      else
        max_height = td_center_height


      # setting max width
      tr_left.css({
      'height': max_height,
      })

      tr_center.css({
      'height': max_height,
      })

  @move_cell_to_static_column: (element, body) ->
    tr_element = $(element).clone()
    tr_element.html("")


    $(element).find('.headcol').each (i, e) =>
      orig_element = $(e)

      tr_element.append(orig_element)

    # remove it from old table
    #$(orig_element).remove()

    body.append(tr_element)


  @align_static_left_columns_after_row_update: (obj) ->
    orig_body =  $("#" + obj.form_id).find('.centerContainer .detachedTableContainer')

    # going trough all tr, and then filtering nlz by those who has head col, that means they were updated
    #orig_body.find("tr").each (index, element) =>
    # noooo going through only updated tr
    for row in EditableTableBuilder.obj.data
      do (row) ->
        element = $("#" + obj.form_id).find('.centerContainer tr[data-row-id="' + row.row_id + '"]')
        # finding destination row from orig row
        destination_row_id  = $(element).data("row-count-number")
        destination_row  = $("#" + obj.form_id).find('.fixedLeftColumn tr[data-row-count-number="' + destination_row_id + '"]')


        EditableTableAligner.move_cells_to_static_rows(element, destination_row)

  @move_cells_to_static_rows: (element, destination_row) ->
    if $(element).find('.headcol').length > 0
      # first clear the row before updating row
      destination_row.html("")

      $(element).find('.headcol').each (i, e) =>
        orig_element = $(e)

        destination_row.append(orig_element)

      # have copy colors of the center table to left column
      $(destination_row).attr("style", $(element).attr("style"))

window.EditableTableAligner = EditableTableAligner