odeum-app/lib/components/Help/Help.js

ODEUM Code Web App foundation modules

'use strict';

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

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

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

var _propTypes2 = _interopRequireDefault(_propTypes);

var _HelpStyles = require('./HelpStyles');

var _HelpReducer = require('../utils/HelpReducer');

var _HelpPopUp = require('./HelpPopUp');

var _HelpPopUp2 = _interopRequireDefault(_HelpPopUp);

var _HelpData = require('./HelpData');

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

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var Help = function (_Component) {
	_inherits(Help, _Component);

	function Help(props) {
		_classCallCheck(this, Help);

		var _this = _possibleConstructorReturn(this, (Help.__proto__ || Object.getPrototypeOf(Help)).call(this, props));

		_this.setHelpPopUpRef = function (node) {
			_this.node = node;
		};

		_this.getHelpItem = function (helpID) {
			/* async  */
			var data = (0, _HelpData.GetHelpItem)(helpID); // async/await the stuff / or make a Promise
			return data;
		};

		_this.getHelpData = function (helpID) {
			// api.get('/photos/8')
			// 	.then((response) => {
			// 		this.setState({ helpObj: response.data })
			// 	})
		};

		_this.componentDidMount = function () {
			//Delete when the API is implemented, only used to used a prepared object to test.
			var data = _this.getHelpItem((0, _HelpReducer.GetHelpID)());
			_this.setState({ helpObj: data });
		};

		_this.onClickOutside = function (e) {
			if (_this.state.openHelp) {
				if (_this.node !== null && _this.node !== undefined) if (!_this.node.contains(e.target)) {
					_this.setState({ openHelp: false });
					document.removeEventListener('click', _this.onClickOutside, false);
				}
			}
		};

		_this.openHelp = function () {
			document.addEventListener('click', _this.onClickOutside, false);
			_this.setState({ openHelp: !_this.state.openHelp });
		};

		_this.renderHelp = function () {

			return _react2.default.createElement(_HelpPopUp2.default, {
				small: _this.props.small,
				helpID: (0, _HelpReducer.GetHelpID)(),
				innerRef: _this.setHelpPopUpRef,
				helpObj: _this.state.helpObj,
				openHelp: _this.props.showHelp ? _this.props.showHelp : _this.state.openHelp });
		};

		_this.state = {
			openHelp: false,
			helpObj: null
		};
		return _this;
	}
	//#region Rendering


	_createClass(Help, [{
		key: 'render',
		value: function render() {
			var small = this.props.small;

			return small ? _react2.default.createElement(
				_react2.default.Fragment,
				null,
				this.renderHelp()
			) : _react2.default.createElement(
				_HelpStyles.HelpDiv,
				null,
				_react2.default.createElement(
					_HelpStyles.HelpButton,
					{ onClick: this.openHelp },
					_react2.default.createElement(_HelpStyles.HelpIcon, { icon: 'help', style: { marginRight: "0px" } }),
					!this.props.small ? _react2.default.createElement(
						_HelpStyles.Bold,
						null,
						this.props.helpLabel
					) : null
				),
				this.renderHelp()
			);
		}
		//#endregion

	}]);

	return Help;
}(_react.Component);

Help.propTypes = {
	helpLabel: _propTypes2.default.string,
	small: _propTypes2.default.bool
};

Help.defaultProps = {
	helpLabel: 'Need help?'
};

exports.default = Help;