Remove unused onboard.js

This commit is contained in:
Eric Schultz 2021-04-22 10:35:44 -05:00 committed by Eric Schultz
parent 63a4bfdfec
commit 7aa7f98c9a

View file

@ -1,280 +0,0 @@
// License: LGPL-3.0-or-later
const flyd = require('flimflam/flyd')
const h = require('flimflam/h')
const R = require('ramda')
const modal = require('flimflam/ui/modal')
const render = require('flimflam/render')
const wizard = require('flimflam/ui/wizard')
const validatedForm = require('flimflam/ui/validated-form')
const request = require('./request')
const notification = require('flimflam/ui/notification')
const fieldWithError = require('../components/field-with-error')
const init = () => {
const orgForm = validatedForm.init({constraints: constraints.org})
const contactForm = validatedForm.init({constraints: constraints.contact})
const infoForm = validatedForm.init({constraints: constraints.info})
const currentStep$ = flyd.mergeAll([
flyd.stream(0)
, flyd.map(R.always(1), orgForm.validSubmit$)
, flyd.map(R.always(2), infoForm.validSubmit$)
])
const wiz = wizard.init({currentStep$})
const openModal$ = flyd.stream()
document.querySelectorAll('[data-ff-open-onboard]')
.forEach(x => {x.addEventListener('click', openModal$)})
//flyd.map(trackGA, openModal$)
const response$ = flyd.flatMap(postData(orgForm, infoForm, contactForm), contactForm.validData$)
const respOk$ = flyd.filter(resp => resp.status === 200, response$)
const respErr$ = flyd.filter(resp => resp.status !== 200, response$)
const loading$ = flyd.mergeAll([
flyd.map(R.always(true), contactForm.validSubmit$)
, flyd.map(R.always(false), response$)
])
const message$ = flyd.mergeAll([
flyd.map(R.always("Saving your data..."), contactForm.validSubmit$)
, flyd.map(R.always("Thank you! Now redirecting..."), respOk$)
, flyd.map(resp => `There was an error: ${resp.body.error}`, respErr$)
])
const notif = notification.init({message$, hideDelay: 20000})
flyd.map(resp => {setTourCookies(resp.body.nonprofit); window.location = '/'}, respOk$)
return {
openModal$
, currentStep$
, wiz
, orgForm
, contactForm
, infoForm
, loading$
, notif
}
}
// const trackGA = () => {
// if(!ga) return
// ga('send', {
// hitType: 'event',
// eventCategory: 'ClickSignUp',
// eventAction: 'click',
// eventLabel: location.pathname
// })
// }
const setTourCookies = nonprofit => {
document.cookie = `tour_dashboard=${nonprofit.id};path=/`
document.cookie = `tour_campaign=${nonprofit.id};path=/`
document.cookie = `tour_event=${nonprofit.id};path=/`
document.cookie = `tour_profile=${nonprofit.id};path=/`
document.cookie = `tour_transactions=${nonprofit.id};path=/`
document.cookie = `tour_supporters=${nonprofit.id};path=/`
document.cookie = `tour_subscribers=${nonprofit.id};path=/`
}
const postData = (orgForm, infoForm) => contactFormData => {
const send = {
nonprofit: orgForm.validData$()
, extraInfo: infoForm.validData$()
, user: contactFormData
}
return request({
method: 'post'
, path: '/nonprofits/onboard'
, send
}).load
}
const constraints = {
org: {
name: {required: true}
, city: {required: true}
, state_code: {required: true}
, zip_code: {required: true}
}
, contact: {
email: {required: true, email: true}
, name: {required: true}
, phone: {required: true}
, password: {required: true, minLength: 7}
, password_confirmation: {required: true, matchesField: 'password'}
}
, info: {}
}
const view = state => {
return h('div', [
modal({
show$: state.openModal$
, body: onboardWizard(state)
, title: 'Get started'
})
, notification.view(state.notif)
])
}
const onboardWizard = state => {
const labels = [ 'Org', 'Info', 'Contact' ]
const steps = [ orgForm(state) , infoForm(state), contactForm(state) ]
return h('div', [
wizard.labels(state.wiz, labels)
, wizard.content(state.wiz, steps)
])
}
const pricingDetails = h('div.u-marginTop--15.u-padding--10.u-background--fog', [
h('p', [
"CommitChange uses "
, h('a.strong', {props: {href: 'https://www.stripe.com/', target :'_blank'}}, 'Stripe')
, ' to process transactions. Stripe takes a '
, h('strong', `${ENV.feeRate}% + ${ENV.perTransaction}¢`)
, ' processing fee on every transaction.'])
, h('p', [
'In order to support operations, feature development, and community building, '
, 'CommitChange takes an additional fee of '
, h('strong', `${ENV.platformFeeRate}%.`)
])
, h('p.u-marginBottom--0', [
"Our fee scales down as your transaction volume scales up. "
, h('a.strong', {props: {href: 'mailto:support@commitchange.com'}}, 'Contact us')
, " to chat about volume discounts."
])
])
const orgForm = state => {
const form = validatedForm.form(state.orgForm)
const field = fieldWithError(state.orgForm)
return h('div', [
form(h('form', [
h('fieldset', [
h('label', 'Organization Name')
, field(h('input', {props: {type: 'text', name: 'name', placeholder: ''}}))
])
, h('fieldset', [
h('label', 'Website URL')
, field(h('input', {props: {type: 'text', name: 'website', placeholder: 'https://your-website.org'}}))
])
, h('div.clearfix', [
h('fieldset.col-left-6.u-paddingRight--10', [
h('label', 'Org Email (public)')
, field(h('input', {props: {type: 'email', name: 'email', placeholder: 'example@name.org'}}))
])
, h('fieldset.col-left-6', [
h('label', 'Org Phone (public)')
, field(h('input', {props: {type: 'text', name: 'phone', placeholder: '(XXX) XXX-XXXX'}}))
])
])
, h('div.clearfix', [
h('fieldset.col-left-6.u-paddingRight--10', [
h('label', 'City')
, field(h('input', {props: {type: 'text', name: 'city', placeholder: ''}}))
])
, h('fieldset.col-left-3.u-paddingRight--10', [
h('label', 'State')
, field(h('input', {props: {type: 'text', name: 'state_code', placeholder: 'NY'}}))
])
, h('fieldset.col-left-3', [
h('label', 'Zip Code')
, field(h('input', {props: {type: 'text', name: 'zip_code', placeholder: ''}}))
])
])
, h('div', [
h('button.button', 'Next')
])
]))
])
}
const infoForm = state => {
const form = validatedForm.form(state.infoForm)
const field = fieldWithError(state.infoForm)
return h('div', [
form(h('form', [
h('div.u-marginBottom--20', [
h('fieldset', [
h('label', {props: {htmlFor: 'registered-npo-checkbox'}}, 'What kind of entity are you fundraising for?')
])
, h('fieldset', [
h('input', {props: {type: 'radio', name: 'entity_type', value: 'nonprofit', id: 'onboard-entity-nonprofit'}})
, h('label', {props: {htmlFor: 'onboard-entity-nonprofit'}}, 'A registered nonprofit')
])
, h('fieldset', [
h('input', {props: {type: 'radio', name: 'entity_type', value: 'forprofit', id: 'onboard-entity-forprofit'}})
, h('label', {props: {htmlFor: 'onboard-entity-forprofit'}}, 'A for-profit company')
])
, h('fieldset', [
h('input', {props: {type: 'radio', name: 'entity_type', value: 'unregistered', id: 'onboard-entity-unregistered'}})
, h('label', {props: {htmlFor: 'onboard-entity-unregistered'}}, 'An unregistered project, group, club, or other cause')
])
])
, h('div.u-marginBottom--20', [
h('fieldset', [
h('label', 'How do you want to use CommitChange?')
])
, h('fieldset', [
h('input', {props: {type: 'checkbox', name: 'use_donations', id: 'onboard-use-donations'}})
, h('label', {props: {htmlFor: 'onboard-use-donations'}}, 'Donation processing')
])
, h('fieldset', [
h('input', {props: {type: 'checkbox', name: 'use_crm', id: 'onboard-use-crm'}})
, h('label', {props: {htmlFor: 'onboard-use-crm'}}, 'Supporter relationship management')
])
, h('fieldset', [
h('input', {props: {type: 'checkbox', name: 'use_campaigns', id: 'onboard-use-campaigns'}})
, h('label', {props: {htmlFor: 'onboard-use-campaigns'}}, 'Campaign fundriasing')
])
, h('fieldset', [
h('input', {props: {type: 'checkbox', name: 'use_events', id: 'onboard-use-events'}})
, h('label', {props: {htmlFor: 'onboard-use-events'}}, 'Event pages and ticketing')
])
])
, h('fieldset', [
h('label', 'How did you hear about CommitChange?')
, field(h('input', {props: {type: 'text', name: 'how_they_heard', placeholder: 'Google, radio, referral, etc'}}))
])
, h('button.button', 'Next')
]))
])
}
const contactForm = state => {
const form = validatedForm.form(state.contactForm)
const field = fieldWithError(state.contactForm)
return h('div', [
form(h('form', [
h('div.clearfix', [
h('fieldset.col-left-6.u-paddingRight--10', [
h('label', 'Your Name')
, field(h('input', {props: {type: 'text', name: 'name', placeholder: 'Full Name'}}))
])
, h('fieldset.col-left-6', [
h('label', 'Your Email (used for login)')
, field(h('input', {props: {type: 'email', name: 'email', placeholder: 'youremail@example.com'}}))
])
])
, h('fieldset', [
h('label', 'New Password')
, field(h('input', {props: {type: 'password', name: 'password', placeholder: ''}}))
])
, h('fieldset', [
h('label', 'Retype Password')
, field(h('input', {props: {type: 'password', name: 'password_confirmation', placeholder: ''}}))
])
, h('fieldset', [
h('label', ['Your Phone', h('small', ' (for account recovery)')])
, field(h('input', {props: {type: 'text', name: 'phone', placeholder: '(XXX) XXX-XXXX'}}))
])
, h('button.button', {props: {disabled: state.loading$()}}, 'Save & Finish')
]))
])
}
const container = document.querySelector("#ff-render-onboard")
render(view, init(), container)