# its set value of element in attrs.value
angular.module('EssayApp.directives').directive("ngSelect2", ["$timeout", ($timeout) ->
  restrict: 'A',
  scope: true,
  require: 'ngModel',

  link: (scope, element, attrs, ngModel) ->
    element.on 'select2:close', ->
      # console.log 'select2:close'
      # console.log element, ngModel
      ngModel.$setTouched()
      element.trigger 'focusout'

    element.on 'select2:select', ->
      # console.log 'select2:select'

    element.on 'select2:unselect', ->
      # console.log 'select2:unselect'
      ngModel.$setUntouched()
      ngModel.$setPristine()

    element.on 'select2:opening', ->
      els = element.find('option')
      if els.length > 1
        _blank = (element.val()=="")
        els.filter('[value=""]').remove()
        element.val(null) if _blank
        element.trigger('change')

    initSelect = ()->
      if attrs.languageList
        _render = (data)->
          # We only really care if there is an element to pull classes from
          if (!data.element)
            return data.text
          $element = $(data.element)
          $wrapper = $('<span></span>')
          $flag = $('<span></span>')
          $flag.addClass('flag ' + $element[0].className)
          $wrapper.html($flag)
          $wrapper.append(data.text)
          return $wrapper

        element.select2
          templateSelection: _render
          templateResult: _render

      else if attrs.keepClasses
        element.select2
          templateResult: (data)->
            # We only really care if there is an element to pull classes from
            if (!data.element)
              return data.text

            $element = $(data.element)
            $wrapper = $('<span></span>')
            $wrapper.addClass($element[0].className)

            $wrapper.text(data.text)

            return $wrapper

      else
        element.select2()

      # element.on 'change', ->
      #   element.trigger('focusout')

    updateSelection = ->
      if attrs?.ngSelect2Placeholder?
        element.data('placeholder', scope.$eval(attrs?.ngSelect2Placeholder) || 'Select...')

      $timeout (->
        if ngModel.$isEmpty(ngModel.$modelValue) || (ngModel.$validators?.inclusion? &&
            !ngModel.$validators.inclusion(ngModel.$modelValue))
          element.val(null)

          ngModel.$setUntouched()
        element.trigger('change.select2')

        $timeout (->
          if attrs?.ngSelect2Important?
            ngModel.$setTouched()
            element.trigger('focusout')
        ), 50, false
        # ngModel.validate
      ), 1, false

    scope.$watch attrs.ngModel, (value, old_value)->
      if old_value? && !value? && attrs.cleareable
        ngModel?.$setUntouched()
      updateSelection()
      element.trigger('focusout')

    scope.$watch attrs.ngSelect2, (value, old_value)->
      $timeout (->
        initSelect()
        updateSelection()
      ), 1, false

])