<div class="SignupForm">
{{> @children}}
</div>
{
"children": [
{
"component": "form",
"context": {
"modifier": "u-space-margin-bottom-0 js-form-signup",
"id": "signup",
"children": [
{
"component": "heading",
"context": {
"level": 2,
"text": "Start Your Free Trial",
"modifier": "u-text-size-600 u-text-weight-semibold _centered u-space-margin-bottom-0"
}
},
{
"component": "fineprint",
"context": {
"text": "Start risk-free. No credit card required.",
"modifier": "u-text-weight-normal u-space-margin-top-0 u-space-margin-bottom-500 _centered"
}
},
{
"component": "inputgroup",
"context": {
"children": [
{
"component": "input",
"context": {
"id": "first_name",
"label": "First Name",
"type": "text",
"name": "first_name",
"required": true,
"maxlength": "30",
"includeerror": true
}
},
{
"component": "input",
"context": {
"id": "last_name",
"label": "Last Name",
"type": "text",
"name": "last_name",
"required": true,
"maxlength": "30",
"includeerror": true
}
}
]
}
},
{
"component": "input",
"context": {
"id": "email",
"label": "Email",
"type": "email",
"name": "email",
"required": true,
"maxlength": "75",
"includeerror": true
}
},
{
"component": "input",
"context": {
"id": "password",
"label": "Password",
"type": "password",
"name": "password",
"labelfor": "password",
"actiontext": "Show Password",
"actionmodifier": "_right u-text-size-100 js-toggle-password",
"actionarialabel": "Show password as plain text. Note: this will visually expose your password on the screen.",
"required": true,
"minlength": "8",
"includeerror": true
}
},
{
"component": "select-planlist",
"context": {
"label": "Select a Plan",
"id": "plan_name",
"name": "plan_name",
"required": true
}
},
{
"component": "row",
"context": {
"style": "text-align: center;",
"children": [
{
"component": "column",
"context": {
"span": 12,
"children": [
{
"component": "button",
"context": {
"type": "submit",
"text": "Start Your Free Trial",
"modifier": "_large _submit u-space-margin-top-500"
}
},
{
"component": "fineprint",
"context": {
"text": "Start risk-free. No credit card required. By clicking “Start Your Free Trial” you agree to the <a href=\"http://sproutsocial.com/terms\" target=\"_blank\">Terms of Service</a> and <a href=\"http://sproutsocial.com/privacy-policy\" target=\"_blank\">Privacy Policy</a>.",
"modifier": "u-text-weight-normal _centered u-space-margin-top-300"
}
}
]
}
}
]
}
}
]
}
}
]
}
import '@sproutsocial/sprout-brand/modules/polyfills/smooth-scroll';
export function planChanger(event) {
const eventTarget = event.currentTarget;
const targetEl = document.querySelector(eventTarget.hash);
if (targetEl) {
const planNameField = targetEl.querySelector('[name="plan_name"]');
const planNewValue = eventTarget.hasAttribute('data-plan')
? eventTarget.getAttribute('data-plan')
: 'premium_v5';
if (planNameField.tagName.toLowerCase() === 'select') {
planNameField.value = planNewValue;
} else {
if (planNameField.type === 'radio') {
const radio = targetEl.querySelector('[value="' + planNewValue + '"]');
if (radio) {
radio.checked = true;
}
}
}
targetEl.scrollIntoView({behavior: 'smooth'});
}
}
export default planChanger;
import {ajax} from '@sproutsocial/sprout-brand/modules/util';
import serialize from 'form-serialize';
const appUrl = 'https://app.sproutsocial.com/';
const defaultOptions = {
appUrl: appUrl,
apiUrl: appUrl
};
const ErrorMessage = {
GENERAL:
'There was an issue creating your account. Please try again or contact us at <a href="mailto:support@sproutsocial.com">support@sproutsocial.com</a> or 866.878.3231 for help.',
INVALID_DATA:
'The signup form is missing one or more required fields or contains fields longer than maximum input.',
200: 'That email address is already in use. <a href="https://app.sproutsocial.com/login/">Log in</a> instead.',
201: 'There is a pending invitation for that email. Please check your inbox or contact the account owner to resend.'
};
function getSignupError(error) {
if (error.message) return ErrorMessage.GENERAL; // if Network Error, the rest won't apply
const errorData = error ? error.data.error : null;
const hasSubcode = errorData && errorData.subcode_v2 && ErrorMessage.hasOwnProperty(errorData.subcode_v2);
if (hasSubcode) {
return ErrorMessage[errorData.subcode_v2];
} else if (error.status === 400) {
return ErrorMessage.INVALID_DATA;
} else {
return ErrorMessage.GENERAL;
}
}
function logErrorToGTM(error) {
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: 'signupError',
errorStatus: error.status ? error.status : null,
errorData: error.data ? error.data : null,
errorMessage: error.message ? error.message : null
});
}
export const postSignup = options => {
const {appUrl, apiUrl} = Object.assign({}, defaultOptions, options);
return event => {
event.preventDefault();
const form = event.target;
const formData = serialize(form, {hash: true});
const submitButton = form.querySelector('button[type=submit]');
submitButton.classList.add('is-loading');
ajax
.request({
url: `${apiUrl}api/customers/signup/`,
method: 'post',
data: JSON.stringify(formData),
withCredentials: true
})
.then(response => {
const customerId = response.data.data.customer_id || '';
window.location = `${appUrl}signup/goToStepTwo/${customerId}`;
})
.catch(error => {
logErrorToGTM(error);
window.snackBar({
text: getSignupError(error)
});
submitButton.classList.remove('is-loading');
});
};
};
export default postSignup;
There are no notes for this item.