Vulcan/packages/base-components/lib/common/NewsletterForm.jsx

97 lines
2.4 KiB
React
Raw Normal View History

2016-03-18 11:53:46 +09:00
import React, { PropTypes, Component } from 'react';
import Formsy from 'formsy-react';
import FRC from 'formsy-react-components';
import Actions from "../actions.js";
import { Button } from 'react-bootstrap';
2016-03-18 11:53:46 +09:00
import Core from "meteor/nova:core";
const Messages = Core.Messages;
const Input = FRC.Input;
class NewsletterForm extends Component {
constructor() {
super();
this.subscribeEmail = this.subscribeEmail.bind(this);
this.subscribeUser = this.subscribeUser.bind(this);
}
subscribeEmail(data) {
console.log(data)
Actions.call("addEmailToMailChimpList", data.email, (error, result) => {
2016-03-18 11:53:46 +09:00
if (error) {
console.log(error)
Messages.flash(error.message, "error");
} else {
Messages.flash(this.props.successMessage, "success");
}
});
}
subscribeUser() {
Actions.call("addCurrentUserToMailChimpList", (error, result) => {
2016-03-18 11:53:46 +09:00
if (error) {
console.log(error)
Messages.flash(error.message, "error");
} else {
Messages.flash(this.props.successMessage, "success");
}
});
}
renderForm() {
return (
2016-03-25 10:45:28 +09:00
<Formsy.Form className="newsletter-form" onSubmit={this.subscribeEmail}>
2016-03-18 11:53:46 +09:00
<Input
name="email"
value=""
2016-03-25 10:45:28 +09:00
placeholder={this.props.labelText}
2016-03-18 11:53:46 +09:00
type="text"
2016-03-25 10:45:28 +09:00
layout="elementOnly"
2016-03-18 11:53:46 +09:00
/>
<Button bsStyle="primary">{this.props.buttonText}</Button>
2016-03-18 11:53:46 +09:00
</Formsy.Form>
)
}
renderButton() {
return (
2016-03-25 10:45:28 +09:00
<Button className="newsletter-button" onClick={this.subscribeUser} bsStyle="primary">{this.props.buttonText}</Button>
2016-03-18 11:53:46 +09:00
)
}
render() {
if (Telescope.settings.get("showBanner", true)) {
return (
<div className="newsletter">
2016-03-25 10:45:28 +09:00
<h4 className="newsletter-tagline">{this.props.headerText}</h4>
{this.context.currentUser ? this.renderButton() : this.renderForm()}
2016-03-18 11:53:46 +09:00
</div>
)
} else {
return null
}
}
}
NewsletterForm.propTypes = {
headerText: React.PropTypes.string,
labelText: React.PropTypes.string,
buttonText: React.PropTypes.string,
successMessage: React.PropTypes.string
}
NewsletterForm.defaultProps = {
headerText: "Subscribe to the newsletter",
labelText: "Your Email",
buttonText: "Subscribe",
successMessage: "Thanks for subscribing!"
};
2016-03-25 10:45:28 +09:00
NewsletterForm.contextTypes = {
currentUser: React.PropTypes.object
};
2016-03-18 11:53:46 +09:00
module.exports = NewsletterForm;
export default NewsletterForm;