'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _immutable = require('immutable');

var _immutable2 = _interopRequireDefault(_immutable);

var _RecordButtonBar = require('./RecordButtonBar');

var _RecordButtonBar2 = _interopRequireDefault(_RecordButtonBar);

var _RecordFormSelector = require('./RecordFormSelector');

var _RecordFormSelector2 = _interopRequireDefault(_RecordFormSelector);

var _RecordHistory = require('./RecordHistory');

var _RecordHistory2 = _interopRequireDefault(_RecordHistory);

var _RecordHeader = require('../../../styles/cspace-ui/RecordHeader.css');

var _RecordHeader2 = _interopRequireDefault(_RecordHeader);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

const propTypes = {
  config: _propTypes2.default.object,
  data: _propTypes2.default.instanceOf(_immutable2.default.Map),
  dockTop: _propTypes2.default.number,
  formName: _propTypes2.default.string,
  isCloneable: _propTypes2.default.bool,
  isDeletable: _propTypes2.default.bool,
  isDeprecated: _propTypes2.default.bool,
  isModified: _propTypes2.default.bool,
  isReadPending: _propTypes2.default.bool,
  isSavePending: _propTypes2.default.bool,
  readOnly: _propTypes2.default.bool,
  recordType: _propTypes2.default.string.isRequired,
  showDeprecationButtons: _propTypes2.default.bool,
  validationErrors: _propTypes2.default.instanceOf(_immutable2.default.Map),
  onCloneButtonClick: _propTypes2.default.func,
  onCommit: _propTypes2.default.func,
  onDeprecateButtonClick: _propTypes2.default.func,
  onDeleteButtonClick: _propTypes2.default.func,
  onRevertButtonClick: _propTypes2.default.func,
  onSaveButtonClick: _propTypes2.default.func,
  onSaveButtonErrorBadgeClick: _propTypes2.default.func,
  onUndeprecateButtonClick: _propTypes2.default.func
}; /* global window */

class RecordHeader extends _react.Component {
  constructor(props) {
    super(props);
    this.setDomNode = this.setDomNode.bind(this);
    this.handleScroll = this.handleScroll.bind(this);

    this.state = {
      docked: false
    };
  }

  componentDidMount() {
    window.addEventListener('scroll', this.handleScroll, false);
  }

  componentWillUnmount() {
    window.removeEventListener('scroll', this.handleScroll, false);
  }

  setDomNode(ref) {
    this.domNode = ref;
  }

  handleScroll() {
    const node = this.domNode;

    if (!node) return;

    const dockTop = this.props.dockTop;


    if (this.state.docked) {
      if (window.scrollY + dockTop < node.offsetTop) {
        this.setState({
          docked: false
        });
      }
    } else if (window.scrollY + dockTop >= node.offsetTop) {
      this.setState({
        docked: true
      });
    }
  }

  render() {
    var _props = this.props;
    const config = _props.config,
          data = _props.data,
          dockTop = _props.dockTop,
          formName = _props.formName,
          isCloneable = _props.isCloneable,
          isDeletable = _props.isDeletable,
          isDeprecated = _props.isDeprecated,
          isModified = _props.isModified,
          isReadPending = _props.isReadPending,
          isSavePending = _props.isSavePending,
          readOnly = _props.readOnly,
          recordType = _props.recordType,
          showDeprecationButtons = _props.showDeprecationButtons,
          validationErrors = _props.validationErrors,
          onCloneButtonClick = _props.onCloneButtonClick,
          onCommit = _props.onCommit,
          onDeprecateButtonClick = _props.onDeprecateButtonClick,
          onDeleteButtonClick = _props.onDeleteButtonClick,
          onRevertButtonClick = _props.onRevertButtonClick,
          onSaveButtonClick = _props.onSaveButtonClick,
          onSaveButtonErrorBadgeClick = _props.onSaveButtonErrorBadgeClick,
          onUndeprecateButtonClick = _props.onUndeprecateButtonClick;
    const docked = this.state.docked;


    const className = docked ? _RecordHeader2.default.docked : _RecordHeader2.default.common;

    const inlineStyle = docked ? { height: this.domNode.offsetHeight } : {};

    const innerInlineStyle = docked ? { top: dockTop || 0 } : {};

    return _react2.default.createElement(
      'header',
      {
        className: className,
        style: inlineStyle,
        ref: this.setDomNode
      },
      _react2.default.createElement(
        'div',
        { style: innerInlineStyle },
        _react2.default.createElement(_RecordButtonBar2.default, {
          isCloneable: isCloneable,
          isDeletable: isDeletable,
          isDeprecated: isDeprecated,
          isModified: isModified,
          isReadPending: isReadPending,
          isSavePending: isSavePending,
          readOnly: readOnly,
          showDeprecationButtons: showDeprecationButtons,
          validationErrors: validationErrors,
          onCloneButtonClick: onCloneButtonClick,
          onDeprecateButtonClick: onDeprecateButtonClick,
          onDeleteButtonClick: onDeleteButtonClick,
          onRevertButtonClick: onRevertButtonClick,
          onSaveButtonClick: onSaveButtonClick,
          onSaveButtonErrorBadgeClick: onSaveButtonErrorBadgeClick,
          onUndeprecateButtonClick: onUndeprecateButtonClick
        }),
        _react2.default.createElement(_RecordFormSelector2.default, {
          config: config,
          formName: formName,
          recordType: recordType,
          onCommit: onCommit
        }),
        _react2.default.createElement(_RecordHistory2.default, {
          data: data,
          isModified: isModified,
          isSavePending: isSavePending
        })
      )
    );
  }
}

exports.default = RecordHeader;
RecordHeader.propTypes = propTypes;