import React from 'react'; class PublishMetadataInputs extends React.Component { constructor (props) { super(props); this.state = { showInputs : false, descriptionLimit : 100, descriptionHeight: '', }; this.toggleShowInputs = this.toggleShowInputs.bind(this); this.handleDescriptionInput = this.handleDescriptionInput.bind(this); this.handleNsfwCheck = this.handleNsfwCheck.bind(this); this.handleLicenseSelection = this.handleLicenseSelection.bind(this); this.setDescriptionTextBoxHeight = this.setDescriptionTextBoxHeight.bind(this); } toggleShowInputs () { this.setState({'showInputs': !this.state.showInputs}); } handleDescriptionInput (event) { event.preventDefault(); const name = event.target.name; const value = event.target.value; this.props.onMetadataChange(name, value); this.setDescriptionTextBoxHeight(event); } setDescriptionTextBoxHeight (event) { const scrollHeight = event.target.scrollHeight; // console.log('scrollHeight:', scrollHeight); const height = Math.min(scrollHeight, this.state.descriptionLimit) + 'px'; this.setState({descriptionHeight: height}); } handleNsfwCheck (event) { console.log('handle input', event); event.preventDefault(); const name = event.target.name; const value = event.target.checked; this.props.onMetadataChange(name, value); } handleLicenseSelection (event) { const name = event.target.name; const selectedOption = event.target.selectedOptions[0].value; this.props.onMetadataChange(name, selectedOption); } render () { return (
{this.state.showInputs ? '[less]' : '[more]'} {this.state.showInputs && (