ducky/web
ducky/web/src/pages/login.jsx
Implement subscriptions. Create a Subscription model and a Subscriptions collection, and attach them to the app context. Add a helper to our Profile model to retrieve the Subscription of that model. Still not sure this should be on the Profile--wouldn't it be better on the Me model? Isn't that generally where we would need it?
| paddy@0 | 1 import app from 'ampersand-app' |
| paddy@0 | 2 import React from 'react' |
| paddy@0 | 3 import localLinks from 'local-links' |
| paddy@0 | 4 import LaddaButton from 'react-ladda' |
| paddy@0 | 5 import LaddaCSS from '../../node_modules/ladda/dist/ladda.min.css' |
| paddy@0 | 6 import HeroUnit from '../components/hero' |
| paddy@0 | 7 import onboardingStyles from '../styles/onboarding.scss' |
| paddy@0 | 8 |
| paddy@0 | 9 export default React.createClass({ |
| paddy@0 | 10 displayName: 'LoginPage', |
| paddy@0 | 11 |
| paddy@0 | 12 getInitialState () { |
| paddy@0 | 13 return {active: false, progress: 0} |
| paddy@0 | 14 }, |
| paddy@0 | 15 |
| paddy@0 | 16 toggle () { |
| paddy@0 | 17 this.setState({active: !this.state.active}) |
| paddy@0 | 18 }, |
| paddy@0 | 19 |
| paddy@0 | 20 onBackClick (event) { |
| paddy@0 | 21 event.preventDefault() |
| paddy@0 | 22 window.history.back() |
| paddy@0 | 23 }, |
| paddy@0 | 24 |
| paddy@0 | 25 render () { |
| paddy@0 | 26 return ( |
| paddy@0 | 27 <div className='container'> |
| paddy@0 | 28 <HeroUnit title='Welcome Back'>We missed you.</HeroUnit> |
| paddy@0 | 29 <article className='onboarding login'> |
| paddy@0 | 30 <form> |
| paddy@0 | 31 <div> |
| paddy@0 | 32 <label htmlFor='emailLoginInput'>Email</label> |
| paddy@0 | 33 <input id='emailLoginInput' type='email'/> |
| paddy@0 | 34 |
| paddy@0 | 35 <label htmlFor='passwordLoginInput'>Passphrase</label> |
| paddy@0 | 36 <input id='passwordLoginInput' type='password'/> |
| paddy@0 | 37 |
| paddy@0 | 38 </div> |
| paddy@0 | 39 </form> |
| paddy@0 | 40 <div className='actionbuttons'> |
| paddy@0 | 41 <button onClick={this.onBackClick}>Back</button> |
| paddy@0 | 42 <LaddaButton style='expand-right' active={this.state.active} progress={this.state.progress}> |
| paddy@0 | 43 <button onClick={this.toggle} className='primary'>Login</button> |
| paddy@0 | 44 </LaddaButton> |
| paddy@0 | 45 </div> |
| paddy@0 | 46 </article> |
| paddy@0 | 47 </div> |
| paddy@0 | 48 ) |
| paddy@0 | 49 } |
| paddy@0 | 50 }) |