const CONFIG = require('./config')

const Placeholder = {}

/**
 * Creates an instance of Placeholder
 *
 * @param source {DOM Element}
 * @returns {Placeholder}
 * @static
 * @public
 */
Placeholder.create = function create(source) {
  return Object.create(Placeholder).init(source)
}

/**
 * Constructor method
 *
 * @param source {Positionsource}
 * @returns {Placeholder}
 * @instance
 * @private
 */
Placeholder.init = function init(source) {
  this.constructor = Placeholder
  this.$source     = global.$(source)
  this.$element    = null
  this.element     = null

  this.createElement()

  return this
}

/**
 * Creates the placeholder that will be used in place of the element
 * when the element is positioned absolutely or fixed
 *
 * @instance
 * @private
 *
 * @todo Float computation doesn't work on Firefox and IE9
 */
Placeholder.createElement = function createElement() {
  this.$element = global.$('<div>').addClass(CONFIG.PLACEHOLDER_CLASS)

  this.$element
    .attr('aria-hidden', 'true')
    .css('visibility', 'hidden')
    .hide()

  // Set the dimensions
  this.refresh()

  this.$element.insertAfter(this.$source)
  this.element = this.$element[0]
}

Placeholder.refresh = function refresh() {
  this.$element.css({
    height:  this.$source.height(),
    margin:  this.$source.css('margin'),
    float: this.$source.css('float'),
  })
}

module.exports = Placeholder
